Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Need a block editor control for a custom select list #37

Open
bobbingwide opened this issue Jun 27, 2020 · 1 comment
Open

Need a block editor control for a custom select list #37

bobbingwide opened this issue Jun 27, 2020 · 1 comment
Assignees
Labels
enhancement New feature or request

Comments

@bobbingwide
Copy link
Owner

bobbingwide commented Jun 27, 2020

Many of the shortcodes for which I'm creating block editor front ends have attributes which can either be chosen from a pre-defined list or can have custom values.
e.g.

Field Values
post_type can be any one of the post types that exist in the system, or a set or comma separated post types
orderby date / ID / title / parent
format a sequence of characters representing fields and the order in which they're displayed
fields a list of fields to display, one per column of a table

Requirements

  • A control that can display the standard options but also allows the custom value to be entered.
  • When the field contains the Custom value the select list should indicate this somehow
  • Preferably use existing Gutenberg code.

Advanced requirements

  • Multiple selection of predefined options with a user defined order
  • Ability to display icons and other non-text data in the "selection" part of the list

Proposals seen elsewhere

Blocks

Nivo - I prototyped this with the theme field being a text input that was shared with a select list called t2. See #10 ?
Shortcode block - With the shortcode text field and drop down list

Meetup Cheltenham

This subject was very recently discussed in #meetup-cheltenham UK WordPress Slack. A suggestion was

  • to fake it with a faux dropdown and a normal text input
  • Use JS in some way to populate the text input with whatever you select from the faux input,
  • but also have it manually editable
  • Dave Beesley created a CodePen https://codepen.io/davebeesley/pen/NWxvqpg
  • hide the select unless the input is focused, then only let the user select from the dropdown

Windows print - Pages field

In Windows, when printing, the Pages field allows customised values.

image

@bobbingwide bobbingwide added the enhancement New feature or request label Jun 27, 2020
@bobbingwide bobbingwide self-assigned this Jun 27, 2020
@bobbingwide
Copy link
Owner Author

Ability to display icons and other non-text data in the "selection" part of the list

Gutenberg provides a CustomSelectControl which allows users to select an item from a single-option menu just like SelectControl, with the addition of being able to provide custom styles for each item in the menu. This means it does not use a native , so should only be used if the custom styling is necessary.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

1 participant