| @@ -17,9 +17,8 @@ | ||
| 17 | 17 | * |
| 18 | 18 | * @since 0.0.1 |
| 19 | 19 | */ |
| 20 | 20 | class Input_Markup extends Base { |
| 21 | - | |
| 22 | 21 | /** |
| 23 | 22 | * Maximum length of text allowed for an input field. |
| 24 | 23 | * |
| 25 | 24 | * @var string |
| @@ -27,8 +26,31 @@ | ||
| 27 | 26 | */ |
| 28 | 27 | protected $max_text_length; |
| 29 | 28 | |
| 30 | 29 | /** |
| 30 | + * Input mask for the input field. | |
| 31 | + * | |
| 32 | + * @var string | |
| 33 | + * @since 0.0.11 | |
| 34 | + */ | |
| 35 | + protected $input_mask; | |
| 36 | + /** | |
| 37 | + * Custom input mask for the input field. | |
| 38 | + * | |
| 39 | + * @var string | |
| 40 | + * @since 0.0.11 | |
| 41 | + */ | |
| 42 | + protected $custom_input_mask; | |
| 43 | + | |
| 44 | + /** | |
| 45 | + * Read-only attribute for the input field. | |
| 46 | + * | |
| 47 | + * @var bool | |
| 48 | + * @since 1.7.2 | |
| 49 | + */ | |
| 50 | + protected $read_only; | |
| 51 | + | |
| 52 | + /** | |
| 31 | 53 | * Initialize the properties based on block attributes. |
| 32 | 54 | * |
| 33 | 55 | * @param array<mixed> $attributes Block attributes. |
| 34 | 56 | * @since 0.0.2 |
| @@ -33,17 +55,20 @@ | ||
| 33 | 55 | * @param array<mixed> $attributes Block attributes. |
| 34 | 56 | * @since 0.0.2 |
| 35 | 57 | */ |
| 36 | 58 | public function __construct( $attributes ) { |
| 37 | - $this->slug = 'input'; | |
| 38 | - $this->max_text_length = isset( $attributes['textLength'] ) ? $attributes['textLength'] : ''; | |
| 59 | + $this->slug = 'input'; | |
| 60 | + $this->max_text_length = $attributes['textLength'] ?? ''; | |
| 61 | + $this->input_mask = $attributes['inputMask'] ?? ''; | |
| 62 | + $this->custom_input_mask = 'custom-mask' === $this->input_mask && isset( $attributes['customInputMask'] ) ? $attributes['customInputMask'] : ''; | |
| 39 | 63 | $this->set_properties( $attributes ); |
| 40 | - $this->set_input_label( __( 'Text Field', 'sureforms' ) ); | |
| 64 | + $this->read_only = ! empty( $this->default ) && $attributes['readOnly']; | |
| 65 | + $this->set_input_label( __( 'Text field', 'sureforms' ) ); | |
| 41 | 66 | $this->set_error_msg( $attributes, 'srfm_input_block_required_text' ); |
| 42 | 67 | $this->set_duplicate_msg( $attributes, 'srfm_input_block_unique_text' ); |
| 43 | 68 | $this->set_unique_slug(); |
| 44 | 69 | $this->set_field_name( $this->unique_slug ); |
| 45 | - $this->set_markup_properties( $this->input_label ); | |
| 70 | + $this->set_markup_properties( $this->input_label, true ); | |
| 46 | 71 | $this->set_aria_described_by(); |
| 47 | 72 | $this->set_label_as_placeholder( $this->input_label ); |
| 48 | 73 | } |
| 49 | 74 | |
| @@ -50,19 +75,23 @@ | ||
| 50 | 75 | /** |
| 51 | 76 | * Render input markup |
| 52 | 77 | * |
| 53 | 78 | * @since 0.0.2 |
| 54 | - * @return string|boolean | |
| 79 | + * @return string|bool | |
| 55 | 80 | */ |
| 56 | 81 | public function markup() { |
| 82 | + $data_config = $this->field_config; | |
| 83 | + | |
| 84 | + $this->class_name = $this->get_field_classes( $this->read_only ? [ 'srfm-read-only' ] : [] ); | |
| 85 | + | |
| 57 | 86 | ob_start(); ?> |
| 58 | - <div data-block-id="<?php echo esc_attr( $this->block_id ); ?>" class="srfm-block-single srfm-block srfm-<?php echo esc_attr( $this->slug ); ?>-block srf-<?php echo esc_attr( $this->slug ); ?>-<?php echo esc_attr( $this->block_id ); ?>-block<?php echo esc_attr( $this->block_width ); ?><?php echo esc_attr( $this->class_name ); ?> <?php echo esc_attr( $this->conditional_class ); ?>"> | |
| 87 | + <div data-block-id="<?php echo esc_attr( $this->block_id ); ?>" class="<?php echo esc_attr( $this->class_name ); ?>" <?php echo $data_config ? "data-field-config='" . esc_attr( $data_config ) . "'" : ''; ?>> | |
| 59 | 88 | <?php echo wp_kses_post( $this->label_markup ); ?> |
| 60 | 89 | <?php echo wp_kses_post( $this->help_markup ); ?> |
| 61 | 90 | <div class="srfm-block-wrap"> |
| 62 | 91 | <input class="srfm-input-common srfm-input-<?php echo esc_attr( $this->slug ); ?>" type="text" name="<?php echo esc_attr( $this->field_name ); ?>" id="<?php echo esc_attr( $this->unique_slug ); ?>" |
| 63 | 92 | <?php echo ! empty( $this->aria_described_by ) ? "aria-describedby='" . esc_attr( trim( $this->aria_described_by ) ) . "'" : ''; ?> |
| 64 | - aria-required="<?php echo esc_attr( strval( $this->aria_require_attr ) ); ?>" data-unique="<?php echo esc_attr( $this->aria_unique ); ?>" maxlength="<?php echo esc_attr( $this->max_text_length ); ?>" value="<?php echo esc_attr( $this->default ); ?>" <?php echo wp_kses_post( $this->placeholder_attr ); ?> /> | |
| 93 | + data-required="<?php echo esc_attr( strval( $this->data_require_attr ) ); ?>" aria-required="<?php echo esc_attr( $this->data_require_attr ); ?>" data-unique="<?php echo esc_attr( $this->aria_unique ); ?>" maxlength="<?php echo esc_attr( $this->max_text_length ); ?>" value="<?php echo esc_attr( $this->default ); ?>" <?php echo wp_kses_post( $this->placeholder_attr ); ?> data-srfm-mask="<?php echo esc_attr( $this->input_mask ); ?>" <?php echo ! empty( $this->custom_input_mask ) ? 'data-custom-srfm-mask="' . esc_attr( $this->custom_input_mask ) . '"' : ''; ?> <?php echo $this->read_only ? 'readonly' : ''; ?> /> | |
| 65 | 94 | </div> |
| 66 | 95 | <div class="srfm-error-wrap"> |
| 67 | 96 | <?php echo wp_kses_post( $this->duplicate_msg_markup ); ?> |
| 68 | 97 | </div> |