@preply/ds-docs 11.0.0 → 11.1.0

package/dist/assets/NativeSelectField.stories-D0re4a3o.js

@@ -0,0 +1,295 @@
+import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{ht as r,t as i}from"./dist-DtfJeYQK.js";import{t as a}from"./jsx-runtime-C2wGStra.js";import{n as o,t as s}from"./TokyoUIChevronDown-CS0lTt7n.js";import{n as c,t as l}from"./dist-Cc1j9Pjk.js";import{n as u,t as d}from"./Icon-CfZyHxyH.js";import{n as f,t as p}from"./FormControl-cSvM3XwI.js";import{i as m,n as h,r as g,t as _}from"./InputContainer-CKX9LGmw.js";import{n as v,t as y}from"./TokyoUILanguage-B0kNm-zw.js";var b,x,S,C=t((()=>{b=e(n(),1),i(),o(),m(),h(),u(),x=a(),S=(0,b.forwardRef)(function({dataset:e,onChange:t,onValueChange:n,icon:i,children:a,placeholder:o,...c},l){let[u,f]=(0,b.useState)(!c.value&&!c.defaultValue),p=r(e),m=c.value===void 0?{defaultValue:c.defaultValue||``}:{value:c.value},h=e=>{t?.(e),n?.(e.target.value),f(!e.target.value)};return(0,x.jsx)(_,{icon:i,trailingIcon:(0,x.jsx)(d,{svg:s}),children:(0,x.jsxs)(`select`,{...p,...c,...m,onChange:h,ref:l,className:g.input,"data-empty":u,children:[typeof o==`string`&&(0,x.jsx)(`option`,{value:``,disabled:c.required,children:o}),a]})})});try{S.displayName=`NativeSelect`,S.__docgenInfo={description:`A component to render a select with optional icon.
+For internal use only.`,displayName:`NativeSelect`,props:{autoComplete:{defaultValue:null,description:``,name:`autoComplete`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},disabled:{defaultValue:null,description:``,name:`disabled`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},form:{defaultValue:null,description:``,name:`form`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},multiple:{defaultValue:null,description:``,name:`multiple`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},name:{defaultValue:null,description:``,name:`name`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},required:{defaultValue:null,description:``,name:`required`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},size:{defaultValue:null,description:``,name:`size`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},value:{defaultValue:null,description:``,name:`value`,required:!1,type:{name:`enum`,value:[{value:`string`},{value:`number`},{value:`readonly string[]`}]}},onChange:{defaultValue:null,description:``,name:`onChange`,required:!1,type:{name:`enum`,value:[{value:`ChangeEventHandler<HTMLSelectElement>`}]}},defaultChecked:{defaultValue:null,description:``,name:`defaultChecked`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},defaultValue:{defaultValue:null,description:``,name:`defaultValue`,required:!1,type:{name:`enum`,value:[{value:`string`},{value:`number`},{value:`readonly string[]`}]}},suppressContentEditableWarning:{defaultValue:null,description:``,name:`suppressContentEditableWarning`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},suppressHydrationWarning:{defaultValue:null,description:``,name:`suppressHydrationWarning`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},accessKey:{defaultValue:null,description:``,name:`accessKey`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},autoCapitalize:{defaultValue:null,description:``,name:`autoCapitalize`,required:!1,type:{name:`enum`,value:[{value:`string & {}`},{value:`"none"`},{value:`"off"`},{value:`"on"`},{value:`"sentences"`},{value:`"words"`},{value:`"characters"`}]}},autoFocus:{defaultValue:null,description:``,name:`autoFocus`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},className:{defaultValue:null,description:``,name:`className`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},contentEditable:{defaultValue:null,description:``,name:`contentEditable`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`"inherit"`},{value:`"false"`},{value:`"true"`},{value:`"plaintext-only"`}]}},contextMenu:{defaultValue:null,description:``,name:`contextMenu`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},dir:{defaultValue:null,description:``,name:`dir`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},draggable:{defaultValue:null,description:``,name:`draggable`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`"false"`},{value:`"true"`}]}},enterKeyHint:{defaultValue:null,description:``,name:`enterKeyHint`,required:!1,type:{name:`enum`,value:[{value:`"search"`},{value:`"enter"`},{value:`"done"`},{value:`"go"`},{value:`"next"`},{value:`"previous"`},{value:`"send"`}]}},hidden:{defaultValue:null,description:``,name:`hidden`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},id:{defaultValue:null,description:``,name:`id`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},lang:{defaultValue:null,description:``,name:`lang`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},nonce:{defaultValue:null,description:``,name:`nonce`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},slot:{defaultValue:null,description:``,name:`slot`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},spellCheck:{defaultValue:null,description:``,name:`spellCheck`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`"false"`},{value:`"true"`}]}},style:{defaultValue:null,description:``,name:`style`,required:!1,type:{name:`enum`,value:[{value:`CSSProperties`}]}},tabIndex:{defaultValue:null,description:``,name:`tabIndex`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},title:{defaultValue:null,description:``,name:`title`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},translate:{defaultValue:null,description:``,name:`translate`,required:!1,type:{name:`enum`,value:[{value:`"no"`},{value:`"yes"`}]}},radioGroup:{defaultValue:null,description:``,name:`radioGroup`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},role:{defaultValue:null,description:``,name:`role`,required:!1,type:{name:`enum`,value:[{value:`string & {}`},{value:`"none"`},{value:`"table"`},{value:`"article"`},{value:`"button"`},{value:`"dialog"`},{value:`"figure"`},{value:`"form"`},{value:`"img"`},{value:`"link"`},{value:`"main"`},{value:`"menu"`},{value:`"menuitem"`},{value:`"option"`},{value:`"search"`},{value:`"switch"`},{value:`"list"`},{value:`"row"`},{value:`"alert"`},{value:`"alertdialog"`},{value:`"application"`},{value:`"banner"`},{value:`"cell"`},{value:`"checkbox"`},{value:`"columnheader"`},{value:`"combobox"`},{value:`"complementary"`},{value:`"contentinfo"`},{value:`"definition"`},{value:`"directory"`},{value:`"document"`},{value:`"feed"`},{value:`"grid"`},{value:`"gridcell"`},{value:`"group"`},{value:`"heading"`},{value:`"listbox"`},{value:`"listitem"`},{value:`"log"`},{value:`"marquee"`},{value:`"math"`},{value:`"menubar"`},{value:`"menuitemcheckbox"`},{value:`"menuitemradio"`},{value:`"navigation"`},{value:`"note"`},{value:`"presentation"`},{value:`"progressbar"`},{value:`"radio"`},{value:`"radiogroup"`},{value:`"region"`},{value:`"rowgroup"`},{value:`"rowheader"`},{value:`"scrollbar"`},{value:`"searchbox"`},{value:`"separator"`},{value:`"slider"`},{value:`"spinbutton"`},{value:`"status"`},{value:`"tab"`},{value:`"tablist"`},{value:`"tabpanel"`},{value:`"term"`},{value:`"textbox"`},{value:`"timer"`},{value:`"toolbar"`},{value:`"tooltip"`},{value:`"tree"`},{value:`"treegrid"`},{value:`"treeitem"`}]}},about:{defaultValue:null,description:``,name:`about`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},content:{defaultValue:null,description:``,name:`content`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},datatype:{defaultValue:null,description:``,name:`datatype`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},inlist:{defaultValue:null,description:``,name:`inlist`,required:!1,type:{name:`any`}},prefix:{defaultValue:null,description:``,name:`prefix`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},property:{defaultValue:null,description:``,name:`property`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},rel:{defaultValue:null,description:``,name:`rel`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},resource:{defaultValue:null,description:``,name:`resource`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},rev:{defaultValue:null,description:``,name:`rev`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},typeof:{defaultValue:null,description:``,name:`typeof`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},vocab:{defaultValue:null,description:``,name:`vocab`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},autoCorrect:{defaultValue:null,description:``,name:`autoCorrect`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},autoSave:{defaultValue:null,description:``,name:`autoSave`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},color:{defaultValue:null,description:``,name:`color`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},itemProp:{defaultValue:null,description:``,name:`itemProp`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},itemScope:{defaultValue:null,description:``,name:`itemScope`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},itemType:{defaultValue:null,description:``,name:`itemType`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},itemID:{defaultValue:null,description:``,name:`itemID`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},itemRef:{defaultValue:null,description:``,name:`itemRef`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},results:{defaultValue:null,description:``,name:`results`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},security:{defaultValue:null,description:``,name:`security`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},unselectable:{defaultValue:null,description:``,name:`unselectable`,required:!1,type:{name:`enum`,value:[{value:`"off"`},{value:`"on"`}]}},inputMode:{defaultValue:null,description:`Hints at the type of data that might be entered by the user while editing the element or its contents
+@see {@link https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute}`,name:`inputMode`,required:!1,type:{name:`enum`,value:[{value:`"none"`},{value:`"text"`},{value:`"search"`},{value:`"email"`},{value:`"tel"`},{value:`"url"`},{value:`"numeric"`},{value:`"decimal"`}]}},is:{defaultValue:null,description:`Specify that a standard HTML element should behave like a defined custom built-in element
+@see {@link https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is}`,name:`is`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-activedescendant":{defaultValue:null,description:`Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application.`,name:`aria-activedescendant`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-atomic":{defaultValue:null,description:`Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute.`,name:`aria-atomic`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`"false"`},{value:`"true"`}]}},"aria-autocomplete":{defaultValue:null,description:`Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be
+presented if they are made.`,name:`aria-autocomplete`,required:!1,type:{name:`enum`,value:[{value:`"none"`},{value:`"list"`},{value:`"inline"`},{value:`"both"`}]}},"aria-braillelabel":{defaultValue:null,description:`Defines a string value that labels the current element, which is intended to be converted into Braille.
+@see aria-label.`,name:`aria-braillelabel`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-brailleroledescription":{defaultValue:null,description:`Defines a human-readable, author-localized abbreviated description for the role of an element, which is intended to be converted into Braille.
+@see aria-roledescription.`,name:`aria-brailleroledescription`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-busy":{defaultValue:null,description:``,name:`aria-busy`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`"false"`},{value:`"true"`}]}},"aria-checked":{defaultValue:null,description:`Indicates the current "checked" state of checkboxes, radio buttons, and other widgets.
+@see aria-pressed
+@see aria-selected.`,name:`aria-checked`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`"false"`},{value:`"true"`},{value:`"mixed"`}]}},"aria-colcount":{defaultValue:null,description:`Defines the total number of columns in a table, grid, or treegrid.
+@see aria-colindex.`,name:`aria-colcount`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},"aria-colindex":{defaultValue:null,description:`Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid.
+@see aria-colcount
+@see aria-colspan.`,name:`aria-colindex`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},"aria-colindextext":{defaultValue:null,description:`Defines a human readable text alternative of aria-colindex.
+@see aria-rowindextext.`,name:`aria-colindextext`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-colspan":{defaultValue:null,description:`Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid.
+@see aria-colindex
+@see aria-rowspan.`,name:`aria-colspan`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},"aria-controls":{defaultValue:null,description:`Identifies the element (or elements) whose contents or presence are controlled by the current element.
+@see aria-owns.`,name:`aria-controls`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-current":{defaultValue:null,description:`Indicates the element that represents the current item within a container or set of related elements.`,name:`aria-current`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`"time"`},{value:`"step"`},{value:`"false"`},{value:`"true"`},{value:`"page"`},{value:`"location"`},{value:`"date"`}]}},"aria-describedby":{defaultValue:null,description:`Identifies the element (or elements) that describes the object.
+@see aria-labelledby`,name:`aria-describedby`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-description":{defaultValue:null,description:`Defines a string value that describes or annotates the current element.
+@see related aria-describedby.`,name:`aria-description`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-details":{defaultValue:null,description:`Identifies the element that provides a detailed, extended description for the object.
+@see aria-describedby.`,name:`aria-details`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-disabled":{defaultValue:null,description:`Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.
+@see aria-hidden
+@see aria-readonly.`,name:`aria-disabled`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`"false"`},{value:`"true"`}]}},"aria-dropeffect":{defaultValue:null,description:`Indicates what functions can be performed when a dragged object is released on the drop target.
+@deprecated in ARIA 1.1`,name:`aria-dropeffect`,required:!1,type:{name:`enum`,value:[{value:`"none"`},{value:`"link"`},{value:`"copy"`},{value:`"execute"`},{value:`"move"`},{value:`"popup"`}]}},"aria-errormessage":{defaultValue:null,description:`Identifies the element that provides an error message for the object.
+@see aria-invalid
+@see aria-describedby.`,name:`aria-errormessage`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-expanded":{defaultValue:null,description:`Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed.`,name:`aria-expanded`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`"false"`},{value:`"true"`}]}},"aria-flowto":{defaultValue:null,description:`Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,
+allows assistive technology to override the general default of reading in document source order.`,name:`aria-flowto`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-grabbed":{defaultValue:null,description:`Indicates an element's "grabbed" state in a drag-and-drop operation.
+@deprecated in ARIA 1.1`,name:`aria-grabbed`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`"false"`},{value:`"true"`}]}},"aria-haspopup":{defaultValue:null,description:`Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element.`,name:`aria-haspopup`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`"dialog"`},{value:`"menu"`},{value:`"false"`},{value:`"true"`},{value:`"grid"`},{value:`"listbox"`},{value:`"tree"`}]}},"aria-hidden":{defaultValue:null,description:`Indicates whether the element is exposed to an accessibility API.
+@see aria-disabled.`,name:`aria-hidden`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`"false"`},{value:`"true"`}]}},"aria-invalid":{defaultValue:null,description:`Indicates the entered value does not conform to the format expected by the application.
+@see aria-errormessage.`,name:`aria-invalid`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`"false"`},{value:`"true"`},{value:`"grammar"`},{value:`"spelling"`}]}},"aria-keyshortcuts":{defaultValue:null,description:`Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element.`,name:`aria-keyshortcuts`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-label":{defaultValue:null,description:`Defines a string value that labels the current element.
+@see aria-labelledby.`,name:`aria-label`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-labelledby":{defaultValue:null,description:`Identifies the element (or elements) that labels the current element.
+@see aria-describedby.`,name:`aria-labelledby`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-level":{defaultValue:null,description:`Defines the hierarchical level of an element within a structure.`,name:`aria-level`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},"aria-live":{defaultValue:null,description:`Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region.`,name:`aria-live`,required:!1,type:{name:`enum`,value:[{value:`"off"`},{value:`"assertive"`},{value:`"polite"`}]}},"aria-modal":{defaultValue:null,description:`Indicates whether an element is modal when displayed.`,name:`aria-modal`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`"false"`},{value:`"true"`}]}},"aria-multiline":{defaultValue:null,description:`Indicates whether a text box accepts multiple lines of input or only a single line.`,name:`aria-multiline`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`"false"`},{value:`"true"`}]}},"aria-multiselectable":{defaultValue:null,description:`Indicates that the user may select more than one item from the current selectable descendants.`,name:`aria-multiselectable`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`"false"`},{value:`"true"`}]}},"aria-orientation":{defaultValue:null,description:`Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous.`,name:`aria-orientation`,required:!1,type:{name:`enum`,value:[{value:`"horizontal"`},{value:`"vertical"`}]}},"aria-owns":{defaultValue:null,description:`Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship
+between DOM elements where the DOM hierarchy cannot be used to represent the relationship.
+@see aria-controls.`,name:`aria-owns`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-placeholder":{defaultValue:null,description:`Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.
+A hint could be a sample value or a brief description of the expected format.`,name:`aria-placeholder`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-posinset":{defaultValue:null,description:`Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.
+@see aria-setsize.`,name:`aria-posinset`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},"aria-pressed":{defaultValue:null,description:`Indicates the current "pressed" state of toggle buttons.
+@see aria-checked
+@see aria-selected.`,name:`aria-pressed`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`"false"`},{value:`"true"`},{value:`"mixed"`}]}},"aria-readonly":{defaultValue:null,description:`Indicates that the element is not editable, but is otherwise operable.
+@see aria-disabled.`,name:`aria-readonly`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`"false"`},{value:`"true"`}]}},"aria-relevant":{defaultValue:null,description:`Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified.
+@see aria-atomic.`,name:`aria-relevant`,required:!1,type:{name:`enum`,value:[{value:`"text"`},{value:`"additions"`},{value:`"additions removals"`},{value:`"additions text"`},{value:`"all"`},{value:`"removals"`},{value:`"removals additions"`},{value:`"removals text"`},{value:`"text additions"`},{value:`"text removals"`}]}},"aria-required":{defaultValue:null,description:`Indicates that user input is required on the element before a form may be submitted.`,name:`aria-required`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`"false"`},{value:`"true"`}]}},"aria-roledescription":{defaultValue:null,description:`Defines a human-readable, author-localized description for the role of an element.`,name:`aria-roledescription`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-rowcount":{defaultValue:null,description:`Defines the total number of rows in a table, grid, or treegrid.
+@see aria-rowindex.`,name:`aria-rowcount`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},"aria-rowindex":{defaultValue:null,description:`Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid.
+@see aria-rowcount
+@see aria-rowspan.`,name:`aria-rowindex`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},"aria-rowindextext":{defaultValue:null,description:`Defines a human readable text alternative of aria-rowindex.
+@see aria-colindextext.`,name:`aria-rowindextext`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},"aria-rowspan":{defaultValue:null,description:`Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid.
+@see aria-rowindex
+@see aria-colspan.`,name:`aria-rowspan`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},"aria-selected":{defaultValue:null,description:`Indicates the current "selected" state of various widgets.
+@see aria-checked
+@see aria-pressed.`,name:`aria-selected`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`},{value:`"false"`},{value:`"true"`}]}},"aria-setsize":{defaultValue:null,description:`Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.
+@see aria-posinset.`,name:`aria-setsize`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},"aria-sort":{defaultValue:null,description:`Indicates if items in a table or grid are sorted in ascending or descending order.`,name:`aria-sort`,required:!1,type:{name:`enum`,value:[{value:`"none"`},{value:`"ascending"`},{value:`"descending"`},{value:`"other"`}]}},"aria-valuemax":{defaultValue:null,description:`Defines the maximum allowed value for a range widget.`,name:`aria-valuemax`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},"aria-valuemin":{defaultValue:null,description:`Defines the minimum allowed value for a range widget.`,name:`aria-valuemin`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},"aria-valuenow":{defaultValue:null,description:`Defines the current value for a range widget.
+@see aria-valuetext.`,name:`aria-valuenow`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},"aria-valuetext":{defaultValue:null,description:`Defines the human readable text alternative of aria-valuenow for a range widget.`,name:`aria-valuetext`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},dangerouslySetInnerHTML:{defaultValue:null,description:``,name:`dangerouslySetInnerHTML`,required:!1,type:{name:`enum`,value:[{value:`{ __html: string | TrustedHTML; }`}]}},onCopy:{defaultValue:null,description:``,name:`onCopy`,required:!1,type:{name:`enum`,value:[{value:`ClipboardEventHandler<HTMLSelectElement>`}]}},onCopyCapture:{defaultValue:null,description:``,name:`onCopyCapture`,required:!1,type:{name:`enum`,value:[{value:`ClipboardEventHandler<HTMLSelectElement>`}]}},onCut:{defaultValue:null,description:``,name:`onCut`,required:!1,type:{name:`enum`,value:[{value:`ClipboardEventHandler<HTMLSelectElement>`}]}},onCutCapture:{defaultValue:null,description:``,name:`onCutCapture`,required:!1,type:{name:`enum`,value:[{value:`ClipboardEventHandler<HTMLSelectElement>`}]}},onPaste:{defaultValue:null,description:``,name:`onPaste`,required:!1,type:{name:`enum`,value:[{value:`ClipboardEventHandler<HTMLSelectElement>`}]}},onPasteCapture:{defaultValue:null,description:``,name:`onPasteCapture`,required:!1,type:{name:`enum`,value:[{value:`ClipboardEventHandler<HTMLSelectElement>`}]}},onCompositionEnd:{defaultValue:null,description:``,name:`onCompositionEnd`,required:!1,type:{name:`enum`,value:[{value:`CompositionEventHandler<HTMLSelectElement>`}]}},onCompositionEndCapture:{defaultValue:null,description:``,name:`onCompositionEndCapture`,required:!1,type:{name:`enum`,value:[{value:`CompositionEventHandler<HTMLSelectElement>`}]}},onCompositionStart:{defaultValue:null,description:``,name:`onCompositionStart`,required:!1,type:{name:`enum`,value:[{value:`CompositionEventHandler<HTMLSelectElement>`}]}},onCompositionStartCapture:{defaultValue:null,description:``,name:`onCompositionStartCapture`,required:!1,type:{name:`enum`,value:[{value:`CompositionEventHandler<HTMLSelectElement>`}]}},onCompositionUpdate:{defaultValue:null,description:``,name:`onCompositionUpdate`,required:!1,type:{name:`enum`,value:[{value:`CompositionEventHandler<HTMLSelectElement>`}]}},onCompositionUpdateCapture:{defaultValue:null,description:``,name:`onCompositionUpdateCapture`,required:!1,type:{name:`enum`,value:[{value:`CompositionEventHandler<HTMLSelectElement>`}]}},onFocus:{defaultValue:null,description:``,name:`onFocus`,required:!1,type:{name:`enum`,value:[{value:`FocusEventHandler<HTMLSelectElement>`}]}},onFocusCapture:{defaultValue:null,description:``,name:`onFocusCapture`,required:!1,type:{name:`enum`,value:[{value:`FocusEventHandler<HTMLSelectElement>`}]}},onBlur:{defaultValue:null,description:``,name:`onBlur`,required:!1,type:{name:`enum`,value:[{value:`FocusEventHandler<HTMLSelectElement>`}]}},onBlurCapture:{defaultValue:null,description:``,name:`onBlurCapture`,required:!1,type:{name:`enum`,value:[{value:`FocusEventHandler<HTMLSelectElement>`}]}},onChangeCapture:{defaultValue:null,description:``,name:`onChangeCapture`,required:!1,type:{name:`enum`,value:[{value:`FormEventHandler<HTMLSelectElement>`}]}},onBeforeInput:{defaultValue:null,description:``,name:`onBeforeInput`,required:!1,type:{name:`enum`,value:[{value:`FormEventHandler<HTMLSelectElement>`}]}},onBeforeInputCapture:{defaultValue:null,description:``,name:`onBeforeInputCapture`,required:!1,type:{name:`enum`,value:[{value:`FormEventHandler<HTMLSelectElement>`}]}},onInput:{defaultValue:null,description:``,name:`onInput`,required:!1,type:{name:`enum`,value:[{value:`FormEventHandler<HTMLSelectElement>`}]}},onInputCapture:{defaultValue:null,description:``,name:`onInputCapture`,required:!1,type:{name:`enum`,value:[{value:`FormEventHandler<HTMLSelectElement>`}]}},onReset:{defaultValue:null,description:``,name:`onReset`,required:!1,type:{name:`enum`,value:[{value:`FormEventHandler<HTMLSelectElement>`}]}},onResetCapture:{defaultValue:null,description:``,name:`onResetCapture`,required:!1,type:{name:`enum`,value:[{value:`FormEventHandler<HTMLSelectElement>`}]}},onSubmit:{defaultValue:null,description:``,name:`onSubmit`,required:!1,type:{name:`enum`,value:[{value:`FormEventHandler<HTMLSelectElement>`}]}},onSubmitCapture:{defaultValue:null,description:``,name:`onSubmitCapture`,required:!1,type:{name:`enum`,value:[{value:`FormEventHandler<HTMLSelectElement>`}]}},onInvalid:{defaultValue:null,description:``,name:`onInvalid`,required:!1,type:{name:`enum`,value:[{value:`FormEventHandler<HTMLSelectElement>`}]}},onInvalidCapture:{defaultValue:null,description:``,name:`onInvalidCapture`,required:!1,type:{name:`enum`,value:[{value:`FormEventHandler<HTMLSelectElement>`}]}},onLoad:{defaultValue:null,description:``,name:`onLoad`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onLoadCapture:{defaultValue:null,description:``,name:`onLoadCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onError:{defaultValue:null,description:``,name:`onError`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onErrorCapture:{defaultValue:null,description:``,name:`onErrorCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onKeyDown:{defaultValue:null,description:``,name:`onKeyDown`,required:!1,type:{name:`enum`,value:[{value:`KeyboardEventHandler<HTMLSelectElement>`}]}},onKeyDownCapture:{defaultValue:null,description:``,name:`onKeyDownCapture`,required:!1,type:{name:`enum`,value:[{value:`KeyboardEventHandler<HTMLSelectElement>`}]}},onKeyPress:{defaultValue:null,description:"@deprecated Use `onKeyUp` or `onKeyDown` instead",name:`onKeyPress`,required:!1,type:{name:`enum`,value:[{value:`KeyboardEventHandler<HTMLSelectElement>`}]}},onKeyPressCapture:{defaultValue:null,description:"@deprecated Use `onKeyUpCapture` or `onKeyDownCapture` instead",name:`onKeyPressCapture`,required:!1,type:{name:`enum`,value:[{value:`KeyboardEventHandler<HTMLSelectElement>`}]}},onKeyUp:{defaultValue:null,description:``,name:`onKeyUp`,required:!1,type:{name:`enum`,value:[{value:`KeyboardEventHandler<HTMLSelectElement>`}]}},onKeyUpCapture:{defaultValue:null,description:``,name:`onKeyUpCapture`,required:!1,type:{name:`enum`,value:[{value:`KeyboardEventHandler<HTMLSelectElement>`}]}},onAbort:{defaultValue:null,description:``,name:`onAbort`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onAbortCapture:{defaultValue:null,description:``,name:`onAbortCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onCanPlay:{defaultValue:null,description:``,name:`onCanPlay`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onCanPlayCapture:{defaultValue:null,description:``,name:`onCanPlayCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onCanPlayThrough:{defaultValue:null,description:``,name:`onCanPlayThrough`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onCanPlayThroughCapture:{defaultValue:null,description:``,name:`onCanPlayThroughCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onDurationChange:{defaultValue:null,description:``,name:`onDurationChange`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onDurationChangeCapture:{defaultValue:null,description:``,name:`onDurationChangeCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onEmptied:{defaultValue:null,description:``,name:`onEmptied`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onEmptiedCapture:{defaultValue:null,description:``,name:`onEmptiedCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onEncrypted:{defaultValue:null,description:``,name:`onEncrypted`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onEncryptedCapture:{defaultValue:null,description:``,name:`onEncryptedCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onEnded:{defaultValue:null,description:``,name:`onEnded`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onEndedCapture:{defaultValue:null,description:``,name:`onEndedCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onLoadedData:{defaultValue:null,description:``,name:`onLoadedData`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onLoadedDataCapture:{defaultValue:null,description:``,name:`onLoadedDataCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onLoadedMetadata:{defaultValue:null,description:``,name:`onLoadedMetadata`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onLoadedMetadataCapture:{defaultValue:null,description:``,name:`onLoadedMetadataCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onLoadStart:{defaultValue:null,description:``,name:`onLoadStart`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onLoadStartCapture:{defaultValue:null,description:``,name:`onLoadStartCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onPause:{defaultValue:null,description:``,name:`onPause`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onPauseCapture:{defaultValue:null,description:``,name:`onPauseCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onPlay:{defaultValue:null,description:``,name:`onPlay`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onPlayCapture:{defaultValue:null,description:``,name:`onPlayCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onPlaying:{defaultValue:null,description:``,name:`onPlaying`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onPlayingCapture:{defaultValue:null,description:``,name:`onPlayingCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onProgress:{defaultValue:null,description:``,name:`onProgress`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onProgressCapture:{defaultValue:null,description:``,name:`onProgressCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onRateChange:{defaultValue:null,description:``,name:`onRateChange`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onRateChangeCapture:{defaultValue:null,description:``,name:`onRateChangeCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onResize:{defaultValue:null,description:``,name:`onResize`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onResizeCapture:{defaultValue:null,description:``,name:`onResizeCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onSeeked:{defaultValue:null,description:``,name:`onSeeked`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onSeekedCapture:{defaultValue:null,description:``,name:`onSeekedCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onSeeking:{defaultValue:null,description:``,name:`onSeeking`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onSeekingCapture:{defaultValue:null,description:``,name:`onSeekingCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onStalled:{defaultValue:null,description:``,name:`onStalled`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onStalledCapture:{defaultValue:null,description:``,name:`onStalledCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onSuspend:{defaultValue:null,description:``,name:`onSuspend`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onSuspendCapture:{defaultValue:null,description:``,name:`onSuspendCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onTimeUpdate:{defaultValue:null,description:``,name:`onTimeUpdate`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onTimeUpdateCapture:{defaultValue:null,description:``,name:`onTimeUpdateCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onVolumeChange:{defaultValue:null,description:``,name:`onVolumeChange`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onVolumeChangeCapture:{defaultValue:null,description:``,name:`onVolumeChangeCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onWaiting:{defaultValue:null,description:``,name:`onWaiting`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onWaitingCapture:{defaultValue:null,description:``,name:`onWaitingCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onAuxClick:{defaultValue:null,description:``,name:`onAuxClick`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler<HTMLSelectElement>`}]}},onAuxClickCapture:{defaultValue:null,description:``,name:`onAuxClickCapture`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler<HTMLSelectElement>`}]}},onClick:{defaultValue:null,description:``,name:`onClick`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler<HTMLSelectElement>`}]}},onClickCapture:{defaultValue:null,description:``,name:`onClickCapture`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler<HTMLSelectElement>`}]}},onContextMenu:{defaultValue:null,description:``,name:`onContextMenu`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler<HTMLSelectElement>`}]}},onContextMenuCapture:{defaultValue:null,description:``,name:`onContextMenuCapture`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler<HTMLSelectElement>`}]}},onDoubleClick:{defaultValue:null,description:``,name:`onDoubleClick`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler<HTMLSelectElement>`}]}},onDoubleClickCapture:{defaultValue:null,description:``,name:`onDoubleClickCapture`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler<HTMLSelectElement>`}]}},onDrag:{defaultValue:null,description:``,name:`onDrag`,required:!1,type:{name:`enum`,value:[{value:`DragEventHandler<HTMLSelectElement>`}]}},onDragCapture:{defaultValue:null,description:``,name:`onDragCapture`,required:!1,type:{name:`enum`,value:[{value:`DragEventHandler<HTMLSelectElement>`}]}},onDragEnd:{defaultValue:null,description:``,name:`onDragEnd`,required:!1,type:{name:`enum`,value:[{value:`DragEventHandler<HTMLSelectElement>`}]}},onDragEndCapture:{defaultValue:null,description:``,name:`onDragEndCapture`,required:!1,type:{name:`enum`,value:[{value:`DragEventHandler<HTMLSelectElement>`}]}},onDragEnter:{defaultValue:null,description:``,name:`onDragEnter`,required:!1,type:{name:`enum`,value:[{value:`DragEventHandler<HTMLSelectElement>`}]}},onDragEnterCapture:{defaultValue:null,description:``,name:`onDragEnterCapture`,required:!1,type:{name:`enum`,value:[{value:`DragEventHandler<HTMLSelectElement>`}]}},onDragExit:{defaultValue:null,description:``,name:`onDragExit`,required:!1,type:{name:`enum`,value:[{value:`DragEventHandler<HTMLSelectElement>`}]}},onDragExitCapture:{defaultValue:null,description:``,name:`onDragExitCapture`,required:!1,type:{name:`enum`,value:[{value:`DragEventHandler<HTMLSelectElement>`}]}},onDragLeave:{defaultValue:null,description:``,name:`onDragLeave`,required:!1,type:{name:`enum`,value:[{value:`DragEventHandler<HTMLSelectElement>`}]}},onDragLeaveCapture:{defaultValue:null,description:``,name:`onDragLeaveCapture`,required:!1,type:{name:`enum`,value:[{value:`DragEventHandler<HTMLSelectElement>`}]}},onDragOver:{defaultValue:null,description:``,name:`onDragOver`,required:!1,type:{name:`enum`,value:[{value:`DragEventHandler<HTMLSelectElement>`}]}},onDragOverCapture:{defaultValue:null,description:``,name:`onDragOverCapture`,required:!1,type:{name:`enum`,value:[{value:`DragEventHandler<HTMLSelectElement>`}]}},onDragStart:{defaultValue:null,description:``,name:`onDragStart`,required:!1,type:{name:`enum`,value:[{value:`DragEventHandler<HTMLSelectElement>`}]}},onDragStartCapture:{defaultValue:null,description:``,name:`onDragStartCapture`,required:!1,type:{name:`enum`,value:[{value:`DragEventHandler<HTMLSelectElement>`}]}},onDrop:{defaultValue:null,description:``,name:`onDrop`,required:!1,type:{name:`enum`,value:[{value:`DragEventHandler<HTMLSelectElement>`}]}},onDropCapture:{defaultValue:null,description:``,name:`onDropCapture`,required:!1,type:{name:`enum`,value:[{value:`DragEventHandler<HTMLSelectElement>`}]}},onMouseDown:{defaultValue:null,description:``,name:`onMouseDown`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler<HTMLSelectElement>`}]}},onMouseDownCapture:{defaultValue:null,description:``,name:`onMouseDownCapture`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler<HTMLSelectElement>`}]}},onMouseEnter:{defaultValue:null,description:``,name:`onMouseEnter`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler<HTMLSelectElement>`}]}},onMouseLeave:{defaultValue:null,description:``,name:`onMouseLeave`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler<HTMLSelectElement>`}]}},onMouseMove:{defaultValue:null,description:``,name:`onMouseMove`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler<HTMLSelectElement>`}]}},onMouseMoveCapture:{defaultValue:null,description:``,name:`onMouseMoveCapture`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler<HTMLSelectElement>`}]}},onMouseOut:{defaultValue:null,description:``,name:`onMouseOut`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler<HTMLSelectElement>`}]}},onMouseOutCapture:{defaultValue:null,description:``,name:`onMouseOutCapture`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler<HTMLSelectElement>`}]}},onMouseOver:{defaultValue:null,description:``,name:`onMouseOver`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler<HTMLSelectElement>`}]}},onMouseOverCapture:{defaultValue:null,description:``,name:`onMouseOverCapture`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler<HTMLSelectElement>`}]}},onMouseUp:{defaultValue:null,description:``,name:`onMouseUp`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler<HTMLSelectElement>`}]}},onMouseUpCapture:{defaultValue:null,description:``,name:`onMouseUpCapture`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler<HTMLSelectElement>`}]}},onSelect:{defaultValue:null,description:``,name:`onSelect`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onSelectCapture:{defaultValue:null,description:``,name:`onSelectCapture`,required:!1,type:{name:`enum`,value:[{value:`ReactEventHandler<HTMLSelectElement>`}]}},onTouchCancel:{defaultValue:null,description:``,name:`onTouchCancel`,required:!1,type:{name:`enum`,value:[{value:`TouchEventHandler<HTMLSelectElement>`}]}},onTouchCancelCapture:{defaultValue:null,description:``,name:`onTouchCancelCapture`,required:!1,type:{name:`enum`,value:[{value:`TouchEventHandler<HTMLSelectElement>`}]}},onTouchEnd:{defaultValue:null,description:``,name:`onTouchEnd`,required:!1,type:{name:`enum`,value:[{value:`TouchEventHandler<HTMLSelectElement>`}]}},onTouchEndCapture:{defaultValue:null,description:``,name:`onTouchEndCapture`,required:!1,type:{name:`enum`,value:[{value:`TouchEventHandler<HTMLSelectElement>`}]}},onTouchMove:{defaultValue:null,description:``,name:`onTouchMove`,required:!1,type:{name:`enum`,value:[{value:`TouchEventHandler<HTMLSelectElement>`}]}},onTouchMoveCapture:{defaultValue:null,description:``,name:`onTouchMoveCapture`,required:!1,type:{name:`enum`,value:[{value:`TouchEventHandler<HTMLSelectElement>`}]}},onTouchStart:{defaultValue:null,description:``,name:`onTouchStart`,required:!1,type:{name:`enum`,value:[{value:`TouchEventHandler<HTMLSelectElement>`}]}},onTouchStartCapture:{defaultValue:null,description:``,name:`onTouchStartCapture`,required:!1,type:{name:`enum`,value:[{value:`TouchEventHandler<HTMLSelectElement>`}]}},onPointerDown:{defaultValue:null,description:``,name:`onPointerDown`,required:!1,type:{name:`enum`,value:[{value:`PointerEventHandler<HTMLSelectElement>`}]}},onPointerDownCapture:{defaultValue:null,description:``,name:`onPointerDownCapture`,required:!1,type:{name:`enum`,value:[{value:`PointerEventHandler<HTMLSelectElement>`}]}},onPointerMove:{defaultValue:null,description:``,name:`onPointerMove`,required:!1,type:{name:`enum`,value:[{value:`PointerEventHandler<HTMLSelectElement>`}]}},onPointerMoveCapture:{defaultValue:null,description:``,name:`onPointerMoveCapture`,required:!1,type:{name:`enum`,value:[{value:`PointerEventHandler<HTMLSelectElement>`}]}},onPointerUp:{defaultValue:null,description:``,name:`onPointerUp`,required:!1,type:{name:`enum`,value:[{value:`PointerEventHandler<HTMLSelectElement>`}]}},onPointerUpCapture:{defaultValue:null,description:``,name:`onPointerUpCapture`,required:!1,type:{name:`enum`,value:[{value:`PointerEventHandler<HTMLSelectElement>`}]}},onPointerCancel:{defaultValue:null,description:``,name:`onPointerCancel`,required:!1,type:{name:`enum`,value:[{value:`PointerEventHandler<HTMLSelectElement>`}]}},onPointerCancelCapture:{defaultValue:null,description:``,name:`onPointerCancelCapture`,required:!1,type:{name:`enum`,value:[{value:`PointerEventHandler<HTMLSelectElement>`}]}},onPointerEnter:{defaultValue:null,description:``,name:`onPointerEnter`,required:!1,type:{name:`enum`,value:[{value:`PointerEventHandler<HTMLSelectElement>`}]}},onPointerLeave:{defaultValue:null,description:``,name:`onPointerLeave`,required:!1,type:{name:`enum`,value:[{value:`PointerEventHandler<HTMLSelectElement>`}]}},onPointerOver:{defaultValue:null,description:``,name:`onPointerOver`,required:!1,type:{name:`enum`,value:[{value:`PointerEventHandler<HTMLSelectElement>`}]}},onPointerOverCapture:{defaultValue:null,description:``,name:`onPointerOverCapture`,required:!1,type:{name:`enum`,value:[{value:`PointerEventHandler<HTMLSelectElement>`}]}},onPointerOut:{defaultValue:null,description:``,name:`onPointerOut`,required:!1,type:{name:`enum`,value:[{value:`PointerEventHandler<HTMLSelectElement>`}]}},onPointerOutCapture:{defaultValue:null,description:``,name:`onPointerOutCapture`,required:!1,type:{name:`enum`,value:[{value:`PointerEventHandler<HTMLSelectElement>`}]}},onGotPointerCapture:{defaultValue:null,description:``,name:`onGotPointerCapture`,required:!1,type:{name:`enum`,value:[{value:`PointerEventHandler<HTMLSelectElement>`}]}},onGotPointerCaptureCapture:{defaultValue:null,description:``,name:`onGotPointerCaptureCapture`,required:!1,type:{name:`enum`,value:[{value:`PointerEventHandler<HTMLSelectElement>`}]}},onLostPointerCapture:{defaultValue:null,description:``,name:`onLostPointerCapture`,required:!1,type:{name:`enum`,value:[{value:`PointerEventHandler<HTMLSelectElement>`}]}},onLostPointerCaptureCapture:{defaultValue:null,description:``,name:`onLostPointerCaptureCapture`,required:!1,type:{name:`enum`,value:[{value:`PointerEventHandler<HTMLSelectElement>`}]}},onScroll:{defaultValue:null,description:``,name:`onScroll`,required:!1,type:{name:`enum`,value:[{value:`UIEventHandler<HTMLSelectElement>`}]}},onScrollCapture:{defaultValue:null,description:``,name:`onScrollCapture`,required:!1,type:{name:`enum`,value:[{value:`UIEventHandler<HTMLSelectElement>`}]}},onWheel:{defaultValue:null,description:``,name:`onWheel`,required:!1,type:{name:`enum`,value:[{value:`WheelEventHandler<HTMLSelectElement>`}]}},onWheelCapture:{defaultValue:null,description:``,name:`onWheelCapture`,required:!1,type:{name:`enum`,value:[{value:`WheelEventHandler<HTMLSelectElement>`}]}},onAnimationStart:{defaultValue:null,description:``,name:`onAnimationStart`,required:!1,type:{name:`enum`,value:[{value:`AnimationEventHandler<HTMLSelectElement>`}]}},onAnimationStartCapture:{defaultValue:null,description:``,name:`onAnimationStartCapture`,required:!1,type:{name:`enum`,value:[{value:`AnimationEventHandler<HTMLSelectElement>`}]}},onAnimationEnd:{defaultValue:null,description:``,name:`onAnimationEnd`,required:!1,type:{name:`enum`,value:[{value:`AnimationEventHandler<HTMLSelectElement>`}]}},onAnimationEndCapture:{defaultValue:null,description:``,name:`onAnimationEndCapture`,required:!1,type:{name:`enum`,value:[{value:`AnimationEventHandler<HTMLSelectElement>`}]}},onAnimationIteration:{defaultValue:null,description:``,name:`onAnimationIteration`,required:!1,type:{name:`enum`,value:[{value:`AnimationEventHandler<HTMLSelectElement>`}]}},onAnimationIterationCapture:{defaultValue:null,description:``,name:`onAnimationIterationCapture`,required:!1,type:{name:`enum`,value:[{value:`AnimationEventHandler<HTMLSelectElement>`}]}},onTransitionEnd:{defaultValue:null,description:``,name:`onTransitionEnd`,required:!1,type:{name:`enum`,value:[{value:`TransitionEventHandler<HTMLSelectElement>`}]}},onTransitionEndCapture:{defaultValue:null,description:``,name:`onTransitionEndCapture`,required:!1,type:{name:`enum`,value:[{value:`TransitionEventHandler<HTMLSelectElement>`}]}},icon:{defaultValue:null,description:``,name:`icon`,required:!1,type:{name:`enum`,value:[{value:`ReactElement<any, string | JSXElementConstructor<any>>`}]}},placeholder:{defaultValue:null,description:``,name:`placeholder`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},dataset:{defaultValue:null,description:``,name:`dataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}},onValueChange:{defaultValue:null,description:``,name:`onValueChange`,required:!1,type:{name:`enum`,value:[{value:`(value: string) => void`}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:`ref`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`(instance: HTMLSelectElement | null) => void`},{value:`RefObject<HTMLSelectElement>`}]}},key:{defaultValue:null,description:``,name:`key`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`number`},{value:`bigint`}]}}}}}catch{}}));function w(e){return(0,E.jsx)(`option`,{...e,...r(void 0,{preplyDsComponent:c.SelectFieldOption})})}var T,E,D,O,k=t((()=>{T=e(n(),1),i(),l(),f(),C(),E=a(),D=(0,T.forwardRef)(function({id:e,label:t,description:n,error:r,required:i,inputDataset:a,dataset:o,hideLabel:s,onClick:l,children:u,hasError:d,useLegacyRequiredLabel:f,className:m,style:h,...g},_){return(0,E.jsx)(p,{id:e,label:t,description:n,error:r,hasError:d,required:i,dataset:o,hideLabel:s,onClick:l,useLegacyRequiredLabel:f,preplyDsComponent:c.SelectField,children:(0,E.jsx)(S,{...g,ref:_,dataset:a,children:u})})}),D.Option=w,O=D;try{w.displayName=`NativeSelectFieldOption`,w.__docgenInfo={description:``,displayName:`NativeSelectFieldOption`,props:{value:{defaultValue:null,description:``,name:`value`,required:!0,type:{name:`string`}},disabled:{defaultValue:null,description:``,name:`disabled`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}}}}}catch{}try{O.displayName=`NativeSelectField`,O.__docgenInfo={description:``,displayName:`NativeSelectField`,props:{id:{defaultValue:null,description:`The id to be passed to the input element.
+If not provided, will be generated for accessibility purposes.`,name:`id`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},onClick:{defaultValue:null,description:``,name:`onClick`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler<HTMLDivElement> & MouseEventHandler<HTMLSelectElement>`}]}},label:{defaultValue:null,description:"The field label. This is needed for accessibility purposes, but can be\nhidden using the `hideLabel` prop.",name:`label`,required:!0,type:{name:`enum`,value:[{value:`undefined`},{value:`null`},{value:`string`},{value:`number`},{value:`false`},{value:`true`},{value:`ReactElement<any, string | JSXElementConstructor<any>>`},{value:`Iterable<ReactNode>`},{value:`ReactPortal`}]}},required:{defaultValue:null,description:`Indicates if the field is required. When false, adds a "Optional"
+indicator next to the label.`,name:`required`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},dataset:{defaultValue:null,description:``,name:`dataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}},hideLabel:{defaultValue:null,description:"Use this to hide the `label` visually, but keep it in the accessibility\ntree.",name:`hideLabel`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},description:{defaultValue:null,description:`Additional descriptive text that appears below the input field
+to provide more context or instructions to the user.`,name:`description`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`number`},{value:`false`},{value:`true`},{value:`ReactElement<any, string | JSXElementConstructor<any>>`},{value:`Iterable<ReactNode>`},{value:`ReactPortal`}]}},error:{defaultValue:null,description:`Error message to display when the field has an invalid value.`,name:`error`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`number`},{value:`false`},{value:`true`},{value:`ReactElement<any, string | JSXElementConstructor<any>>`},{value:`Iterable<ReactNode>`},{value:`ReactPortal`}]}},hasError:{defaultValue:null,description:"Whether the field has an error.\n@deprecated Use `error` prop to explicitly describe the error to users",name:`hasError`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},useLegacyRequiredLabel:{defaultValue:null,description:`When true, adds a "Required" indicator next to the label for the required fields.
+When false, adds a "Optional" indicator next to the label for the optional fields instead.
+@deprecated This is a temporary solution for gradual migration to the "Optional" label.`,name:`useLegacyRequiredLabel`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},onCopy:{defaultValue:null,description:``,name:`onCopy`,required:!1,type:{name:`enum`,value:[{value:`ClipboardEventHandler<HTMLSelectElement>`}]}},onCut:{defaultValue:null,description:``,name:`onCut`,required:!1,type:{name:`enum`,value:[{value:`ClipboardEventHandler<HTMLSelectElement>`}]}},onPaste:{defaultValue:null,description:``,name:`onPaste`,required:!1,type:{name:`enum`,value:[{value:`ClipboardEventHandler<HTMLSelectElement>`}]}},onFocus:{defaultValue:null,description:``,name:`onFocus`,required:!1,type:{name:`enum`,value:[{value:`FocusEventHandler<HTMLSelectElement>`}]}},onBlur:{defaultValue:null,description:``,name:`onBlur`,required:!1,type:{name:`enum`,value:[{value:`FocusEventHandler<HTMLSelectElement>`}]}},onChange:{defaultValue:null,description:``,name:`onChange`,required:!1,type:{name:`enum`,value:[{value:`ChangeEventHandler<HTMLSelectElement>`}]}},onKeyDown:{defaultValue:null,description:``,name:`onKeyDown`,required:!1,type:{name:`enum`,value:[{value:`KeyboardEventHandler<HTMLSelectElement>`}]}},onKeyUp:{defaultValue:null,description:``,name:`onKeyUp`,required:!1,type:{name:`enum`,value:[{value:`KeyboardEventHandler<HTMLSelectElement>`}]}},name:{defaultValue:null,description:``,name:`name`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},disabled:{defaultValue:null,description:``,name:`disabled`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},icon:{defaultValue:null,description:``,name:`icon`,required:!1,type:{name:`enum`,value:[{value:`ReactElement<any, string | JSXElementConstructor<any>>`}]}},onValueChange:{defaultValue:null,description:``,name:`onValueChange`,required:!1,type:{name:`enum`,value:[{value:`(value: string) => void`}]}},value:{defaultValue:null,description:``,name:`value`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},defaultValue:{defaultValue:null,description:``,name:`defaultValue`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},placeholder:{defaultValue:null,description:``,name:`placeholder`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},inputDataset:{defaultValue:null,description:``,name:`inputDataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:`ref`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`(instance: HTMLSelectElement | null) => void`},{value:`RefObject<HTMLSelectElement>`}]}},key:{defaultValue:null,description:``,name:`key`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`number`},{value:`bigint`}]}}}}}catch{}})),A,j,M,N,P,F,I,L,R,z,B,V,H,U,W,G,K;t((()=>{A=e(n(),1),v(),u(),k(),j=a(),{expect:M,userEvent:N,within:P,fn:F}=__STORYBOOK_MODULE_TEST__,I={title:`components/SelectField/NativeSelectField (deprecated)`,component:O,subcomponents:{NativeSelectFieldOption:O.Option},args:{name:`language`,label:`Language`,placeholder:`Select a language`,defaultValue:``,dataset:{testid:`field`,foo:`bar`},inputDataset:{testid:`input`,foo:`bar`},onChange:F(),onValueChange:F(),onBlur:F(),onFocus:F(),onClick:F(),onCopy:F(),onKeyDown:F(),onKeyUp:F(),onPaste:F(),children:(0,j.jsxs)(j.Fragment,{children:[(0,j.jsx)(O.Option,{value:`english`,children:`English`}),(0,j.jsx)(O.Option,{value:`spanish`,children:`Spanish`}),(0,j.jsx)(O.Option,{value:`french`,children:`French`})]})}},L={play:async({canvasElement:e,step:t,args:n})=>{let r=P(e),i=r.getByTestId(`field`),a=r.getByTestId(`input`);await t(`it should render correct label`,async()=>{M(P(i).getByTestId(`label`)).toHaveTextContent(`Language • Optional`),M(a).toHaveAccessibleName(`Language`)}),await t(`it should call onFocus when the input is focused`,async()=>{a.focus(),M(n.onFocus).toHaveBeenCalled()}),await t(`it should call callback when the value changes`,async()=>{await N.selectOptions(a,`spanish`),M(n.onValueChange).toHaveBeenCalledWith(`spanish`),M(n.onChange).toHaveBeenCalled()}),await t(`it should call onBlur when the input is blurred`,async()=>{await N.keyboard(`{tab}`),M(n.onBlur).toHaveBeenCalled()}),await t(`it should render the dataset props`,async()=>{M(i).toHaveAttribute(`data-testid`,`field`),M(i).toHaveAttribute(`data-foo`,`bar`),M(a).toHaveAttribute(`data-testid`,`input`),M(a).toHaveAttribute(`data-foo`,`bar`)}),await t(`it should render all options`,async()=>{let e=r.getByRole(`option`,{name:`English`}),t=r.getByRole(`option`,{name:`Spanish`}),n=r.getByRole(`option`,{name:`French`});M(e).toBeInTheDocument(),M(t).toBeInTheDocument(),M(n).toBeInTheDocument()})}},R={render:function(e){let[t,n]=(0,A.useState)(e.value);return(0,j.jsxs)(O,{...e,value:t,onChange:t=>{n(t.target.value),e.onChange?.(t)},children:[(0,j.jsx)(O.Option,{value:`english`,children:`English`}),(0,j.jsx)(O.Option,{value:`spanish`,children:`Spanish`}),(0,j.jsx)(O.Option,{value:`french`,children:`French`})]})},args:{label:`Controlled SelectField`,placeholder:`Select a language...`,value:`spanish`},play:async({canvas:e,step:t})=>{await t(`it should render the correct initial value`,async()=>{await M(e.getByTestId(`input`)).toHaveValue(`spanish`)}),await t(`it should update the value when the user selects`,async()=>{let t=e.getByTestId(`input`);await N.selectOptions(t,`french`),M(t).toHaveValue(`french`)})}},z={args:{icon:(0,j.jsx)(d,{svg:y,dataset:{testid:`icon`}})},play:async({canvas:e,step:t})=>{await t(`it should render the icon`,async()=>{M(e.getByTestId(`icon`)).toBeInTheDocument()})}},B={args:{description:`We will use this to get a personalized choice of tutors`},play:async({canvas:e,step:t})=>{let n=e.getByTestId(`input`),r=e.getByTestId(`description`);await t(`it should render the description`,async()=>{M(n).toHaveAccessibleDescription(`We will use this to get a personalized choice of tutors`),M(r).toHaveTextContent(`We will use this to get a personalized choice of tutors`)})}},V={args:{required:!0},play:async({canvas:e,step:t})=>{let n=e.getByTestId(`input`),r=e.getByTestId(`label`);await t(`it should render correct label`,async()=>{M(n).toHaveAccessibleName(`Language`),M(r).toHaveTextContent(`Language`)}),await t(`it should render required attribute`,async()=>{M(n).toHaveAttribute(`required`)})}},H={args:{hideLabel:!0},play:async({canvas:e,step:t})=>{await t(`it should render correct a11y label`,async()=>{M(e.getByTestId(`input`)).toHaveAccessibleName(`Language`)})}},U={args:{error:`This is an error message`},play:async({canvas:e,step:t})=>{let n=e.getByTestId(`input`),r=e.getByTestId(`error`);await t(`it should render the error message`,async()=>{M(n).toHaveAccessibleErrorMessage(`This is an error message`),M(r).toHaveTextContent(`This is an error message`)})}},W={args:{disabled:!0},play:async({canvas:e,step:t})=>{let n=e.getByTestId(`input`);await t(`it should render the disabled input`,async()=>{M(n).toHaveAttribute(`disabled`)})}},G={parameters:{chromatic:{disableSnapshot:!0}},args:{label:`Language`,placeholder:`Select a subject`,description:`We will use this to get a personalized choice of tutors`,children:(0,j.jsxs)(j.Fragment,{children:[(0,j.jsx)(O.Option,{value:`english`,children:`English`}),(0,j.jsx)(O.Option,{value:`spanish`,children:`Spanish`}),(0,j.jsx)(O.Option,{value:`french`,children:`French`})]})},argTypes:{label:{control:`text`},placeholder:{control:`text`},description:{control:`text`},error:{control:`text`},value:{control:`text`},defaultValue:{control:`text`},inputDataset:{control:`object`},dataset:{control:`object`},id:{control:`text`},required:{control:`boolean`},hideLabel:{control:`boolean`},name:{control:`text`},disabled:{control:`boolean`},icon:{options:[`None`,`With Icon`],mapping:{None:void 0,"With Icon":(0,j.jsx)(d,{svg:y,label:`Student with a hat`})},control:`select`},children:{control:!1},hasError:{table:{disable:!0}}}},L.parameters={...L.parameters,docs:{...L.parameters?.docs,source:{originalSource:`{
+  play: async ({
+    canvasElement,
+    step,
+    args
+  }) => {
+    const canvas = within(canvasElement);
+    const field = canvas.getByTestId('field');
+    const input = canvas.getByTestId('input');
+    await step('it should render correct label', async () => {
+      const label = within(field).getByTestId('label');
+      expect(label).toHaveTextContent('Language • Optional');
+      expect(input).toHaveAccessibleName('Language');
+    });
+    await step('it should call onFocus when the input is focused', async () => {
+      input.focus();
+      expect(args.onFocus).toHaveBeenCalled();
+    });
+    await step('it should call callback when the value changes', async () => {
+      await userEvent.selectOptions(input, 'spanish');
+      expect(args.onValueChange).toHaveBeenCalledWith('spanish');
+      expect(args.onChange).toHaveBeenCalled();
+    });
+    await step('it should call onBlur when the input is blurred', async () => {
+      await userEvent.keyboard('{tab}');
+      expect(args.onBlur).toHaveBeenCalled();
+    });
+    await step('it should render the dataset props', async () => {
+      expect(field).toHaveAttribute('data-testid', 'field');
+      expect(field).toHaveAttribute('data-foo', 'bar');
+      expect(input).toHaveAttribute('data-testid', 'input');
+      expect(input).toHaveAttribute('data-foo', 'bar');
+    });
+    await step('it should render all options', async () => {
+      const englishOption = canvas.getByRole('option', {
+        name: 'English'
+      });
+      const spanishOption = canvas.getByRole('option', {
+        name: 'Spanish'
+      });
+      const frenchOption = canvas.getByRole('option', {
+        name: 'French'
+      });
+      expect(englishOption).toBeInTheDocument();
+      expect(spanishOption).toBeInTheDocument();
+      expect(frenchOption).toBeInTheDocument();
+    });
+  }
+}`,...L.parameters?.docs?.source},description:{story:"An empty field with a `label` and a `placeholder`.",...L.parameters?.docs?.description}}},R.parameters={...R.parameters,docs:{...R.parameters?.docs,source:{originalSource:`{
+  render: function ControlledSelectField(args) {
+    const [value, setValue] = useState(args.value);
+    return <NativeSelectField {...args} value={value} onChange={e => {
+      setValue(e.target.value);
+      args.onChange?.(e);
+    }}>
+                <NativeSelectField.Option value="english">English</NativeSelectField.Option>
+                <NativeSelectField.Option value="spanish">Spanish</NativeSelectField.Option>
+                <NativeSelectField.Option value="french">French</NativeSelectField.Option>
+            </NativeSelectField>;
+  },
+  args: {
+    label: 'Controlled SelectField',
+    placeholder: 'Select a language...',
+    value: 'spanish'
+  },
+  play: async ({
+    canvas,
+    step
+  }) => {
+    await step('it should render the correct initial value', async () => {
+      const input = canvas.getByTestId('input');
+      await expect(input).toHaveValue('spanish');
+    });
+    await step('it should update the value when the user selects', async () => {
+      const input = canvas.getByTestId('input');
+      await userEvent.selectOptions(input, 'french');
+      expect(input).toHaveValue('french');
+    });
+  }
+}`,...R.parameters?.docs?.source},description:{story:`A controlled component where the value is managed by React state.`,...R.parameters?.docs?.description}}},z.parameters={...z.parameters,docs:{...z.parameters?.docs,source:{originalSource:`{
+  args: {
+    icon: <Icon svg={LanguageSvg} dataset={{
+      testid: 'icon'
+    }} />
+  },
+  play: async ({
+    canvas,
+    step
+  }) => {
+    await step('it should render the icon', async () => {
+      const icon = canvas.getByTestId('icon');
+      expect(icon).toBeInTheDocument();
+    });
+  }
+}`,...z.parameters?.docs?.source}}},B.parameters={...B.parameters,docs:{...B.parameters?.docs,source:{originalSource:`{
+  args: {
+    description: 'We will use this to get a personalized choice of tutors'
+  },
+  play: async ({
+    canvas,
+    step
+  }) => {
+    const input = canvas.getByTestId('input');
+    const description = canvas.getByTestId('description');
+    await step('it should render the description', async () => {
+      expect(input).toHaveAccessibleDescription('We will use this to get a personalized choice of tutors');
+      expect(description).toHaveTextContent('We will use this to get a personalized choice of tutors');
+    });
+  }
+}`,...B.parameters?.docs?.source}}},V.parameters={...V.parameters,docs:{...V.parameters?.docs,source:{originalSource:`{
+  args: {
+    required: true
+  },
+  play: async ({
+    canvas,
+    step
+  }) => {
+    const input = canvas.getByTestId('input');
+    const label = canvas.getByTestId('label');
+    await step('it should render correct label', async () => {
+      expect(input).toHaveAccessibleName('Language');
+      expect(label).toHaveTextContent('Language');
+    });
+    await step('it should render required attribute', async () => {
+      expect(input).toHaveAttribute('required');
+    });
+  }
+}`,...V.parameters?.docs?.source}}},H.parameters={...H.parameters,docs:{...H.parameters?.docs,source:{originalSource:`{
+  args: {
+    hideLabel: true
+  },
+  play: async ({
+    canvas,
+    step
+  }) => {
+    await step('it should render correct a11y label', async () => {
+      const input = canvas.getByTestId('input');
+      expect(input).toHaveAccessibleName('Language');
+    });
+  }
+}`,...H.parameters?.docs?.source}}},U.parameters={...U.parameters,docs:{...U.parameters?.docs,source:{originalSource:`{
+  args: {
+    error: 'This is an error message'
+  },
+  play: async ({
+    canvas,
+    step
+  }) => {
+    const input = canvas.getByTestId('input');
+    const error = canvas.getByTestId('error');
+    await step('it should render the error message', async () => {
+      expect(input).toHaveAccessibleErrorMessage('This is an error message');
+      expect(error).toHaveTextContent('This is an error message');
+    });
+  }
+}`,...U.parameters?.docs?.source}}},W.parameters={...W.parameters,docs:{...W.parameters?.docs,source:{originalSource:`{
+  args: {
+    disabled: true
+  },
+  play: async ({
+    canvas,
+    step
+  }) => {
+    const input = canvas.getByTestId('input');
+    await step('it should render the disabled input', async () => {
+      expect(input).toHaveAttribute('disabled');
+    });
+  }
+}`,...W.parameters?.docs?.source}}},G.parameters={...G.parameters,docs:{...G.parameters?.docs,source:{originalSource:`{
+  parameters: {
+    chromatic: {
+      disableSnapshot: true
+    }
+  },
+  args: {
+    label: 'Language',
+    placeholder: 'Select a subject',
+    description: 'We will use this to get a personalized choice of tutors',
+    children: <>
+                <NativeSelectField.Option value="english">English</NativeSelectField.Option>
+                <NativeSelectField.Option value="spanish">Spanish</NativeSelectField.Option>
+                <NativeSelectField.Option value="french">French</NativeSelectField.Option>
+            </>
+  },
+  argTypes: {
+    label: {
+      control: 'text'
+    },
+    placeholder: {
+      control: 'text'
+    },
+    description: {
+      control: 'text'
+    },
+    error: {
+      control: 'text'
+    },
+    value: {
+      control: 'text'
+    },
+    defaultValue: {
+      control: 'text'
+    },
+    inputDataset: {
+      control: 'object'
+    },
+    dataset: {
+      control: 'object'
+    },
+    id: {
+      control: 'text'
+    },
+    required: {
+      control: 'boolean'
+    },
+    hideLabel: {
+      control: 'boolean'
+    },
+    name: {
+      control: 'text'
+    },
+    disabled: {
+      control: 'boolean'
+    },
+    icon: {
+      options: ['None', 'With Icon'],
+      mapping: {
+        None: undefined,
+        'With Icon': <Icon svg={LanguageSvg} label="Student with a hat" />
+      },
+      control: 'select'
+    },
+    children: {
+      control: false
+    },
+    // Disable deprecated props
+    hasError: {
+      table: {
+        disable: true
+      }
+    }
+  }
+}`,...G.parameters?.docs?.source}}},K=[`Basic`,`Controlled`,`WithIcon`,`WithDescription`,`Required`,`WithHiddenLabel`,`WithError`,`Disabled`,`Playground`]}))();export{L as Basic,R as Controlled,W as Disabled,G as Playground,V as Required,B as WithDescription,U as WithError,H as WithHiddenLabel,z as WithIcon,K as __namedExportsOrder,I as default};

package/dist/assets/NumberField-BAofx_Ni.js

@@ -0,0 +1,6 @@
+import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{t as r}from"./jsx-runtime-C2wGStra.js";import{n as i,t as a}from"./dist-Cc1j9Pjk.js";import{n as o,t as s}from"./FormControl-cSvM3XwI.js";import{r as c,t as l}from"./Input-DXnvG-Wl.js";var u,d,f,p=t((()=>{u=e(n(),1),o(),l(),a(),d=r(),f=(0,u.forwardRef)(function({id:e,label:t,description:n,error:r,required:a,inputDataset:o,dataset:l,hideLabel:u,onClick:f,onValueChange:p,onChange:m,hasError:h,useLegacyRequiredLabel:g,className:_,style:v,...y},b){let x=e=>{m?.(e);let t=e.target.value;p?.(t?Number(t):void 0)};return(0,d.jsx)(s,{id:e,label:t,description:n,error:r,hasError:h,required:a,dataset:l,hideLabel:u,onClick:f,useLegacyRequiredLabel:g,preplyDsComponent:i.NumberField,children:(0,d.jsx)(c,{...y,type:`number`,ref:b,dataset:o,onChange:x})})});try{f.displayName=`NumberField`,f.__docgenInfo={description:``,displayName:`NumberField`,props:{id:{defaultValue:null,description:`The id to be passed to the input element.
+If not provided, will be generated for accessibility purposes.`,name:`id`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},onClick:{defaultValue:null,description:``,name:`onClick`,required:!1,type:{name:`enum`,value:[{value:`MouseEventHandler<HTMLDivElement> & MouseEventHandler<HTMLInputElement>`}]}},label:{defaultValue:null,description:"The field label. This is needed for accessibility purposes, but can be\nhidden using the `hideLabel` prop.",name:`label`,required:!0,type:{name:`enum`,value:[{value:`undefined`},{value:`null`},{value:`string`},{value:`number`},{value:`false`},{value:`true`},{value:`ReactElement<any, string | JSXElementConstructor<any>>`},{value:`Iterable<ReactNode>`},{value:`ReactPortal`}]}},required:{defaultValue:null,description:`Indicates if the field is required. When false, adds a "Optional"
+indicator next to the label.`,name:`required`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},dataset:{defaultValue:null,description:``,name:`dataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}},hideLabel:{defaultValue:null,description:"Use this to hide the `label` visually, but keep it in the accessibility\ntree.",name:`hideLabel`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},description:{defaultValue:null,description:`Additional descriptive text that appears below the input field
+to provide more context or instructions to the user.`,name:`description`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`number`},{value:`false`},{value:`true`},{value:`ReactElement<any, string | JSXElementConstructor<any>>`},{value:`Iterable<ReactNode>`},{value:`ReactPortal`}]}},error:{defaultValue:null,description:`Error message to display when the field has an invalid value.`,name:`error`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`number`},{value:`false`},{value:`true`},{value:`ReactElement<any, string | JSXElementConstructor<any>>`},{value:`Iterable<ReactNode>`},{value:`ReactPortal`}]}},hasError:{defaultValue:null,description:"Whether the field has an error.\n@deprecated Use `error` prop to explicitly describe the error to users",name:`hasError`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},useLegacyRequiredLabel:{defaultValue:null,description:`When true, adds a "Required" indicator next to the label for the required fields.
+When false, adds a "Optional" indicator next to the label for the optional fields instead.
+@deprecated This is a temporary solution for gradual migration to the "Optional" label.`,name:`useLegacyRequiredLabel`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},onCopy:{defaultValue:null,description:``,name:`onCopy`,required:!1,type:{name:`enum`,value:[{value:`ClipboardEventHandler<HTMLInputElement>`}]}},onCut:{defaultValue:null,description:``,name:`onCut`,required:!1,type:{name:`enum`,value:[{value:`ClipboardEventHandler<HTMLInputElement>`}]}},onPaste:{defaultValue:null,description:``,name:`onPaste`,required:!1,type:{name:`enum`,value:[{value:`ClipboardEventHandler<HTMLInputElement>`}]}},onFocus:{defaultValue:null,description:``,name:`onFocus`,required:!1,type:{name:`enum`,value:[{value:`FocusEventHandler<HTMLInputElement>`}]}},onBlur:{defaultValue:null,description:``,name:`onBlur`,required:!1,type:{name:`enum`,value:[{value:`FocusEventHandler<HTMLInputElement>`}]}},onChange:{defaultValue:null,description:``,name:`onChange`,required:!1,type:{name:`enum`,value:[{value:`ChangeEventHandler<HTMLInputElement>`}]}},onKeyDown:{defaultValue:null,description:``,name:`onKeyDown`,required:!1,type:{name:`enum`,value:[{value:`KeyboardEventHandler<HTMLInputElement>`}]}},onKeyUp:{defaultValue:null,description:``,name:`onKeyUp`,required:!1,type:{name:`enum`,value:[{value:`KeyboardEventHandler<HTMLInputElement>`}]}},button:{defaultValue:null,description:``,name:`button`,required:!1,type:{name:`enum`,value:[{value:`ReactElement<any, string | JSXElementConstructor<any>>`}]}},name:{defaultValue:null,description:``,name:`name`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},disabled:{defaultValue:null,description:``,name:`disabled`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},maxLength:{defaultValue:null,description:``,name:`maxLength`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},placeholder:{defaultValue:null,description:``,name:`placeholder`,required:!1,type:{name:`enum`,value:[{value:`string`}]}},readOnly:{defaultValue:null,description:``,name:`readOnly`,required:!1,type:{name:`enum`,value:[{value:`false`},{value:`true`}]}},icon:{defaultValue:null,description:``,name:`icon`,required:!1,type:{name:`enum`,value:[{value:`ReactElement<any, string | JSXElementConstructor<any>>`}]}},value:{defaultValue:null,description:``,name:`value`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},defaultValue:{defaultValue:null,description:``,name:`defaultValue`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},onValueChange:{defaultValue:null,description:``,name:`onValueChange`,required:!1,type:{name:`enum`,value:[{value:`(value: number | undefined) => void`}]}},min:{defaultValue:null,description:``,name:`min`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},max:{defaultValue:null,description:``,name:`max`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},step:{defaultValue:null,description:``,name:`step`,required:!1,type:{name:`enum`,value:[{value:`number`}]}},inputDataset:{defaultValue:null,description:``,name:`inputDataset`,required:!1,type:{name:`enum`,value:[{value:`Dataset`}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:`ref`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`(instance: HTMLInputElement | null) => void`},{value:`RefObject<HTMLInputElement>`}]}},key:{defaultValue:null,description:``,name:`key`,required:!1,type:{name:`enum`,value:[{value:`null`},{value:`string`},{value:`number`},{value:`bigint`}]}}}}}catch{}}));export{p as n,f as t};