{"version":3,"file":"/Users/anthonygubler/development/dojo-org/widgets/src/native-select/index.tsx","sourceRoot":"","sources":["index.tsx"],"names":[],"mappings":"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","sourcesContent":["import focus from '@dojo/framework/core/middleware/focus';\nimport { i18n } from '@dojo/framework/core/middleware/i18n';\nimport { createICacheMiddleware } from '@dojo/framework/core/middleware/icache';\nimport { create, tsx } from '@dojo/framework/core/vdom';\nimport { RenderResult } from '@dojo/framework/core/interfaces';\nimport HelperText from '../helper-text';\nimport theme from '../middleware/theme';\nimport { isRenderResult } from '../common/util';\nimport * as css from '../theme/default/native-select.m.css';\nimport * as labelCss from '../theme/default/label.m.css';\nimport * as iconCss from '../theme/default/icon.m.css';\nimport Icon from '../icon';\nimport Label from '../label';\n\nexport type MenuOption = { value: string; label?: string; disabled?: boolean };\n\nexport interface NativeSelectProperties {\n\t/** Callback called when user selects a value */\n\tonValue?(value: string): void;\n\t/** The initial selected value */\n\tinitialValue?: string;\n\t/** A controlled value */\n\tvalue?: string;\n\t/** Options to display within the menu */\n\toptions: MenuOption[];\n\t/** Property to determine if the input is disabled */\n\tdisabled?: boolean;\n\t/** Sets the helper text of the input */\n\thelperText?: string;\n\t/** Boolean to indicate if field is required */\n\trequired?: boolean;\n\t/** Used to specify the name of the control */\n\tname?: string;\n\t/** Represents the number of rows the are visible at one time */\n\tsize?: number;\n\t/** Handler for events triggered by select field losing focus */\n\tonBlur?(): void;\n\t/** Handler for events triggered by the select element being focused */\n\tonFocus?(): void;\n}\n\nexport interface NativeSelectChildren {\n\t/** The label to be displayed on the select */\n\tlabel?: RenderResult;\n}\n\ninterface NativeSelectICache {\n\tinitial: string;\n\tvalue: string;\n\tprependBlank: boolean;\n}\n\nconst icache = createICacheMiddleware<NativeSelectICache>();\n\nconst factory = create({ icache, focus, theme, i18n })\n\t.properties<NativeSelectProperties>()\n\t.children<NativeSelectChildren | RenderResult | undefined>();\n\nexport const NativeSelect = factory(function NativeSelect({\n\tproperties,\n\tchildren,\n\tid,\n\tmiddleware: { icache, theme, focus }\n}) {\n\tconst {\n\t\tclasses,\n\t\tvariant,\n\t\tdisabled,\n\t\thelperText,\n\t\tinitialValue,\n\t\tonValue,\n\t\toptions,\n\t\trequired,\n\t\tname,\n\t\tsize,\n\t\tonFocus,\n\t\tonBlur,\n\t\ttheme: themeProp\n\t} = properties();\n\n\tconst [labelChild] = children();\n\tconst label = isRenderResult(labelChild) ? labelChild : labelChild.label;\n\tlet { value } = properties();\n\n\tif (value === undefined) {\n\t\tvalue = icache.get('value');\n\t\tconst existingInitialValue = icache.get('initial');\n\t\ticache.set('prependBlank', true);\n\n\t\tif (initialValue !== undefined) {\n\t\t\ticache.set('prependBlank', false);\n\t\t\tif (initialValue !== existingInitialValue) {\n\t\t\t\ticache.set('initial', initialValue);\n\t\t\t\ticache.set('value', initialValue);\n\t\t\t\tvalue = initialValue;\n\t\t\t}\n\t\t}\n\t}\n\n\tconst selectedValue = value;\n\tconst themedCss = theme.classes(css);\n\tconst inputFocused = focus.isFocused('native-select');\n\n\treturn (\n\t\t<div\n\t\t\tclasses={[\n\t\t\t\ttheme.variant(),\n\t\t\t\tthemedCss.root,\n\t\t\t\tdisabled && themedCss.disabled,\n\t\t\t\trequired && themedCss.required,\n\t\t\t\tinputFocused ? themedCss.focused : undefined\n\t\t\t]}\n\t\t\tkey=\"root\"\n\t\t>\n\t\t\t{label && (\n\t\t\t\t<Label\n\t\t\t\t\ttheme={theme.compose(\n\t\t\t\t\t\tlabelCss,\n\t\t\t\t\t\tcss,\n\t\t\t\t\t\t'label'\n\t\t\t\t\t)}\n\t\t\t\t\tvariant={variant}\n\t\t\t\t\tfocused={inputFocused}\n\t\t\t\t\tclasses={classes}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tforId={id}\n\t\t\t\t\trequired={required}\n\t\t\t\t\tactive={!!selectedValue}\n\t\t\t\t>\n\t\t\t\t\t{label}\n\t\t\t\t</Label>\n\t\t\t)}\n\t\t\t<div classes={themedCss.inputWrapper}>\n\t\t\t\t<select\n\t\t\t\t\tkey=\"native-select\"\n\t\t\t\t\tonchange={(event: Event) => {\n\t\t\t\t\t\tconst { value } = event.target as HTMLInputElement;\n\t\t\t\t\t\tif (value !== icache.get('value')) {\n\t\t\t\t\t\t\ticache.set('value', value);\n\t\t\t\t\t\t\tonValue && onValue(value);\n\t\t\t\t\t\t}\n\t\t\t\t\t}}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tname={name}\n\t\t\t\t\trequired={required}\n\t\t\t\t\tid={id}\n\t\t\t\t\tsize={size}\n\t\t\t\t\tonfocus={() => {\n\t\t\t\t\t\tonFocus && onFocus();\n\t\t\t\t\t}}\n\t\t\t\t\tonblur={() => {\n\t\t\t\t\t\tonBlur && onBlur();\n\t\t\t\t\t}}\n\t\t\t\t\tclasses={themedCss.select}\n\t\t\t\t>\n\t\t\t\t\t{icache.get('prependBlank') && <option key=\"blank-option\" value=\"\" />}\n\t\t\t\t\t{options.map(({ value, label, disabled = false }, index) => {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<option\n\t\t\t\t\t\t\t\tkey={`option-${index}`}\n\t\t\t\t\t\t\t\tvalue={value}\n\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\tselected={selectedValue === value}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{label ? label : value}\n\t\t\t\t\t\t\t</option>\n\t\t\t\t\t\t);\n\t\t\t\t\t})}\n\t\t\t\t</select>\n\t\t\t\t<span classes={themedCss.arrow}>\n\t\t\t\t\t<Icon\n\t\t\t\t\t\ttype=\"downIcon\"\n\t\t\t\t\t\ttheme={theme.compose(\n\t\t\t\t\t\t\ticonCss,\n\t\t\t\t\t\t\tcss,\n\t\t\t\t\t\t\t'icon'\n\t\t\t\t\t\t)}\n\t\t\t\t\t\tvariant={variant}\n\t\t\t\t\t\tclasses={classes}\n\t\t\t\t\t/>\n\t\t\t\t</span>\n\t\t\t</div>\n\t\t\t<HelperText\n\t\t\t\tkey=\"helperText\"\n\t\t\t\ttext={helperText}\n\t\t\t\tvariant={variant}\n\t\t\t\tclasses={classes}\n\t\t\t\ttheme={themeProp}\n\t\t\t/>\n\t\t</div>\n\t);\n});\n\nexport default NativeSelect;\n"]}