12, 'type' => 'small-header', 'title' => __('Options', 'wp-ultimo'), 'desc' => __('Add different options below. The first option is used as the default.', 'wp-ultimo'), ]; $editor_fields['options_empty'] = [ 'type' => 'note', 'desc' => __('Add the first option using the button below.', 'wp-ultimo'), 'classes' => 'wu-text-gray-600 wu-text-xs wu-text-center wu-w-full', 'wrapper_classes' => 'wu-bg-gray-100 wu-items-end', 'order' => 13, 'wrapper_html_attr' => [ 'v-if' => 'options.length === 0', 'v-cloak' => '1', ], ]; $editor_fields['options'] = [ 'order' => 14, 'type' => 'group', 'tooltip' => '', 'wrapper_classes' => 'wu-relative wu-bg-gray-100', 'wrapper_html_attr' => [ 'v-if' => 'options.length', 'v-for' => '(option, index) in options', 'v-cloak' => '1', ], 'fields' => [ 'options_remove' => [ 'type' => 'note', 'desc' => sprintf('', __('Remove', 'wp-ultimo')), 'wrapper_classes' => 'wu-absolute wu-top-0 wu-right-0', ], 'options_key' => [ 'type' => 'text', 'title' => __('Option Value', 'wp-ultimo'), 'placeholder' => __('e.g. option1', 'wp-ultimo'), 'wrapper_classes' => 'wu-w-1/2 wu-mr-2', 'html_attr' => [ 'v-model' => 'option.key', 'steps' => 1, 'v-bind:name' => '"options[" + index + "][key]"', ], ], 'options_label' => [ 'type' => 'text', 'title' => __('Label', 'wp-ultimo'), 'placeholder' => __('e.g. Option 1', 'wp-ultimo'), 'wrapper_classes' => 'wu-w-1/2 wu-ml-2', 'html_attr' => [ 'v-model' => 'option.label', 'v-bind:name' => '"options[" + index + "][label]"', ], ], ], ]; $editor_fields['repeat_select_option'] = [ 'order' => 16, 'type' => 'submit', 'title' => __('+ Add option', 'wp-ultimo'), 'classes' => 'wu-uppercase wu-text-2xs wu-text-blue-700 wu-border-none wu-bg-transparent wu-font-bold wu-text-right wu-w-full wu-cursor-pointer', 'wrapper_classes' => 'wu-bg-gray-100 wu-items-end', 'wrapper_html_attr' => [ 'v-cloak' => '1', ], 'html_attr' => [ 'type' => 'button', 'v-on:click.prevent' => '() => options.push({})', ], ]; return $editor_fields; } /** * Returns the field/element actual field array to be used on the checkout form. * * @since 2.0.0 * * @param array $attributes Attributes saved on the editor form. * @return array An array of fields, not the field itself. */ public function to_fields_array($attributes) { $options = []; foreach ($attributes['options'] as $_option) { $options[ $_option['key'] ] = $_option['label']; } return [ $attributes['id'] => [ 'type' => 'select', 'id' => $attributes['id'], 'name' => $attributes['name'], 'placeholder' => $attributes['placeholder'], 'tooltip' => $attributes['tooltip'], 'default' => $attributes['default_value'], 'required' => $attributes['required'], 'wrapper_classes' => $attributes['element_classes'], 'options' => $options, 'value' => $this->get_value(), ], ]; } }