" row and the secret field. Each returns escaped * HTML in the chrome's recipes (assets/src/fields.css); the page echoes it through Markup::out(). The widths (`xs`), a * button's and a field row's `reason` and the help tied to its control are options of Ui's own builders. * * The behaviour is the library's: assets/fields.js (the colour's swatch and hex kept in step, a segmented switch that * falls back to radios when it does not fit, a secret's Replace, the media picker's Choose and Remove) and * assets/board.js (an ordered list's and a media picker's rows moved by their grip, as a board's cards). A builder * enqueues what it needs, so a screen without one pays nothing. * * @package RoosterAdmin */ namespace Rooster\Admin; defined( 'ABSPATH' ) || exit; /** * Static. */ final class Fields { /** * The longest option a segmented switch shows as a segment (FR9: "at most about 16 characters an option"); a * longer one makes the switch radios on one line from the start. */ public const SEGMENT_MAX = 20; /** * What a saved secret shows in place of its value (FR18: never revealed). */ public const MASK = '••••••••••••'; /** * A colour field (UI-Design-Patterns §6, "one look everywhere"): a swatch that opens the browser's picker and the * hex beside it, 10rem in all. The hex is the value posted (its `name`); the swatch has none, and the script keeps * the two in step. An empty value is the inherited one: the swatch shows `default`. * * With `alpha` (0.63.1) the text takes any CSS colour (`#rrggbbaa`, `rgb()`, `rgba()`, `hsl()`, a name, * `transparent`), checked in the browser (`CSS.supports( 'color', … )`; an invalid one is marked under the field * and blocks its card's Save), the swatch drawn over a checkerboard so a transparent colour reads as one, and the * browser's picker setting the red, green and blue while the alpha stays (transparent turns opaque: a colour picked * is a colour seen). See color_alpha(). * * @param string $name The name ('' for a script's own field: no name). * @param string $value The colour, `#rrggbb` or `#rgb` ('' for none); with `alpha`, any CSS colour. * @param array $opts id (the hex's id, the one a field row's label is for; default the name), label * (raw: the field's name; the swatch is ", colour picker"), default (the * swatch's colour while the value is empty), placeholder, required, disabled, * aria-label (the hex's own name, in a row without a label for it), attrs (on * the hex), alpha (0.63.1: true takes a colour with transparency), class (0.84.6: * more classes on the hex; a class in `attrs` is appended too, Ui::merge_attrs()). */ public static function color( string $name, string $value = '', array $opts = array() ): string { if ( ! empty( $opts['alpha'] ) ) { return self::color_alpha( $name, $value, $opts ); } $id = (string) ( $opts['id'] ?? $name ); $hex = self::hex( $value ); $label = (string) ( $opts['label'] ?? '' ); $swatch = '' !== $hex ? $hex : ( '' !== self::hex( (string) ( $opts['default'] ?? '' ) ) ? self::hex( (string) $opts['default'] ) : '#000000' ); wp_enqueue_script( 'rooster-admin-fields' ); $picker = array( 'type' => 'color', 'class' => 'rooster-admin-colour__swatch', 'value' => 4 === strlen( $swatch ) ? '#' . $swatch[1] . $swatch[1] . $swatch[2] . $swatch[2] . $swatch[3] . $swatch[3] : $swatch, /* translators: %s: the colour field's name. */ 'aria-label' => '' !== $label ? sprintf( __( '%s, colour picker', 'ai-eshop-optimizer' ), $label ) : __( 'Colour picker', 'ai-eshop-optimizer' ), 'disabled' => ! empty( $opts['disabled'] ), 'aria-hidden' => ! empty( $opts['disabled'] ) ? 'true' : null, // disabled, the hex speaks for both (and says why) 'data-ra-colour-swatch' => '', ); $text = Ui::input( $name, $value, array( 'id' => $id, 'code' => true, 'class' => trim( 'rooster-admin-colour__hex ' . (string) ( $opts['class'] ?? '' ) ), 'maxlength' => 7, 'pattern' => '#?([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6})', 'placeholder' => (string) ( $opts['placeholder'] ?? '' ), 'required' => ! empty( $opts['required'] ), 'disabled' => ! empty( $opts['disabled'] ), 'aria-label' => (string) ( $opts['aria-label'] ?? '' ), 'autocomplete' => 'off', 'attrs' => array( 'spellcheck' => 'false', 'data-ra-colour-hex' => '', ) + ( is_array( $opts['attrs'] ?? null ) ? $opts['attrs'] : array() ), ) ); return '' . $text . ''; } /** * A range (0.78.0; Rooster One's sitemap ranking: a signal's weight): the browser's slider in the section's accent, * its value said beside it (an `` for the slider, kept in step by the script). The server prints both as * they are; nothing is drawn again. The slider is the value posted (its `name`). * * @param string $name The name ('' for a script's own field: no name). * @param int|float|string $value The value (held within min and max). * @param array $opts id (the slider's, the one a field row's label is for; default the name), min (0), * max (100), step (1), unit (raw, after the value: "%", "px"), aria-label (the * slider's name in a row without a label for it), disabled, help (the row's help * id, said with the slider), attrs (on the slider). */ public static function range( string $name, $value, array $opts = array() ): string { $id = (string) ( $opts['id'] ?? $name ); $min = is_numeric( $opts['min'] ?? null ) ? (float) $opts['min'] : 0.0; $max = is_numeric( $opts['max'] ?? null ) ? (float) $opts['max'] : 100.0; $step = is_numeric( $opts['step'] ?? null ) && (float) $opts['step'] > 0 ? (float) $opts['step'] : 1.0; $now = max( $min, min( $max, is_numeric( $value ) ? (float) $value : $min ) ); $unit = (string) ( $opts['unit'] ?? '' ); $num = static fn( float $n ): string => rtrim( rtrim( number_format( $n, 4, '.', '' ), '0' ), '.' ); wp_enqueue_script( 'rooster-admin-fields' ); $slider = array( 'type' => 'range', 'class' => 'rooster-admin-range__input', 'id' => '' !== $id ? $id : null, 'name' => '' !== $name ? $name : null, 'min' => $num( $min ), 'max' => $num( $max ), 'step' => $num( $step ), 'value' => $num( $now ), 'aria-label' => '' !== (string) ( $opts['aria-label'] ?? '' ) ? (string) $opts['aria-label'] : null, 'aria-describedby' => ! empty( $opts['help'] ) ? $id . '-help' : null, 'disabled' => ! empty( $opts['disabled'] ), 'data-ra-range' => '', ); $slider = Ui::merge_attrs( $slider, $opts['attrs'] ?? null ); return '' . esc_html( $num( $now ) . $unit ) . ''; } /** * A colour as `#rrggbb` or `#rgb` (lower case), '' for anything else. * * @param string $value The value. */ public static function hex( string $value ): string { $value = strtolower( trim( $value ) ); $value = '' !== $value && '#' !== $value[0] ? '#' . $value : $value; return 1 === preg_match( '/^#([0-9a-f]{3}|[0-9a-f]{6})$/', $value ) ? $value : ''; } /** * The colour field that takes alpha (0.63.1, color()'s `alpha`): a chip over a checkerboard showing the colour as * it is (an SVG square filled with the value: no inline style), the browser's picker laid on it (its red, green and * blue), the text beside it posted as typed, wide enough for `rgba(255, 255, 255, 0.85)`. The script * (assets/fields.js) checks the text with the browser's own CSS parser, keeps the chip and the picker in step, and * marks an invalid value under the field (FR6: tied to it; FR11: its card's Save shows the summary). * * @param string $name The name. * @param string $value Any CSS colour ('' for none: the chip shows `default`). * @param array $opts See color(). */ private static function color_alpha( string $name, string $value, array $opts ): string { $id = (string) ( $opts['id'] ?? $name ); $label = (string) ( $opts['label'] ?? '' ); $value = trim( $value ); $default = trim( (string) ( $opts['default'] ?? '' ) ); $shown = '' !== $value ? $value : $default; $paint = self::paint( $shown ); wp_enqueue_script( 'rooster-admin-fields' ); $picker = array( 'type' => 'color', 'class' => 'rooster-admin-colour__swatch', 'value' => self::rgb( $shown ), /* translators: %s: the colour field's name. */ 'aria-label' => '' !== $label ? sprintf( __( '%s, colour picker', 'ai-eshop-optimizer' ), $label ) : __( 'Colour picker', 'ai-eshop-optimizer' ), 'disabled' => ! empty( $opts['disabled'] ), 'aria-hidden' => ! empty( $opts['disabled'] ) ? 'true' : null, 'data-ra-colour-swatch' => '', ); $text = Ui::input( $name, $value, array( 'id' => $id, 'code' => true, 'class' => trim( 'rooster-admin-colour__hex ' . (string) ( $opts['class'] ?? '' ) ), 'placeholder' => (string) ( $opts['placeholder'] ?? '' ), 'required' => ! empty( $opts['required'] ), 'disabled' => ! empty( $opts['disabled'] ), 'aria-label' => (string) ( $opts['aria-label'] ?? '' ), 'autocomplete' => 'off', 'attrs' => array( 'spellcheck' => 'false', 'data-ra-colour-hex' => '', ) + ( is_array( $opts['attrs'] ?? null ) ? $opts['attrs'] : array() ), ) ); $words = array( 'invalid' => __( 'Not a colour. Use a hex code (#1d2327, or #1d232780 with transparency), rgb(), rgba() or transparent.', 'ai-eshop-optimizer' ), ); return ' 'rooster-admin-colour is-alpha' . ( '' === $value ? ' is-empty' : '' ), 'data-ra-colour' => 'alpha', 'data-ra-colour-default' => '' !== $default ? $default : null, 'data-ra-words' => (string) wp_json_encode( $words ), ) ) . '>' . $text . ''; } /** * A value shaped as a CSS colour, safe as an SVG fill (lower case), '' for anything else: a hex of 3, 4, 6 or 8 * digits, a colour function of numbers (rgb(), rgba(), hsl(), hsla(), hwb(), lab(), lch(), oklab(), oklch(), * color()), or a word (a named colour, `transparent`, `currentcolor`). The shape only: the browser decides (a word * that names no colour paints nothing there). The alpha colour field's first paint. * * @param string $value The value. */ private static function paint( string $value ): string { $value = strtolower( trim( $value ) ); return 1 === preg_match( '/^(?:#(?:[0-9a-f]{3,4}|[0-9a-f]{6}|[0-9a-f]{8})|[a-z]+|(?:rgba?|hsla?|hwb|lab|lch|oklab|oklch|color)$[0-9a-z.,%\s\/+-]*$)$/', $value ) ? $value : ''; } /** * The red, green and blue of a colour as `#rrggbb`, for the browser's picker (it takes no alpha): a hex of any * length, or rgb() and rgba() in numbers or percentages; `#000000` for anything else (the script reads the rest from * the browser). * * @param string $value The colour. */ private static function rgb( string $value ): string { $value = strtolower( trim( $value ) ); if ( 1 === preg_match( '/^#([0-9a-f]{3,4}|[0-9a-f]{6}|[0-9a-f]{8})$/', $value, $m ) ) { $h = strlen( $m[1] ) <= 4 ? $m[1][0] . $m[1][0] . $m[1][1] . $m[1][1] . $m[1][2] . $m[1][2] : substr( $m[1], 0, 6 ); return '#' . $h; } if ( 1 === preg_match( '/^rgba?\(\s*([\d.]+%?)[\s,]+([\d.]+%?)[\s,]+([\d.]+%?)/', $value, $m ) ) { $hex = '#'; foreach ( array( $m[1], $m[2], $m[3] ) as $c ) { $n = str_ends_with( $c, '%' ) ? (float) $c * 255 / 100 : (float) $c; $hex .= sprintf( '%02x', max( 0, min( 255, (int) round( $n ) ) ) ); } return $hex; } return '#000000'; } /** * A segmented switch (two to four short options shown at once: alignment, all or any, a placement; FR9): radios, * so the choice posts with its form, the arrow keys move it and nothing needs a script; drawn as segments on the * one segmented recipe, the chosen one on the section's ink (FR10). It never wraps inside an option: an option * longer than SEGMENT_MAX characters, or `radios`, prints radios on one line from the start, and the script turns * a switch that does not fit its place into radios (and back when it fits again). * * @param string $name The radios' name. * @param array $options value => label (raw). * @param string $value The chosen value. * @param array $opts label (raw: the group's name; in a compound part ", "), labelledby * (an element's id that names it, in place of label), id (the group's id, and * each radio's `-`; none by default), disabled, radios (true: radios * on one line), attrs (on the group). */ public static function segmented( string $name, array $options, string $value = '', array $opts = array() ): string { $id = (string) ( $opts['id'] ?? '' ); $radios = ! empty( $opts['radios'] ); foreach ( $options as $label ) { $radios = $radios || mb_strlen( (string) $label ) > self::SEGMENT_MAX; } $attrs = array( 'class' => 'rooster-admin-segmented is-choice' . ( $radios ? ' is-radios' : '' ), 'role' => 'radiogroup', 'id' => '' !== $id ? $id : null, 'aria-label' => '' !== (string) ( $opts['label'] ?? '' ) && '' === (string) ( $opts['labelledby'] ?? '' ) ? (string) $opts['label'] : null, 'aria-labelledby' => '' !== (string) ( $opts['labelledby'] ?? '' ) ? (string) $opts['labelledby'] : null, 'aria-disabled' => ! empty( $opts['disabled'] ) ? 'true' : null, 'data-ra-segmented' => $radios ? 'radios' : '', // radios from the start: the script leaves it so ); $attrs = Ui::merge_attrs( $attrs, $opts['attrs'] ?? null ); $html = ''; foreach ( $options as $key => $label ) { $radio = array( 'type' => 'radio', 'id' => '' !== $id ? $id . '-' . sanitize_html_class( (string) $key ) : null, 'name' => '' !== $name ? $name : null, 'value' => (string) $key, 'checked' => (string) $key === $value, 'disabled' => ! empty( $opts['disabled'] ), ); $html .= '' . esc_html( (string) $label ) . Ui::count_tag( (string) $key, is_array( $opts['counts'] ?? null ) ? $opts['counts'] : array() ) . ''; // 0.65.6: counts } wp_enqueue_script( 'rooster-admin-fields' ); return $html . ''; } /** * A compound row's control (UI-CARD-Suggestons §4.3; the semantic sizing doc §5.2): one label for a set, its parts * side by side, each with a short sub-label over it (Width, Height; Desktop, Mobile; From, To) or only its unit, an * optional joiner between them. Each part is named ", " (FR6): its sub-label is the `` of the part's control, the row's label before it for screen readers; a part without an id gets the name as * its control's aria-label. A part that is a group (a segmented switch) names itself: build it with that label. * Ui::field_row() prints it from its `parts` (the row is then a group). * * @param array> $parts {label (raw sub-label; '' for a part its unit names), control * (escaped HTML), id (the control's id), attrs (0.84.7: on the * part, merged as Ui::merge_attrs(): a part that depends on a * control, States::depends_attrs(); a hidden part takes the joiner * before it along)}. * @param array $opts label (raw: the row's label), joiner (raw: '×', 'to', '/'). */ public static function compound( array $parts, array $opts = array() ): string { $row = (string) ( $opts['label'] ?? '' ); $joiner = (string) ( $opts['joiner'] ?? '' ); $html = ''; $n = 0; foreach ( $parts as $part ) { if ( ! is_array( $part ) ) { continue; } $sub = (string) ( $part['label'] ?? '' ); $control = (string) ( $part['control'] ?? '' ); $id = (string) ( $part['id'] ?? '' ); $name = trim( $row . ( '' !== $row && '' !== $sub ? ', ' : '' ) . $sub ); $label = ''; if ( '' !== $sub && '' !== $id ) { $label = '' . ( '' !== $row ? '' : '' ) . esc_html( $sub ) . ''; } elseif ( '' !== $sub ) { $label = ''; $control = self::name_first( $control, $name ); // the prototype's way (sa_compound()): named on its first control } $html .= ( $n > 0 && '' !== $joiner ? '' : '' ) . ' 'rooster-admin-compound__part' . ( '' === $sub ? ' is-bare' : '' ) ), $part['attrs'] ?? null ) ) . '>' . $label . $control . ''; ++$n; } return $html . ''; } /** * The first control of escaped markup (an input that is not hidden, a select, a textarea) named `$name` by an * aria-label, unless it is named already (aria-label or aria-labelledby). * * @param string $html Escaped HTML. * @param string $name The name (raw). */ private static function name_first( string $html, string $name ): string { // A group (a segmented switch, checks) names itself; a radio or a checkbox is named by its own label. if ( '' === $name || 1 === preg_match( '/\srole="(?:radio)?group"/', $html ) || 1 !== preg_match( '/<(?:input(?![^>]*\btype="(?:hidden|radio|checkbox)")|select|textarea)\b[^>]*>/', $html, $m, PREG_OFFSET_CAPTURE ) ) { return $html; } $tag = (string) $m[0][0]; if ( 1 === preg_match( '/\saria-label(?:ledby)?="/', $tag ) ) { return $html; } $named = (string) preg_replace( '/^<(input|select|textarea)\b/', '<$1 aria-label="' . esc_attr( $name ) . '"', $tag ); return substr_replace( $html, $named, (int) $m[0][1], strlen( $tag ) ); } /** * A media picker (UI-Design-Patterns §6.1, "never attachment ids typed by hand"): the chosen files as thumbnails a * person sorts (the ordered list's grip: a drag, the arrow keys, the Move menu) and removes, and a Choose button * that opens the Media Library. Each row carries a hidden `[]` (a single picker: ``) with the * attachment's id, so the order posts with its form; every change also sends `rooster-admin:order` (see * ordered_list()) for a product that saves in place. * * @param string $name The name of the ids. * @param array $items Attachment ids, or {id, src (a thumbnail URL; '' draws a placeholder), label * (raw), note (raw)}. * @param array $opts id (the picker's), label (raw: the list's name), multiple (default true), * button (raw: "Choose from the Media Library"), title (raw: the library's * title), empty (raw: "Nothing chosen yet."), type (the library's filter: * 'image' by default; '' for any file). */ public static function media_picker( string $name, array $items, array $opts = array() ): string { $id = (string) ( $opts['id'] ?? sanitize_html_class( str_replace( array( '[', ']' ), '-', $name ) ) . '-media' ); $multiple = false !== ( $opts['multiple'] ?? true ); $label = (string) ( $opts['label'] ?? __( 'Chosen files', 'ai-eshop-optimizer' ) ); $field = $multiple ? $name . '[]' : $name; $rows = ''; $count = 0; foreach ( $items as $item ) { $item = is_array( $item ) ? $item : array( 'id' => $item ); $aid = (string) ( $item['id'] ?? '' ); if ( '' === $aid || ( ! $multiple && $count > 0 ) ) { continue; } $src = (string) ( $item['src'] ?? ( is_numeric( $aid ) ? (string) wp_get_attachment_image_url( (int) $aid, 'thumbnail' ) : '' ) ); $title = (string) ( $item['label'] ?? ( is_numeric( $aid ) ? get_the_title( (int) $aid ) : '' ) ); $title = '' !== $title ? $title : $aid; $rows .= self::media_row( $aid, $title, $src, (string) ( $item['note'] ?? '' ), $field ); ++$count; } $empty = (string) ( $opts['empty'] ?? __( 'Nothing chosen yet.', 'ai-eshop-optimizer' ) ); $words = array( /* translators: %s: a file's title. */ 'grip' => __( 'Move "%s": drag it, use the arrow keys, or press Enter for the Move menu', 'ai-eshop-optimizer' ), /* translators: %s: a file's title. */ 'remove' => __( 'Remove %s', 'ai-eshop-optimizer' ), /* translators: %s: a file's title. */ 'removed' => __( 'Removed %s', 'ai-eshop-optimizer' ), 'start' => __( 'Move to the start', 'ai-eshop-optimizer' ), ); $button = (string) ( $opts['button'] ?? ( $multiple ? __( 'Choose from the Media Library', 'ai-eshop-optimizer' ) : __( 'Choose a file', 'ai-eshop-optimizer' ) ) ); if ( function_exists( 'wp_enqueue_media' ) ) { wp_enqueue_media(); // the Media Library's frame, on the screens that print a picker only } wp_enqueue_script( 'rooster-admin-board' ); wp_enqueue_script( 'rooster-admin-fields' ); return ' 'rooster-admin-media', 'id' => $id, 'data-ra-order' => $id, 'data-ra-media' => $multiple ? 'multiple' : 'single', 'data-ra-name' => $field, 'data-ra-type' => (string) ( $opts['type'] ?? 'image' ), 'data-ra-title' => (string) ( $opts['title'] ?? $label ), 'data-ra-words' => (string) wp_json_encode( $words ), ) ) . '>

0 ? ' hidden' : '' ) . ' data-ra-media-empty="">' . esc_html( $empty ) . '

' . '' . Ui::button( $button, array( 'variant' => 'outline', 'size' => 'sm', 'icon' => 'image', 'attrs' => array( 'data-ra-media-choose' => '', 'aria-controls' => $id, ), ) ) . ''; } /** * One row of a media picker (its template's too, with empty values the script fills). * * @param string $aid The attachment's id. * @param string $title Its title (raw). * @param string $src Its thumbnail's URL. * @param string $note A note under the title (raw). * @param string $field The hidden input's name. */ private static function media_row( string $aid, string $title, string $src, string $note, string $field ): string { /* translators: %s: a file's title. */ $move = sprintf( __( 'Move "%s": drag it, use the arrow keys, or press Enter for the Move menu', 'ai-eshop-optimizer' ), $title ); return '

' . self::item_grip( $move ) . ( '' !== $src ? '

' : '' ) . '' . esc_html( $title ) . '' . ( '' !== $note ? '' . esc_html( $note ) . '' : '' ) . '' . Ui::button( /* translators: %s: a file's title. */ sprintf( __( 'Remove %s', 'ai-eshop-optimizer' ), $title ), array( 'variant' => 'ghost', 'size' => 'sm', 'icon' => 'trash-2', 'icon_only' => true, 'attrs' => array( 'data-ra-media-remove' => '' ), ) ) . '

'; } /** * A row's grip (escaped): the board's grip recipe with a row's own attribute, so the board's card handlers leave it * alone (assets/board.js moves the row within its list). * * @param string $label The grip's name (raw: "Move "Price": drag it, …"). */ public static function item_grip( string $label ): string { return ''; } /** * An ordered list (UI-Design-Patterns §6.1): rows a person drags into an order, each with its own controls, in * this order: the grip (a drag, the arrow keys, the Move menu; the board's moves, assets/board.js), an optional * Show switch, the label, the origin as a mono badge, the row's controls at their natural width, a row action, the * row's state as a badge with a tone. A locked row keeps its place (the core elements) and says why in a tip on a * lock in the grip's place; a row with a `zone` moves only among the rows of its zone. Every move and every change of * a row's control sends `rooster-admin:order` on the list (bubbles; detail: list, order (the keys), item, reason * (move, change, reset), control, and save( promise ): a product that saves in place passes its request's promise, * and the list's footer says "Saved", or why not, once it settles (FR1)). With `name` each row carries a hidden * `[]` with its key, so the order posts with its form instead. With `default` the footer offers Reset to * default, after a confirmation. * * @param array> $rows {key, label (raw), origin (raw: "core element", "WooCommerce"), show * (null: no switch; bool), show_name (the switch's name; '' for one * the product saves in place), control (escaped HTML), action (escaped * HTML: a row button, "Rules"), state ([label, tone]), locked (raw: why * it keeps its place), zone (a key: it moves among its zone's rows)}. * @param array $opts id (the list's, its key in the event), label (raw: the list's name), * name (the hidden inputs' name), default (the keys in their default * order: Reset to default), saved (raw: "Saved"), class. */ public static function ordered_list( array $rows, array $opts = array() ): string { $id = (string) ( $opts['id'] ?? 'rooster-admin-olist-' . wp_unique_id() ); $name = (string) ( $opts['name'] ?? '' ); $label = (string) ( $opts['label'] ?? __( 'Order', 'ai-eshop-optimizer' ) ); $items = ''; foreach ( $rows as $row ) { if ( ! is_array( $row ) || '' === (string) ( $row['key'] ?? '' ) ) { continue; } $key = (string) $row['key']; $text = (string) ( $row['label'] ?? $key ); $locked = (string) ( $row['locked'] ?? '' ); $grip = '' !== $locked ? '' . Icons::svg( 'lock', 15 ) . '' /* translators: %s: a row's label. */ : self::item_grip( sprintf( __( 'Move "%s": drag it, use the arrow keys, or press Enter for the Move menu', 'ai-eshop-optimizer' ), $text ) ); $items .= ' 'rooster-admin-olist__row' . ( '' !== $locked ? ' is-locked' : '' ), 'data-ra-item' => $key, 'data-ra-locked' => '' !== $locked ? '' : null, 'data-ra-zone' => '' !== (string) ( $row['zone'] ?? '' ) ? (string) $row['zone'] : null, ) ) . '>' . $grip; if ( array_key_exists( 'show', $row ) && null !== $row['show'] ) { $items .= Ui::toggle( (string) ( $row['show_name'] ?? '' ), (bool) $row['show'], array( 'id' => $id . '-show-' . sanitize_html_class( $key ), /* translators: %s: a row's label. */ 'label' => sprintf( __( 'Show %s', 'ai-eshop-optimizer' ), $text ), 'label_hidden' => true, 'hidden' => false, ) ); } $items .= '' . esc_html( $text ) . '' . ( '' !== (string) ( $row['origin'] ?? '' ) ? Ui::badge( (string) $row['origin'], 'mono', array( 'sm' => true ) ) : '' ); $end = (string) ( $row['control'] ?? '' ) . (string) ( $row['action'] ?? '' ); $state = is_array( $row['state'] ?? null ) ? $row['state'] : array(); $end .= array() !== $state && '' !== (string) ( $state[0] ?? '' ) ? Ui::badge( (string) $state[0], (string) ( $state[1] ?? 'mono' ), array( 'dot' => true, 'sm' => true ) ) : ''; $items .= ( '' !== $end ? '' . $end . '' : '' ) . ( '' !== $name ? '' : '' ) . ''; } $default = array_values( array_map( 'strval', is_array( $opts['default'] ?? null ) ? $opts['default'] : array() ) ); $foot = ''; $dialog = ''; if ( array() !== $default ) { $foot .= Ui::button( __( 'Reset to default', 'ai-eshop-optimizer' ), array( 'variant' => 'ghost', 'size' => 'sm', 'icon' => 'rotate-ccw', 'attrs' => array( 'data-ra-dialog' => $id . '-reset' ), ) ); $dialog = Ui::dialog( $id . '-reset', /* translators: %s: the list's name. */ sprintf( __( 'Reset the order of "%s"?', 'ai-eshop-optimizer' ), $label ), '

' . esc_html__( 'Every row goes back to its default place. What each row shows is kept.', 'ai-eshop-optimizer' ) . '

', array( 'confirm' => __( 'Reset to default', 'ai-eshop-optimizer' ), 'dialog_attrs' => array( 'data-ra-order-reset' => $id ), ) ); } if ( '' === $name || '' !== $foot ) { $foot .= ''; } wp_enqueue_script( 'rooster-admin-board' ); $words = array( 'saved' => (string) ( $opts['saved'] ?? __( 'Saved', 'ai-eshop-optimizer' ) ), /* translators: %s: why it was not saved. */ 'failed' => __( 'Not saved: %s', 'ai-eshop-optimizer' ), ); return ' trim( 'rooster-admin-olist ' . (string) ( $opts['class'] ?? '' ) ), 'id' => $id, 'data-ra-order' => $id, 'data-ra-default' => array() !== $default ? (string) wp_json_encode( $default ) : null, 'data-ra-words' => (string) wp_json_encode( $words ), ) ) . '>

' . $items . '' . ( '' !== $foot ? '

' . $foot . '

' : '' ) . '' . $dialog; } /** * A value another card owns (FR18, FR13): " · Change in ", the owner named by its * catalogue title ("Rooster One Pro › AI models") and linked to its anchor; one owner per setting. With `entry` the * title and the address come from the catalogue (the link left out where the viewer cannot open it). * * @param string $value_html The current choice (escaped HTML: a text, a badge). * @param array $opts entry (the owner's catalogue id), or title (raw) and url. */ public static function change_row( string $value_html, array $opts = array() ): string { $title = (string) ( $opts['title'] ?? '' ); $url = (string) ( $opts['url'] ?? '' ); $entry = (string) ( $opts['entry'] ?? '' ); if ( '' !== $entry && null !== Library::registry() ) { $row = Library::registry()->get( $entry ); if ( null !== $row ) { $title = '' !== $title ? $title : trim( ( '' !== (string) ( $row['page'] ?? '' ) ? (string) $row['page'] . ' › ' : '' ) . (string) $row['title'] ); $url = isset( Library::registry()->visible( null )[ $entry ] ) ? (string) $row['url'] : ''; } } /* translators: %s: the owner's catalogue title, "Rooster One Pro › AI models". */ $change = sprintf( __( 'Change in %s', 'ai-eshop-optimizer' ), $title ); return '' . $value_html . '' . ( '' !== $title ? '' . ( '' !== $url ? '' . esc_html( $change ) . '' : '' . esc_html( $change ) . '' ) : '' ) . ''; } /** * A secret field (FR18): a key, a token, a password. Saved, it shows masked (monospace, 40rem, read-only, posting * nothing) with Replace, which empties the box for a new value and gives it its name, and Keep the saved one, which * puts the mask back; the saved value is never printed into the page. Not saved yet, it is an empty password box. * The product keeps the stored value when nothing is posted. * * @param string $name The name. * @param bool $saved Whether a value is stored. * @param array $opts id (the box's; default the name), label (raw: the field's name, for "Replace * "), placeholder, autocomplete, attrs (on the box). */ public static function secret( string $name, bool $saved, array $opts = array() ): string { $id = (string) ( $opts['id'] ?? $name ); $label = (string) ( $opts['label'] ?? '' ); $attrs = is_array( $opts['attrs'] ?? null ) ? $opts['attrs'] : array(); if ( ! $saved ) { return '' . Ui::input( $name, '', array( 'type' => 'password', 'id' => $id, 'code' => true, 'placeholder' => (string) ( $opts['placeholder'] ?? '' ), 'autocomplete' => (string) ( $opts['autocomplete'] ?? 'new-password' ), 'attrs' => array( 'spellcheck' => 'false' ) + $attrs, ) ) . ''; } wp_enqueue_script( 'rooster-admin-fields' ); $box = Ui::input( '', self::MASK, array( 'id' => $id, 'code' => true, 'readonly' => true, 'autocomplete' => 'off', 'attrs' => array( 'spellcheck' => 'false', 'data-ra-secret-name' => $name, 'data-ra-secret-mask' => self::MASK, ) + $attrs, ) ); /* translators: %s: the field's name, "API key". */ $replace = '' !== $label ? sprintf( __( 'Replace %s', 'ai-eshop-optimizer' ), $label ) : __( 'Replace', 'ai-eshop-optimizer' ); return '' . $box . Ui::button( // 0.66.2: the field's height (32 px), as a compound row's buttons, not a small one beside it __( 'Replace', 'ai-eshop-optimizer' ), array( 'icon' => 'key', 'attrs' => array( 'data-ra-secret-replace' => '', 'aria-label' => $replace, 'aria-controls' => $id, ), ) ) . Ui::button( __( 'Keep the saved one', 'ai-eshop-optimizer' ), array( 'variant' => 'ghost', 'attrs' => array( 'data-ra-secret-keep' => '', 'hidden' => true, ), ) ) . ''; } }