@politiet/sheriff-web-components 2.13.0 → 2.14.0

package/dist/sds-search/sds-search.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sds-search.component.js","sourceRoot":"","sources":["../../src/sds-search/sds-search.component.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, PropertyValues } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { SDSElement } from '../utils/sds-element';\nimport { SDSEventDispatcherMixin, SDSFormControlMixin } from '../mixins';\nimport type { SDSFormControlAttributes } from '../mixins/sds-form-control-mixin';\nimport { styles } from './sds-search.styles';\nimport { SDS_SIZES, SDS_VARIANTS } from '../types';\n\nimport '../sds-textfield/sds-textfield';\nimport type { SDSTextField, SDSTextFieldProps } from '../sds-textfield/sds-textfield';\nimport '../sds-button/sds-button';\nimport '../sds-icon/sds-icon';\n\ntype SearchSize = Extract<SDS_SIZES, 'lg' | 'md' | 'sm'>;\ntype ButtonVariant = SDS_VARIANTS;\n\n/** Detail payload dispatched with the `search` event. */\nexport interface SDSSearchDetail {\n\tvalue: string;\n}\n\nexport interface SDSSearchProps extends SDSFormControlAttributes {\n\tvalue?: string;\n\tlabel?: string;\n\t'hide-label'?: boolean;\n\tplaceholder?: string;\n\t'help-text'?: string;\n\t'error-message'?: string;\n\tsize?: SearchSize;\n\t'button-label'?: string;\n\t'button-variant'?: ButtonVariant;\n\tautocomplete?: SDSTextFieldProps['autocomplete'];\n\trequired?: boolean;\n\tminlength?: number;\n\tmaxlength?: number;\n\tpattern?: string;\n}\n\n/**\n * A search field composed of an `sds-textfield` and `sds-button`.\n *\n * The field uses `type=\"search\"`, so its input exposes the `searchbox` role and\n * assistive technology announces it as a search field.\n *\n * The element is form-associated. Its `name` and value are submitted with the\n * surrounding `<form>`, and the form's reset restores the initial value.\n * `required`, `minlength`, `maxlength` and `pattern` are forwarded to the inner input, and its\n * validity is mirrored on the host, so the field takes part in form validation like a native input.\n *\n * Emits a cancelable `search` event (detail: `{ value }`) when the button is\n * pressed or the user presses Enter while the field is focused. Like a form's `submit`\n * event, it is only emitted once the field passes validation (unless the form has\n * `novalidate`). Unless the event is cancelled, the surrounding form (if any) is then submitted.\n *\n * A custom action control can be supplied through the `button` slot.\n * A slotted control owns its own behaviour (click, `disabled`, form submission);\n * Enter in the field still emits `search` and submits the form.\n *\n * @fires search - `CustomEvent<SDSSearchDetail>` on submit. Cancel it to prevent form submission.\n * @fires input - When the value of the field changes.\n * @fires change - When the value of the field has changed and the field loses focus.\n * @fires select - When text in the field is selected.\n * @fires keydown - `KeyboardEvent` on key presses in the field. Cancelling Enter prevents `search`.\n * @fires focus - `FocusEvent` when focus moves into the component. Moving between the field and the button does not fire.\n * @fires blur - `FocusEvent` when focus leaves the component. Moving between the field and the button does not fire.\n * @fires invalid - When `checkValidity()`, `reportValidity()` or form submission finds the field invalid.\n * @slot label - Rich content for the field's label. Takes precedence over the `label` property.\n * @slot button - Optional replacement for the default icon button.\n */\nexport class SDSSearchComponent extends SDSEventDispatcherMixin(SDSFormControlMixin(SDSElement)) {\n\tstatic override styles = [styles];\n\n\t@property({ type: String }) value: string = '';\n\t@property({ type: String, reflect: true }) label?: string;\n\t/** Hides the label visually while keeping it as the field's accessible name. */\n\t@property({ type: Boolean, attribute: 'hide-label', reflect: true })\n\thideLabel: boolean = false;\n\t@property({ type: String, reflect: true }) placeholder?: string;\n\t@property({ type: String, attribute: 'help-text', reflect: true })\n\thelpText?: string;\n\t@property({ type: String, attribute: 'error-message', reflect: true })\n\terrorMessage?: string;\n\t@property({ type: String, reflect: true }) size: SearchSize = 'md';\n\t@property({ type: String, attribute: 'button-label', reflect: true })\n\tbuttonLabel: string = 'Søk';\n\t@property({ type: String, attribute: 'button-variant', reflect: true })\n\tbuttonVariant: ButtonVariant = 'primary';\n\t@property({ type: String, reflect: true }) autocomplete?: SDSSearchProps['autocomplete'];\n\t@property({ type: Boolean, reflect: true }) required: boolean = false;\n\t@property({ type: Number, reflect: true }) minlength?: number;\n\t@property({ type: Number, reflect: true }) maxlength?: number;\n\t@property({ type: String, reflect: true }) pattern?: string;\n\n\t@query('.sds-search__field') private _field?: SDSTextField;\n\t@query('.sds-search__button-col') private _buttonCol?: HTMLElement;\n\n\tprivate _resizeObserver?: ResizeObserver;\n\tprivate _defaultValue = '';\n\tprivate _customValidityMessage = '';\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis.addEventListener('focusin', this._handleFocusIn);\n\t\tthis.addEventListener('focusout', this._handleFocusOut);\n\t}\n\n\toverride connectedCallback(): void {\n\t\tsuper.connectedCallback();\n\t\tthis._defaultValue = this.value;\n\t\tthis.internals.setFormValue(this.value);\n\t\t// Re-align when the field reflows (e.g. help text wraps on narrow widths).\n\t\tconst resizeObserver = new ResizeObserver(() => this._alignButtonToInput());\n\t\tthis._resizeObserver = resizeObserver;\n\t\tvoid this.updateComplete.then(() => {\n\t\t\tif (this._resizeObserver === resizeObserver && this._field) {\n\t\t\t\tresizeObserver.observe(this._field);\n\t\t\t}\n\t\t});\n\t}\n\n\toverride disconnectedCallback(): void {\n\t\tsuper.disconnectedCallback();\n\t\tthis._resizeObserver?.disconnect();\n\t\tthis._resizeObserver = undefined;\n\t}\n\n\toverride updated(changedProperties: PropertyValues): void {\n\t\tsuper.updated(changedProperties);\n\t\tif (changedProperties.has('value')) {\n\t\t\tthis.internals.setFormValue(this.value);\n\t\t}\n\t\t// The inner input applies new constraints and values when the textfield renders.\n\t\tvoid this._field?.updateComplete.then(() => this.updateValidity());\n\t\tconst onlyValueChanged = changedProperties.size === 1 && changedProperties.has('value');\n\t\tif (onlyValueChanged) {\n\t\t\treturn;\n\t\t}\n\t\tthis._alignButtonToInput();\n\t}\n\n\t/** Mirrors the inner input's validity on the host, which is the element the form validates. */\n\toverride updateValidity(): void {\n\t\tconst field = this._field;\n\t\tconst control = field?.control;\n\t\tif (!field || !control) {\n\t\t\treturn;\n\t\t}\n\t\tfield.setCustomValidity(this._customValidityMessage);\n\t\tthis.internals.setValidity(control.validity, control.validationMessage, control);\n\t}\n\n\tget validity(): ValidityState {\n\t\treturn this.internals.validity;\n\t}\n\n\tget validationMessage(): string {\n\t\treturn this.internals.validationMessage;\n\t}\n\n\tget willValidate(): boolean {\n\t\treturn this.internals.willValidate;\n\t}\n\n\tcheckValidity(): boolean {\n\t\treturn this.internals.checkValidity();\n\t}\n\n\treportValidity(): boolean {\n\t\treturn this.internals.reportValidity();\n\t}\n\n\tsetCustomValidity(message: string): void {\n\t\tthis._customValidityMessage = message;\n\t\tthis.updateValidity();\n\t}\n\n\tselect(): void {\n\t\tthis._field?.select();\n\t}\n\n\tget selectionStart(): number | null {\n\t\treturn this._field?.selectionStart ?? null;\n\t}\n\n\tset selectionStart(value: number | null) {\n\t\tif (this._field) {\n\t\t\tthis._field.selectionStart = value;\n\t\t}\n\t}\n\n\tget selectionEnd(): number | null {\n\t\treturn this._field?.selectionEnd ?? null;\n\t}\n\n\tset selectionEnd(value: number | null) {\n\t\tif (this._field) {\n\t\t\tthis._field.selectionEnd = value;\n\t\t}\n\t}\n\n\tsetSelectionRange(start: number, end: number, direction?: 'forward' | 'backward' | 'none'): void {\n\t\tthis._field?.setSelectionRange(start, end, direction);\n\t}\n\n\tformResetCallback(): void {\n\t\tthis.value = this._defaultValue;\n\t}\n\n\tformStateRestoreCallback(state: string | File | FormData | null): void {\n\t\tif (typeof state === 'string') {\n\t\t\tthis.value = state;\n\t\t}\n\t}\n\n\t/**\n\t * Keeps the button aligned with the input row regardless of a stacked label,\n\t * help text (including when it wraps) or an error message below the input, by\n\t * shifting the button down by the input's offset within the field.\n\t */\n\tprivate async _alignButtonToInput(): Promise<void> {\n\t\tconst field = this._field;\n\t\tconst buttonCol = this._buttonCol;\n\t\tif (!field || !buttonCol) {\n\t\t\treturn;\n\t\t}\n\n\t\tawait field.updateComplete;\n\n\t\tconst input = field.control;\n\t\tif (!input) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst offset = input.getBoundingClientRect().top - field.getBoundingClientRect().top;\n\t\tbuttonCol.style.marginBlockStart = offset > 0 ? `${offset}px` : '';\n\t}\n\n\t/** Emits `search` and, unless it is cancelled, submits the surrounding form. */\n\tprivate _submit(): void {\n\t\tif (this.disabled) {\n\t\t\treturn;\n\t\t}\n\t\t// Like a form's `submit` event, `search` only fires for a valid field. `novalidate` opts out, as for the form.\n\t\tif (!this.form?.noValidate && !this.reportValidity()) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst shouldContinue = this.dispatchSheriffEvent<SDSSearchDetail>('search', { value: this.value });\n\t\tif (shouldContinue) {\n\t\t\tthis.form?.requestSubmit();\n\t\t}\n\t}\n\n\t/** Whether `node` is the host, its light DOM content or part of its shadow tree. */\n\tprivate _isOwnNode(node: EventTarget | null): boolean {\n\t\treturn node instanceof Node && (node === this || this.contains(node) || Boolean(this.shadowRoot?.contains(node)));\n\t}\n\n\t// The browser does not dispatch focusin/focusout on the host\n\t// when focus moves within the shadow tree.\n\t// `relatedTarget` is set to the host when it moves to/from slotted content.\n\tprivate readonly _handleFocusIn = (event: FocusEvent) => {\n\t\tif (!this._isOwnNode(event.relatedTarget)) {\n\t\t\tthis.dispatchEvent(new FocusEvent('focus', { composed: true, relatedTarget: event.relatedTarget }));\n\t\t}\n\t};\n\n\tprivate readonly _handleFocusOut = (event: FocusEvent) => {\n\t\tif (!this._isOwnNode(event.relatedTarget)) {\n\t\t\tthis.dispatchEvent(new FocusEvent('blur', { composed: true, relatedTarget: event.relatedTarget }));\n\t\t}\n\t};\n\n\t/** Stops `focus`/`blur` from the inner controls, both synthetic and native. The host emits its own. */\n\tprivate readonly _stopChildEvent = (event: Event) => {\n\t\tevent.stopImmediatePropagation();\n\t};\n\n\tprivate readonly _reemitChildEvent = (event: Event) => {\n\t\tevent.stopImmediatePropagation();\n\t\tthis.dispatchSheriffEvent(event.type);\n\t};\n\n\tprivate readonly _handleInput = (event: Event) => {\n\t\tevent.stopImmediatePropagation();\n\t\t// Synced before re-emitting so `event.target.value` is current in listeners, like native `input`.\n\t\tconst target = event.target;\n\t\tif (!!target && 'value' in target && typeof target.value === 'string') {\n\t\t\tthis.value = target.value;\n\t\t} else {\n\t\t\tthis.value = '';\n\t\t}\n\t\tthis.updateValidity();\n\t\tthis.dispatchSheriffEvent('input');\n\t};\n\n\tprivate readonly _handleButtonClick = () => {\n\t\tthis._submit();\n\t};\n\n\tprivate readonly _handleKeydown = (event: KeyboardEvent) => {\n\t\tevent.stopImmediatePropagation();\n\t\t// Cancelling the re-emitted event also cancels the textfield's, so neither submits.\n\t\tif (!this.dispatchKeyboardEvent('keydown', event)) {\n\t\t\tevent.preventDefault();\n\t\t\treturn;\n\t\t}\n\t\t// Enter that confirms an IME composition is not a submit, matching native implicit submission.\n\t\tif (event.key !== 'Enter' || event.isComposing) {\n\t\t\treturn;\n\t\t}\n\t\t// Suppress the textfield's own Enter handling so `search` fires once.\n\t\tevent.preventDefault();\n\t\tthis._submit();\n\t};\n\n\tprivate _renderField() {\n\t\treturn html`\n\t\t\t<sds-textfield\n\t\t\t\tclass=\"sds-search__field\"\n\t\t\t\ttype=\"search\"\n\t\t\t\tsize=\"${this.size ?? 'md'}\"\n\t\t\t\t.value=\"${this.value}\"\n\t\t\t\t?hide-label=\"${this.hideLabel}\"\n\t\t\t\tplaceholder=\"${ifDefined(this.placeholder)}\"\n\t\t\t\thelp-text=\"${ifDefined(this.helpText)}\"\n\t\t\t\terror-message=\"${ifDefined(this.errorMessage)}\"\n\t\t\t\t?disabled=\"${this.disabled}\"\n\t\t\t\t?readonly=\"${this.readOnly}\"\n\t\t\t\tautocomplete=\"${ifDefined(this.autocomplete)}\"\n\t\t\t\t?required=\"${this.required}\"\n\t\t\t\tminlength=\"${ifDefined(this.minlength)}\"\n\t\t\t\tmaxlength=\"${ifDefined(this.maxlength)}\"\n\t\t\t\tpattern=\"${ifDefined(this.pattern)}\"\n\t\t\t\t@input=\"${this._handleInput}\"\n\t\t\t\t@change=\"${this._reemitChildEvent}\"\n\t\t\t\t@select=\"${this._reemitChildEvent}\"\n\t\t\t\t@keydown=\"${this._handleKeydown}\"\n\t\t\t\t@focus=\"${this._stopChildEvent}\"\n\t\t\t\t@blur=\"${this._stopChildEvent}\"\n\t\t\t>\n\t\t\t\t<slot name=\"label\" slot=\"label\">${this.label}</slot>\n\t\t\t</sds-textfield>\n\t\t`;\n\t}\n\n\tprivate _renderButtonColumn() {\n\t\treturn html`\n\t\t\t<div class=\"sds-search__button-col\">\n\t\t\t\t<slot name=\"button\">\n\t\t\t\t\t<sds-button\n\t\t\t\t\t\tclass=\"sds-search__button\"\n\t\t\t\t\t\ticon\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tsize=\"${this.size ?? 'md'}\"\n\t\t\t\t\t\tvariant=\"${this.buttonVariant}\"\n\t\t\t\t\t\tlabel=\"${this.buttonLabel}\"\n\t\t\t\t\t\t?disabled=\"${this.disabled}\"\n\t\t\t\t\t\t@click=\"${this._handleButtonClick}\"\n\t\t\t\t\t\t@focus=\"${this._stopChildEvent}\"\n\t\t\t\t\t\t@blur=\"${this._stopChildEvent}\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<sds-icon name=\"search-material-outlined\" size=\"${this.size}\"></sds-icon>\n\t\t\t\t\t</sds-button>\n\t\t\t\t</slot>\n\t\t\t</div>\n\t\t`;\n\t}\n\n\toverride render() {\n\t\treturn html`<div class=\"sds-search\">${this._renderField()} ${this._renderButtonColumn()}</div>`;\n\t}\n}\n"]}

package/dist/sds-search/sds-search.d.ts

@@ -0,0 +1,13 @@
+import { SDSSearchComponent } from './sds-search.component';
+import '../sds-textfield/sds-textfield';
+import '../sds-button/sds-button';
+import '../sds-icon/sds-icon';
+export type { SDSSearchProps, SDSSearchDetail } from './sds-search.component';
+export declare class SDSSearch extends SDSSearchComponent {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sds-search': SDSSearch;
+    }
+}
+//# sourceMappingURL=sds-search.d.ts.map

package/dist/sds-search/sds-search.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sds-search.d.ts","sourceRoot":"","sources":["../../src/sds-search/sds-search.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAE5D,OAAO,gCAAgC,CAAC;AACxC,OAAO,0BAA0B,CAAC;AAClC,OAAO,sBAAsB,CAAC;AAE9B,YAAY,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AAE9E,qBACa,SAAU,SAAQ,kBAAkB;CAAG;AAEpD,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,YAAY,EAAE,SAAS,CAAC;KACxB;CACD"}

package/dist/sds-search/sds-search.js

@@ -0,0 +1,18 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { guardedCustomElement } from '../utils/guarded-custom-element';
+import { SDSSearchComponent } from './sds-search.component';
+import '../sds-textfield/sds-textfield';
+import '../sds-button/sds-button';
+import '../sds-icon/sds-icon';
+let SDSSearch = class SDSSearch extends SDSSearchComponent {
+};
+SDSSearch = __decorate([
+    guardedCustomElement('sds-search')
+], SDSSearch);
+export { SDSSearch };
+//# sourceMappingURL=sds-search.js.map

package/dist/sds-search/sds-search.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sds-search.js","sourceRoot":"","sources":["../../src/sds-search/sds-search.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAE5D,OAAO,gCAAgC,CAAC;AACxC,OAAO,0BAA0B,CAAC;AAClC,OAAO,sBAAsB,CAAC;AAKvB,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,kBAAkB;CAAG,CAAA;AAAvC,SAAS;IADrB,oBAAoB,CAAC,YAAY,CAAC;GACtB,SAAS,CAA8B","sourcesContent":["import { guardedCustomElement } from '../utils/guarded-custom-element';\nimport { SDSSearchComponent } from './sds-search.component';\n\nimport '../sds-textfield/sds-textfield';\nimport '../sds-button/sds-button';\nimport '../sds-icon/sds-icon';\n\nexport type { SDSSearchProps, SDSSearchDetail } from './sds-search.component';\n\n@guardedCustomElement('sds-search')\nexport class SDSSearch extends SDSSearchComponent {}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-search': SDSSearch;\n\t}\n}\n"]}

package/dist/sds-search/sds-search.styles.d.ts

@@ -0,0 +1,2 @@
+export declare const styles: import("lit").CSSResult;
+//# sourceMappingURL=sds-search.styles.d.ts.map

package/dist/sds-search/sds-search.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sds-search.styles.d.ts","sourceRoot":"","sources":["../../src/sds-search/sds-search.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAuElB,CAAC"}

package/dist/sds-search/sds-search.styles.js

@@ -0,0 +1,74 @@
+import { css } from 'lit';
+export const styles = css `
+	/*
+	 * The search controls radius and border of inner button and textfield.
+	 */
+	:host {
+		--_sds-search-radius: var(--sds-search-radius, var(--sds-radius-sm));
+		--_sds-search-border-width: var(--sds-search-border-width, var(--sds-border-sm));
+
+		display: block;
+		text-align: start;
+	}
+
+	.sds-search {
+		display: flex;
+		/* Align to the top; the button is nudged down to the input row in JS so a
+		   stacked label, help text, or an error message never drags it out of line. */
+		align-items: flex-start;
+		inline-size: 100%;
+	}
+
+	/*
+	 * The field keeps its rounded corners on the inline-start side and squares the
+	 * edge that meets the button; the button mirrors it.
+	 */
+	.sds-search__field {
+		flex: 1 1 auto;
+		/* Allow the field to shrink below its intrinsic min-width inside flex. */
+		min-inline-size: 0;
+		/* Let the surrounding container govern the width instead of the
+		   textfield's default 60ch cap. */
+		--sds-textfield-input-max-width: none;
+		--sds-textfield-border-width: var(--_sds-search-border-width);
+		--sds-textfield-border-radius: var(--_sds-search-radius) 0 0 var(--_sds-search-radius);
+	}
+
+	.sds-search__button,
+	::slotted([slot='button']) {
+		--sds-button-border-width: var(--_sds-search-border-width);
+		--sds-button-radius: 0 var(--_sds-search-radius) var(--_sds-search-radius) 0;
+	}
+
+	.sds-search__button-col {
+		display: flex;
+		flex-direction: column;
+		/* Keep the button at its intrinsic size instead of stretching it. */
+		align-items: flex-start;
+		flex: 0 0 auto;
+		/* Overlap the borders so the field and button share a single border. */
+		margin-inline-start: calc(-1 * var(--_sds-search-border-width));
+	}
+
+	/* Raise whichever control is focused so its focus outline is painted on
+	   top of the neighbouring control and never clipped by it. */
+	.sds-search__field:focus-within,
+	.sds-search__button-col:focus-within {
+		position: relative;
+		z-index: 1;
+	}
+
+	/*
+	 * border-radius is physical, so mirror the rounded corners for RTL. Logical
+	 * layout (DOM order, logical margins) already flips on its own.
+	 */
+	:host(:dir(rtl)) .sds-search__field {
+		--sds-textfield-border-radius: 0 var(--_sds-search-radius) var(--_sds-search-radius) 0;
+	}
+
+	:host(:dir(rtl)) .sds-search__button,
+	:host(:dir(rtl)) ::slotted([slot='button']) {
+		--sds-button-radius: var(--_sds-search-radius) 0 0 var(--_sds-search-radius);
+	}
+`;
+//# sourceMappingURL=sds-search.styles.js.map

package/dist/sds-search/sds-search.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sds-search.styles.js","sourceRoot":"","sources":["../../src/sds-search/sds-search.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuExB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`\n\t/*\n\t * The search controls radius and border of inner button and textfield.\n\t */\n\t:host {\n\t\t--_sds-search-radius: var(--sds-search-radius, var(--sds-radius-sm));\n\t\t--_sds-search-border-width: var(--sds-search-border-width, var(--sds-border-sm));\n\n\t\tdisplay: block;\n\t\ttext-align: start;\n\t}\n\n\t.sds-search {\n\t\tdisplay: flex;\n\t\t/* Align to the top; the button is nudged down to the input row in JS so a\n\t\t   stacked label, help text, or an error message never drags it out of line. */\n\t\talign-items: flex-start;\n\t\tinline-size: 100%;\n\t}\n\n\t/*\n\t * The field keeps its rounded corners on the inline-start side and squares the\n\t * edge that meets the button; the button mirrors it.\n\t */\n\t.sds-search__field {\n\t\tflex: 1 1 auto;\n\t\t/* Allow the field to shrink below its intrinsic min-width inside flex. */\n\t\tmin-inline-size: 0;\n\t\t/* Let the surrounding container govern the width instead of the\n\t\t   textfield's default 60ch cap. */\n\t\t--sds-textfield-input-max-width: none;\n\t\t--sds-textfield-border-width: var(--_sds-search-border-width);\n\t\t--sds-textfield-border-radius: var(--_sds-search-radius) 0 0 var(--_sds-search-radius);\n\t}\n\n\t.sds-search__button,\n\t::slotted([slot='button']) {\n\t\t--sds-button-border-width: var(--_sds-search-border-width);\n\t\t--sds-button-radius: 0 var(--_sds-search-radius) var(--_sds-search-radius) 0;\n\t}\n\n\t.sds-search__button-col {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\t/* Keep the button at its intrinsic size instead of stretching it. */\n\t\talign-items: flex-start;\n\t\tflex: 0 0 auto;\n\t\t/* Overlap the borders so the field and button share a single border. */\n\t\tmargin-inline-start: calc(-1 * var(--_sds-search-border-width));\n\t}\n\n\t/* Raise whichever control is focused so its focus outline is painted on\n\t   top of the neighbouring control and never clipped by it. */\n\t.sds-search__field:focus-within,\n\t.sds-search__button-col:focus-within {\n\t\tposition: relative;\n\t\tz-index: 1;\n\t}\n\n\t/*\n\t * border-radius is physical, so mirror the rounded corners for RTL. Logical\n\t * layout (DOM order, logical margins) already flips on its own.\n\t */\n\t:host(:dir(rtl)) .sds-search__field {\n\t\t--sds-textfield-border-radius: 0 var(--_sds-search-radius) var(--_sds-search-radius) 0;\n\t}\n\n\t:host(:dir(rtl)) .sds-search__button,\n\t:host(:dir(rtl)) ::slotted([slot='button']) {\n\t\t--sds-button-radius: var(--_sds-search-radius) 0 0 var(--_sds-search-radius);\n\t}\n`;\n"]}

package/dist/sds-textfield/sds-textfield.component.d.ts

@@ -8,6 +8,7 @@ export interface SDSTextFieldProps extends SDSFormControlAttributes {
     autocomplete?: AutocompleteTypes;
     'error-message'?: string;
     'help-text'?: string;
+    'hide-label'?: boolean;
     label?: string;
     maxlength?: number;
     minlength?: number;
@@ -26,6 +27,8 @@ export declare class SDSTextFieldComponent extends SDSTextFieldComponent_base {
     type: SDSTextFieldProps['type'];
     value?: SDSTextFieldProps['value'];
     label?: SDSTextFieldProps['label'];
+    /** Hides the label visually while keeping it as the input's accessible name. */
+    hideLabel: SDSTextFieldProps['hide-label'];
     placeholder?: SDSTextFieldProps['placeholder'];
     helpText?: SDSTextFieldProps['help-text'];
     errorMessage?: SDSTextFieldProps['error-message'];
@@ -38,7 +41,7 @@ export declare class SDSTextFieldComponent extends SDSTextFieldComponent_base {
     max?: SDSTextFieldProps['max'];
     size: SDSTextFieldProps['size'];
     private hasIcon;
-    /** Tracks whether the `label` slot has assigned content. */
+    /** Tracks whether the `label` slot renders any content, including content forwarded through another slot. */
     private _hasSlottedLabel;
     control: HTMLInputElement;
     private _defaultValue;

package/dist/sds-textfield/sds-textfield.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sds-textfield.component.d.ts","sourceRoot":"","sources":["../../src/sds-textfield/sds-textfield.component.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"sds-textfield.component.d.ts","sourceRoot":"","sources":["../../src/sds-textfield/sds-textfield.component.ts"],"names":[],"mappings":"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"}

package/dist/sds-textfield/sds-textfield.component.js

@@ -9,25 +9,31 @@ import { SDSElement } from '../utils/sds-element';
 import { property, query, state } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
 import { ifDefined } from 'lit/directives/if-defined.js';
+import { live } from 'lit/directives/live.js';
 import { SDSEventDispatcherMixin, SDSDelegateInteractionMixin, SDSFormControlMixin } from '../mixins';
 import { styles } from './sds-textfield.styles';
 export class SDSTextFieldComponent extends SDSDelegateInteractionMixin(SDSEventDispatcherMixin(SDSFormControlMixin(SDSElement))) {
     constructor() {
         super(...arguments);
         this.type = 'text';
+        /** Hides the label visually while keeping it as the input's accessible name. */
+        this.hideLabel = false;
         this.required = false;
         this.size = 'md';
         // State
         this.hasIcon = false;
-        /** Tracks whether the `label` slot has assigned content. */
+        /** Tracks whether the `label` slot renders any content, including content forwarded through another slot. */
         this._hasSlottedLabel = false;
         this._defaultValue = null;
         this.handleSlotChange = (e) => {
             const slot = e.target;
             this.hasIcon = slot.assignedNodes({ flatten: true }).length > 0;
         };
+        // Flattened, so a slot forwarded from a wrapping component (like sds-search) counts by what it renders,
+        // not as content in itself. `currentTarget`, because slotchange from a forwarded slot bubbles to this one.
         this._handleLabelSlotChange = (e) => {
-            this._hasSlottedLabel = e.target.assignedNodes().length > 0;
+            const slot = e.currentTarget;
+            this._hasSlottedLabel = slot.assignedNodes({ flatten: true }).some((node) => node.nodeType === Node.ELEMENT_NODE || Boolean(node.textContent?.trim()));
         };
         this._handleInputChange = (event) => {
             event.stopImmediatePropagation();
@@ -87,7 +93,9 @@ export class SDSTextFieldComponent extends SDSDelegateInteractionMixin(SDSEventD
         super.updated(changedProperties);
         if (changedProperties.has('value')) {
             this.internals.setFormValue(this.value ?? '');
-            if (this.control) {
+            // Writing the value the user just typed back to the input counts as a script change and
+            // clears its user-edit flag, which turns off the minlength/maxlength checks.
+            if (this.control && this.control.value !== (this.value ?? '')) {
                 this.control.value = this.value ?? '';
             }
         }
@@ -153,9 +161,13 @@ export class SDSTextFieldComponent extends SDSDelegateInteractionMixin(SDSEventD
         };
         const describedBy = [this.errorMessage ? 'error-message' : null, this.helpText ? 'help-text' : null].filter(Boolean).join(' ') || undefined;
         const showLabel = this._hasSlottedLabel || Boolean(this.label);
+        const labelClasses = {
+            'sds-textfield__label': true,
+            'sds-textfield__label--hidden': Boolean(this.hideLabel),
+        };
         return html `
 			<div class="${classMap(textfieldClasses)}">
-				<label for="sds-textfield" class="sds-textfield__label" ?hidden="${!showLabel}">
+				<label for="sds-textfield" class="${classMap(labelClasses)}" ?hidden="${!showLabel}">
 					${this.readOnly ? html `<sds-icon name="lock-material-filled" size="m"></sds-icon>` : nothing}
 					<slot name="label" @slotchange="${this._handleLabelSlotChange}">${this.label}</slot>
 				</label>
@@ -169,7 +181,7 @@ export class SDSTextFieldComponent extends SDSDelegateInteractionMixin(SDSEventD
 						?disabled="${this.disabled}"
 						?readonly="${this.readOnly}"
 						placeholder="${ifDefined(this.placeholder)}"
-						.value="${this.value ?? ''}"
+						.value="${live(this.value ?? '')}"
 						name="${ifDefined(this.name)}"
 						autocomplete="${ifDefined(this.autocomplete)}"
 						?required="${this.required}"
@@ -205,6 +217,9 @@ __decorate([
 __decorate([
     property({ type: String, reflect: true })
 ], SDSTextFieldComponent.prototype, "label", void 0);
+__decorate([
+    property({ type: Boolean, attribute: 'hide-label', reflect: true })
+], SDSTextFieldComponent.prototype, "hideLabel", void 0);
 __decorate([
     property({ type: String, reflect: true })
 ], SDSTextFieldComponent.prototype, "placeholder", void 0);

package/dist/sds-textfield/sds-textfield.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"sds-textfield.component.js","sourceRoot":"","sources":["../../src/sds-textfield/sds-textfield.component.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, nothing } from 'lit';\nimport { SDSElement } from '../utils/sds-element';\nimport { property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { SDSEventDispatcherMixin, SDSDelegateInteractionMixin, SDSFormControlMixin } from '../mixins';\nimport type { SDSFormControlAttributes } from '../mixins/sds-form-control-mixin';\nimport { styles } from './sds-textfield.styles';\nimport { SDS_SIZES } from '../types';\n\ntype InputType =\n\t| 'hidden'\n\t| 'text'\n\t| 'search'\n\t| 'tel'\n\t| 'url'\n\t| 'email'\n\t| 'password'\n\t| 'datetime'\n\t| 'date'\n\t| 'month'\n\t| 'week'\n\t| 'time'\n\t| 'datetime-local'\n\t| 'number'\n\t| 'range'\n\t| 'color'\n\t| 'checkbox'\n\t| 'radio'\n\t| 'file'\n\t| 'submit'\n\t| 'image'\n\t| 'reset'\n\t| 'button';\n\ntype InputSize = Extract<SDS_SIZES, 'lg' | 'md' | 'sm'>;\nexport type AutocompleteTypes =\n\t| 'off'\n\t| 'on'\n\t| 'name'\n\t| 'honorific-prefix'\n\t| 'given-name'\n\t| 'additional-name'\n\t| 'family-name'\n\t| 'honorific-suffix'\n\t| 'nickname'\n\t| 'email'\n\t| 'username'\n\t| 'new-password'\n\t| 'current-password'\n\t| 'one-time-code'\n\t| 'organization-title'\n\t| 'organization'\n\t| 'street-address'\n\t| 'address-line1'\n\t| 'address-line2'\n\t| 'address-line3'\n\t| 'address-level4'\n\t| 'address-level3'\n\t| 'address-level2'\n\t| 'address-level1'\n\t| 'country'\n\t| 'country-name'\n\t| 'postal-code'\n\t| 'cc-name'\n\t| 'cc-given-name'\n\t| 'cc-additional-name'\n\t| 'cc-family-name'\n\t| 'cc-number'\n\t| 'cc-exp'\n\t| 'cc-exp-month'\n\t| 'cc-exp-year'\n\t| 'cc-csc'\n\t| 'cc-type'\n\t| 'transaction-currency'\n\t| 'transaction-amount'\n\t| 'language'\n\t| 'bday'\n\t| 'bday-day'\n\t| 'bday-month'\n\t| 'bday-year'\n\t| 'sex'\n\t| 'tel'\n\t| 'tel-country-code'\n\t| 'tel-national'\n\t| 'tel-area-code'\n\t| 'tel-local'\n\t| 'tel-extension'\n\t| 'impp'\n\t| 'url'\n\t| 'photo';\n\nexport interface SDSTextFieldProps extends SDSFormControlAttributes {\n\tautocomplete?: AutocompleteTypes;\n\t'error-message'?: string;\n\t'help-text'?: string;\n\tlabel?: string;\n\tmaxlength?: number;\n\tminlength?: number;\n\tmin?: number | string;\n\tmax?: number | string;\n\tpattern?: string;\n\tplaceholder?: string;\n\trequired?: boolean;\n\tsize?: InputSize;\n\ttype?: InputType;\n\tvalue?: string;\n}\n\nexport class SDSTextFieldComponent extends SDSDelegateInteractionMixin(SDSEventDispatcherMixin(SDSFormControlMixin(SDSElement))) {\n\t// Styling\n\tstatic override styles = [styles];\n\n\t@property({ type: String, reflect: true }) type: SDSTextFieldProps['type'] = 'text';\n\t@property({ type: String }) value?: SDSTextFieldProps['value'];\n\t@property({ type: String, reflect: true }) label?: SDSTextFieldProps['label'];\n\t@property({ type: String, reflect: true }) placeholder?: SDSTextFieldProps['placeholder'];\n\t@property({ type: String, attribute: 'help-text', reflect: true }) helpText?: SDSTextFieldProps['help-text'];\n\t@property({ type: String, attribute: 'error-message', reflect: true }) errorMessage?: SDSTextFieldProps['error-message'];\n\t@property({ type: String, reflect: true }) autocomplete?: SDSTextFieldProps['autocomplete'];\n\t@property({ type: Boolean, reflect: true }) required: SDSTextFieldProps['required'] = false;\n\t@property({ type: String, reflect: true }) pattern?: SDSTextFieldProps['pattern'];\n\t@property({ type: Number, reflect: true }) minlength?: SDSTextFieldProps['minlength'];\n\t@property({ type: Number, reflect: true }) maxlength?: SDSTextFieldProps['maxlength'];\n\t@property({ type: String, reflect: true }) min?: SDSTextFieldProps['min'];\n\t@property({ type: String, reflect: true }) max?: SDSTextFieldProps['max'];\n\t@property({ type: String, reflect: true }) size: SDSTextFieldProps['size'] = 'md';\n\n\t// State\n\t@state() private hasIcon = false;\n\t/** Tracks whether the `label` slot has assigned content. */\n\t@state() private _hasSlottedLabel = false;\n\n\t@query('#sds-textfield') control!: HTMLInputElement;\n\n\tprivate _defaultValue: string | null = null;\n\n\toverride connectedCallback() {\n\t\tsuper.connectedCallback();\n\t\tthis._defaultValue = this.value ?? null;\n\t\tthis.internals.setFormValue(this._defaultValue);\n\t}\n\n\toverride updated(changedProperties: Map<string | number | symbol, unknown>) {\n\t\tsuper.updated(changedProperties);\n\n\t\tif (changedProperties.has('value')) {\n\t\t\tthis.internals.setFormValue(this.value ?? '');\n\n\t\t\tif (this.control) {\n\t\t\t\tthis.control.value = this.value ?? '';\n\t\t\t}\n\t\t}\n\t}\n\n\tprivate readonly handleSlotChange = (e: Event) => {\n\t\tconst slot = e.target as HTMLSlotElement;\n\t\tthis.hasIcon = slot.assignedNodes({ flatten: true }).length > 0;\n\t};\n\n\tprivate readonly _handleLabelSlotChange = (e: Event) => {\n\t\tthis._hasSlottedLabel = (e.target as HTMLSlotElement).assignedNodes().length > 0;\n\t};\n\n\toverride updateValidity() {\n\t\tif (!this.control) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this.control.checkValidity()) {\n\t\t\tthis.internals.setValidity({});\n\t\t} else {\n\t\t\tthis.internals.setValidity({ customError: true }, this.control.validationMessage, this.control);\n\t\t}\n\t}\n\n\tprivate readonly _handleInputChange = (event: InputEvent) => {\n\t\tevent.stopImmediatePropagation();\n\t\tif (this.disabled || !(event.target instanceof HTMLInputElement)) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.value = event.target.value;\n\t\tthis.internals.setFormValue(this.value === '' ? null : this.value);\n\t\tthis.updateValidity();\n\t\tthis.dispatchSheriffEvent(event.type);\n\t};\n\n\tprivate readonly _handleSelect = (event: Event) => {\n\t\tevent.stopImmediatePropagation();\n\t\tif (!this.disabled) {\n\t\t\tthis.dispatchSheriffEvent('select');\n\t\t}\n\t};\n\n\tprivate readonly _handleFocus = (event: FocusEvent) => {\n\t\tevent.stopImmediatePropagation();\n\t\tthis.dispatchSheriffEvent('focus');\n\t};\n\n\tprivate readonly _handleBlur = (event: FocusEvent) => {\n\t\tevent.stopImmediatePropagation();\n\t\tthis.updateValidity();\n\t\tthis.dispatchSheriffEvent('blur');\n\t};\n\n\tprivate readonly _handleKeyDown = (event: KeyboardEvent) => {\n\t\tevent.stopImmediatePropagation();\n\n\t\tconst shouldContinue = this.dispatchKeyboardEvent('keydown', event);\n\t\tif (!shouldContinue) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (event.key !== 'Enter') {\n\t\t\treturn;\n\t\t}\n\n\t\tfor (const element of Array.from(this.form?.elements ?? [])) {\n\t\t\tif (element instanceof HTMLButtonElement || element instanceof HTMLInputElement) {\n\t\t\t\tif (element.type !== 'submit') {\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\n\t\t\t\tif (element.disabled) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\telement.click();\n\t\t\t\treturn;\n\t\t\t}\n\t\t}\n\n\t\tthis.form?.requestSubmit();\n\t};\n\n\tformResetCallback() {\n\t\tthis.internals.setFormValue(this._defaultValue);\n\n\t\tconst newValue = this._defaultValue ?? '';\n\t\tthis.control.value = newValue;\n\t\tthis.value = newValue;\n\t\tthis.updateValidity();\n\t}\n\n\tselect(): void {\n\t\tif (!this.disabled) this.control.select();\n\t}\n\n\tget selectionStart(): number | null {\n\t\treturn this.control ? this.control.selectionStart : null;\n\t}\n\n\tset selectionStart(value: number | null) {\n\t\tif (this.control && value !== null) {\n\t\t\tthis.control.selectionStart = value;\n\t\t}\n\t}\n\n\tget selectionEnd(): number | null {\n\t\treturn this.control ? this.control.selectionEnd : null;\n\t}\n\tset selectionEnd(value: number | null) {\n\t\tif (this.control && value !== null) {\n\t\t\tthis.control.selectionEnd = value;\n\t\t}\n\t}\n\n\tsetSelectionRange(start: number, end: number, direction?: 'forward' | 'backward' | 'none'): void {\n\t\tif (this.control) {\n\t\t\tthis.control.setSelectionRange(start, end, direction);\n\t\t}\n\t}\n\n\tcheckValidity(): boolean {\n\t\treturn this.control.checkValidity();\n\t}\n\n\treportValidity(): boolean {\n\t\treturn this.control.reportValidity();\n\t}\n\n\tsetCustomValidity(message: string): void {\n\t\tthis.control.setCustomValidity(message);\n\t\tthis.updateValidity();\n\t}\n\n\toverride render() {\n\t\tconst textfieldClasses = {\n\t\t\t'sds-textfield': true,\n\t\t\t'sds-textfield--error': Boolean(this.errorMessage),\n\t\t\t'sds-textfield--has-icon': this.hasIcon,\n\t\t};\n\n\t\tconst describedBy = [this.errorMessage ? 'error-message' : null, this.helpText ? 'help-text' : null].filter(Boolean).join(' ') || undefined;\n\n\t\tconst showLabel = this._hasSlottedLabel || Boolean(this.label);\n\n\t\treturn html`\n\t\t\t<div class=\"${classMap(textfieldClasses)}\">\n\t\t\t\t<label for=\"sds-textfield\" class=\"sds-textfield__label\" ?hidden=\"${!showLabel}\">\n\t\t\t\t\t${this.readOnly ? html`<sds-icon name=\"lock-material-filled\" size=\"m\"></sds-icon>` : nothing}\n\t\t\t\t\t<slot name=\"label\" @slotchange=\"${this._handleLabelSlotChange}\">${this.label}</slot>\n\t\t\t\t</label>\n\t\t\t\t${this.helpText ? html`<p id=\"help-text\" class=\"sds-textfield__help-text\">${this.helpText}</p>` : nothing}\n\t\t\t\t<div class=\"sds-textfield__input-container\">\n\t\t\t\t\t<input\n\t\t\t\t\t\tpart=\"input\"\n\t\t\t\t\t\tclass=\"sds-textfield__input\"\n\t\t\t\t\t\ttype=\"${ifDefined(this.type)}\"\n\t\t\t\t\t\tid=\"sds-textfield\"\n\t\t\t\t\t\t?disabled=\"${this.disabled}\"\n\t\t\t\t\t\t?readonly=\"${this.readOnly}\"\n\t\t\t\t\t\tplaceholder=\"${ifDefined(this.placeholder)}\"\n\t\t\t\t\t\t.value=\"${this.value ?? ''}\"\n\t\t\t\t\t\tname=\"${ifDefined(this.name)}\"\n\t\t\t\t\t\tautocomplete=\"${ifDefined(this.autocomplete as any)}\"\n\t\t\t\t\t\t?required=\"${this.required}\"\n\t\t\t\t\t\tpattern=\"${ifDefined(this.pattern)}\"\n\t\t\t\t\t\tmin=\"${ifDefined(this.min)}\"\n\t\t\t\t\t\tminlength=\"${ifDefined(this.minlength)}\"\n\t\t\t\t\t\tmax=\"${ifDefined(this.max)}\"\n\t\t\t\t\t\tmaxlength=\"${ifDefined(this.maxlength)}\"\n\t\t\t\t\t\taria-describedby=\"${ifDefined(describedBy)}\"\n\t\t\t\t\t\taria-invalid=\"${this.errorMessage ? 'true' : 'false'}\"\n\t\t\t\t\t\t@input=\"${this._handleInputChange}\"\n\t\t\t\t\t\t@change=\"${this._handleInputChange}\"\n\t\t\t\t\t\t@select=\"${this._handleSelect}\"\n\t\t\t\t\t\t@focus=\"${this._handleFocus}\"\n\t\t\t\t\t\t@blur=\"${this._handleBlur}\"\n\t\t\t\t\t\t@keydown=\"${this._handleKeyDown}\"\n\t\t\t\t\t/>\n\t\t\t\t\t<slot name=\"after\" @slotchange=\"${this.handleSlotChange}\" aria-hidden=\"true\"></slot>\n\t\t\t\t</div>\n\t\t\t\t${this.errorMessage ? html`<sds-alert id=\"error-message\" variant=\"secondary\" data-palette=\"danger\"><p slot=\"message\">${this.errorMessage}</p></sds-alert>` : nothing}\n\t\t\t</div>\n\t\t`;\n\t}\n}\n"]}
+{"version":3,"file":"sds-textfield.component.js","sourceRoot":"","sources":["../../src/sds-textfield/sds-textfield.component.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, nothing } from 'lit';\nimport { SDSElement } from '../utils/sds-element';\nimport { property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { live } from 'lit/directives/live.js';\nimport { SDSEventDispatcherMixin, SDSDelegateInteractionMixin, SDSFormControlMixin } from '../mixins';\nimport type { SDSFormControlAttributes } from '../mixins/sds-form-control-mixin';\nimport { styles } from './sds-textfield.styles';\nimport { SDS_SIZES } from '../types';\n\ntype InputType =\n\t| 'hidden'\n\t| 'text'\n\t| 'search'\n\t| 'tel'\n\t| 'url'\n\t| 'email'\n\t| 'password'\n\t| 'datetime'\n\t| 'date'\n\t| 'month'\n\t| 'week'\n\t| 'time'\n\t| 'datetime-local'\n\t| 'number'\n\t| 'range'\n\t| 'color'\n\t| 'checkbox'\n\t| 'radio'\n\t| 'file'\n\t| 'submit'\n\t| 'image'\n\t| 'reset'\n\t| 'button';\n\ntype InputSize = Extract<SDS_SIZES, 'lg' | 'md' | 'sm'>;\nexport type AutocompleteTypes =\n\t| 'off'\n\t| 'on'\n\t| 'name'\n\t| 'honorific-prefix'\n\t| 'given-name'\n\t| 'additional-name'\n\t| 'family-name'\n\t| 'honorific-suffix'\n\t| 'nickname'\n\t| 'email'\n\t| 'username'\n\t| 'new-password'\n\t| 'current-password'\n\t| 'one-time-code'\n\t| 'organization-title'\n\t| 'organization'\n\t| 'street-address'\n\t| 'address-line1'\n\t| 'address-line2'\n\t| 'address-line3'\n\t| 'address-level4'\n\t| 'address-level3'\n\t| 'address-level2'\n\t| 'address-level1'\n\t| 'country'\n\t| 'country-name'\n\t| 'postal-code'\n\t| 'cc-name'\n\t| 'cc-given-name'\n\t| 'cc-additional-name'\n\t| 'cc-family-name'\n\t| 'cc-number'\n\t| 'cc-exp'\n\t| 'cc-exp-month'\n\t| 'cc-exp-year'\n\t| 'cc-csc'\n\t| 'cc-type'\n\t| 'transaction-currency'\n\t| 'transaction-amount'\n\t| 'language'\n\t| 'bday'\n\t| 'bday-day'\n\t| 'bday-month'\n\t| 'bday-year'\n\t| 'sex'\n\t| 'tel'\n\t| 'tel-country-code'\n\t| 'tel-national'\n\t| 'tel-area-code'\n\t| 'tel-local'\n\t| 'tel-extension'\n\t| 'impp'\n\t| 'url'\n\t| 'photo';\n\nexport interface SDSTextFieldProps extends SDSFormControlAttributes {\n\tautocomplete?: AutocompleteTypes;\n\t'error-message'?: string;\n\t'help-text'?: string;\n\t'hide-label'?: boolean;\n\tlabel?: string;\n\tmaxlength?: number;\n\tminlength?: number;\n\tmin?: number | string;\n\tmax?: number | string;\n\tpattern?: string;\n\tplaceholder?: string;\n\trequired?: boolean;\n\tsize?: InputSize;\n\ttype?: InputType;\n\tvalue?: string;\n}\n\nexport class SDSTextFieldComponent extends SDSDelegateInteractionMixin(SDSEventDispatcherMixin(SDSFormControlMixin(SDSElement))) {\n\t// Styling\n\tstatic override styles = [styles];\n\n\t@property({ type: String, reflect: true }) type: SDSTextFieldProps['type'] = 'text';\n\t@property({ type: String }) value?: SDSTextFieldProps['value'];\n\t@property({ type: String, reflect: true }) label?: SDSTextFieldProps['label'];\n\t/** Hides the label visually while keeping it as the input's accessible name. */\n\t@property({ type: Boolean, attribute: 'hide-label', reflect: true }) hideLabel: SDSTextFieldProps['hide-label'] = false;\n\t@property({ type: String, reflect: true }) placeholder?: SDSTextFieldProps['placeholder'];\n\t@property({ type: String, attribute: 'help-text', reflect: true }) helpText?: SDSTextFieldProps['help-text'];\n\t@property({ type: String, attribute: 'error-message', reflect: true }) errorMessage?: SDSTextFieldProps['error-message'];\n\t@property({ type: String, reflect: true }) autocomplete?: SDSTextFieldProps['autocomplete'];\n\t@property({ type: Boolean, reflect: true }) required: SDSTextFieldProps['required'] = false;\n\t@property({ type: String, reflect: true }) pattern?: SDSTextFieldProps['pattern'];\n\t@property({ type: Number, reflect: true }) minlength?: SDSTextFieldProps['minlength'];\n\t@property({ type: Number, reflect: true }) maxlength?: SDSTextFieldProps['maxlength'];\n\t@property({ type: String, reflect: true }) min?: SDSTextFieldProps['min'];\n\t@property({ type: String, reflect: true }) max?: SDSTextFieldProps['max'];\n\t@property({ type: String, reflect: true }) size: SDSTextFieldProps['size'] = 'md';\n\n\t// State\n\t@state() private hasIcon = false;\n\t/** Tracks whether the `label` slot renders any content, including content forwarded through another slot. */\n\t@state() private _hasSlottedLabel = false;\n\n\t@query('#sds-textfield') control!: HTMLInputElement;\n\n\tprivate _defaultValue: string | null = null;\n\n\toverride connectedCallback() {\n\t\tsuper.connectedCallback();\n\t\tthis._defaultValue = this.value ?? null;\n\t\tthis.internals.setFormValue(this._defaultValue);\n\t}\n\n\toverride updated(changedProperties: Map<string | number | symbol, unknown>) {\n\t\tsuper.updated(changedProperties);\n\n\t\tif (changedProperties.has('value')) {\n\t\t\tthis.internals.setFormValue(this.value ?? '');\n\n\t\t\t// Writing the value the user just typed back to the input counts as a script change and\n\t\t\t// clears its user-edit flag, which turns off the minlength/maxlength checks.\n\t\t\tif (this.control && this.control.value !== (this.value ?? '')) {\n\t\t\t\tthis.control.value = this.value ?? '';\n\t\t\t}\n\t\t}\n\t}\n\n\tprivate readonly handleSlotChange = (e: Event) => {\n\t\tconst slot = e.target as HTMLSlotElement;\n\t\tthis.hasIcon = slot.assignedNodes({ flatten: true }).length > 0;\n\t};\n\n\t// Flattened, so a slot forwarded from a wrapping component (like sds-search) counts by what it renders,\n\t// not as content in itself. `currentTarget`, because slotchange from a forwarded slot bubbles to this one.\n\tprivate readonly _handleLabelSlotChange = (e: Event) => {\n\t\tconst slot = e.currentTarget as HTMLSlotElement;\n\t\tthis._hasSlottedLabel = slot.assignedNodes({ flatten: true }).some((node) => node.nodeType === Node.ELEMENT_NODE || Boolean(node.textContent?.trim()));\n\t};\n\n\toverride updateValidity() {\n\t\tif (!this.control) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this.control.checkValidity()) {\n\t\t\tthis.internals.setValidity({});\n\t\t} else {\n\t\t\tthis.internals.setValidity({ customError: true }, this.control.validationMessage, this.control);\n\t\t}\n\t}\n\n\tprivate readonly _handleInputChange = (event: InputEvent) => {\n\t\tevent.stopImmediatePropagation();\n\t\tif (this.disabled || !(event.target instanceof HTMLInputElement)) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.value = event.target.value;\n\t\tthis.internals.setFormValue(this.value === '' ? null : this.value);\n\t\tthis.updateValidity();\n\t\tthis.dispatchSheriffEvent(event.type);\n\t};\n\n\tprivate readonly _handleSelect = (event: Event) => {\n\t\tevent.stopImmediatePropagation();\n\t\tif (!this.disabled) {\n\t\t\tthis.dispatchSheriffEvent('select');\n\t\t}\n\t};\n\n\tprivate readonly _handleFocus = (event: FocusEvent) => {\n\t\tevent.stopImmediatePropagation();\n\t\tthis.dispatchSheriffEvent('focus');\n\t};\n\n\tprivate readonly _handleBlur = (event: FocusEvent) => {\n\t\tevent.stopImmediatePropagation();\n\t\tthis.updateValidity();\n\t\tthis.dispatchSheriffEvent('blur');\n\t};\n\n\tprivate readonly _handleKeyDown = (event: KeyboardEvent) => {\n\t\tevent.stopImmediatePropagation();\n\n\t\tconst shouldContinue = this.dispatchKeyboardEvent('keydown', event);\n\t\tif (!shouldContinue) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (event.key !== 'Enter') {\n\t\t\treturn;\n\t\t}\n\n\t\tfor (const element of Array.from(this.form?.elements ?? [])) {\n\t\t\tif (element instanceof HTMLButtonElement || element instanceof HTMLInputElement) {\n\t\t\t\tif (element.type !== 'submit') {\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\n\t\t\t\tif (element.disabled) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\telement.click();\n\t\t\t\treturn;\n\t\t\t}\n\t\t}\n\n\t\tthis.form?.requestSubmit();\n\t};\n\n\tformResetCallback() {\n\t\tthis.internals.setFormValue(this._defaultValue);\n\n\t\tconst newValue = this._defaultValue ?? '';\n\t\tthis.control.value = newValue;\n\t\tthis.value = newValue;\n\t\tthis.updateValidity();\n\t}\n\n\tselect(): void {\n\t\tif (!this.disabled) this.control.select();\n\t}\n\n\tget selectionStart(): number | null {\n\t\treturn this.control ? this.control.selectionStart : null;\n\t}\n\n\tset selectionStart(value: number | null) {\n\t\tif (this.control && value !== null) {\n\t\t\tthis.control.selectionStart = value;\n\t\t}\n\t}\n\n\tget selectionEnd(): number | null {\n\t\treturn this.control ? this.control.selectionEnd : null;\n\t}\n\tset selectionEnd(value: number | null) {\n\t\tif (this.control && value !== null) {\n\t\t\tthis.control.selectionEnd = value;\n\t\t}\n\t}\n\n\tsetSelectionRange(start: number, end: number, direction?: 'forward' | 'backward' | 'none'): void {\n\t\tif (this.control) {\n\t\t\tthis.control.setSelectionRange(start, end, direction);\n\t\t}\n\t}\n\n\tcheckValidity(): boolean {\n\t\treturn this.control.checkValidity();\n\t}\n\n\treportValidity(): boolean {\n\t\treturn this.control.reportValidity();\n\t}\n\n\tsetCustomValidity(message: string): void {\n\t\tthis.control.setCustomValidity(message);\n\t\tthis.updateValidity();\n\t}\n\n\toverride render() {\n\t\tconst textfieldClasses = {\n\t\t\t'sds-textfield': true,\n\t\t\t'sds-textfield--error': Boolean(this.errorMessage),\n\t\t\t'sds-textfield--has-icon': this.hasIcon,\n\t\t};\n\n\t\tconst describedBy = [this.errorMessage ? 'error-message' : null, this.helpText ? 'help-text' : null].filter(Boolean).join(' ') || undefined;\n\n\t\tconst showLabel = this._hasSlottedLabel || Boolean(this.label);\n\t\tconst labelClasses = {\n\t\t\t'sds-textfield__label': true,\n\t\t\t'sds-textfield__label--hidden': Boolean(this.hideLabel),\n\t\t};\n\n\t\treturn html`\n\t\t\t<div class=\"${classMap(textfieldClasses)}\">\n\t\t\t\t<label for=\"sds-textfield\" class=\"${classMap(labelClasses)}\" ?hidden=\"${!showLabel}\">\n\t\t\t\t\t${this.readOnly ? html`<sds-icon name=\"lock-material-filled\" size=\"m\"></sds-icon>` : nothing}\n\t\t\t\t\t<slot name=\"label\" @slotchange=\"${this._handleLabelSlotChange}\">${this.label}</slot>\n\t\t\t\t</label>\n\t\t\t\t${this.helpText ? html`<p id=\"help-text\" class=\"sds-textfield__help-text\">${this.helpText}</p>` : nothing}\n\t\t\t\t<div class=\"sds-textfield__input-container\">\n\t\t\t\t\t<input\n\t\t\t\t\t\tpart=\"input\"\n\t\t\t\t\t\tclass=\"sds-textfield__input\"\n\t\t\t\t\t\ttype=\"${ifDefined(this.type)}\"\n\t\t\t\t\t\tid=\"sds-textfield\"\n\t\t\t\t\t\t?disabled=\"${this.disabled}\"\n\t\t\t\t\t\t?readonly=\"${this.readOnly}\"\n\t\t\t\t\t\tplaceholder=\"${ifDefined(this.placeholder)}\"\n\t\t\t\t\t\t.value=\"${live(this.value ?? '')}\"\n\t\t\t\t\t\tname=\"${ifDefined(this.name)}\"\n\t\t\t\t\t\tautocomplete=\"${ifDefined(this.autocomplete as any)}\"\n\t\t\t\t\t\t?required=\"${this.required}\"\n\t\t\t\t\t\tpattern=\"${ifDefined(this.pattern)}\"\n\t\t\t\t\t\tmin=\"${ifDefined(this.min)}\"\n\t\t\t\t\t\tminlength=\"${ifDefined(this.minlength)}\"\n\t\t\t\t\t\tmax=\"${ifDefined(this.max)}\"\n\t\t\t\t\t\tmaxlength=\"${ifDefined(this.maxlength)}\"\n\t\t\t\t\t\taria-describedby=\"${ifDefined(describedBy)}\"\n\t\t\t\t\t\taria-invalid=\"${this.errorMessage ? 'true' : 'false'}\"\n\t\t\t\t\t\t@input=\"${this._handleInputChange}\"\n\t\t\t\t\t\t@change=\"${this._handleInputChange}\"\n\t\t\t\t\t\t@select=\"${this._handleSelect}\"\n\t\t\t\t\t\t@focus=\"${this._handleFocus}\"\n\t\t\t\t\t\t@blur=\"${this._handleBlur}\"\n\t\t\t\t\t\t@keydown=\"${this._handleKeyDown}\"\n\t\t\t\t\t/>\n\t\t\t\t\t<slot name=\"after\" @slotchange=\"${this.handleSlotChange}\" aria-hidden=\"true\"></slot>\n\t\t\t\t</div>\n\t\t\t\t${this.errorMessage ? html`<sds-alert id=\"error-message\" variant=\"secondary\" data-palette=\"danger\"><p slot=\"message\">${this.errorMessage}</p></sds-alert>` : nothing}\n\t\t\t</div>\n\t\t`;\n\t}\n}\n"]}

package/dist/sds-textfield/sds-textfield.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sds-textfield.styles.d.ts","sourceRoot":"","sources":["../../src/sds-textfield/sds-textfield.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBA4KlB,CAAC"}
+{"version":3,"file":"sds-textfield.styles.d.ts","sourceRoot":"","sources":["../../src/sds-textfield/sds-textfield.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAuLlB,CAAC"}

package/dist/sds-textfield/sds-textfield.styles.js

@@ -98,6 +98,17 @@ export const styles = css `
 			gap: var(--_sds-textfield-gap);
 		}
 
+		/* Visually hidden, but still the input's accessible name. Taking the label out of
+		   the flex flow also drops the gap above the input. */
+		.sds-textfield__label--hidden {
+			clip-path: inset(50%);
+			height: 1px;
+			overflow: hidden;
+			position: absolute;
+			white-space: nowrap;
+			width: 1px;
+		}
+
 		.sds-textfield__help-text {
 			display: block;
 			color: var(--_sds-textfield-helptext-text-color);

package/dist/sds-textfield/sds-textfield.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"sds-textfield.styles.js","sourceRoot":"","sources":["../../src/sds-textfield/sds-textfield.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4KxB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`\n\t:host {\n\t\t--_sds-textfield-background-color: var(--sds-textfield-background-color, var(--sds-color-background-default, var(--sds-color-neutral-background-default)));\n\t\t--_sds-textfield-text-color: var(--sds-textfield-text-color, var(--sds-color-text-default, var(--sds-color-neutral-text-default)));\n\n\t\t--_sds-textfield-border-color: var(--sds-textfield-border-color, var(--sds-color-border-default, var(--sds-color-neutral-border-default)));\n\t\t--_sds-textfield-border-width: var(--sds-textfield-border-width, var(--sds-border-sm));\n\t\t--_sds-textfield-border-radius: var(--sds-textfield-border-radius, var(--sds-radius-sm));\n\n\t\t--_sds-textfield-font-family: var(--sds-textfield-font-family, var(--sds-typography-font-family-roboto));\n\t\t--_sds-textfield-font-size: var(--sds-textfield-font-size, var(--sds-components-font-size-content-md));\n\t\t--_sds-textfield-font-weight: var(--sds-textfield-font-weight, var(--sds-typography-font-weight-regular));\n\t\t--_sds-textfield-line-height: var(--sds-textfield-line-height, var(--sds-components-line-height-squeezed-md));\n\t\t--_sds-textfield-min-height: var(--sds-textfield-height, var(--sds-components-button-md));\n\n\t\t--_sds-textfield-gap: var(--sds-textfield-gap, var(--sds-spacing-3xs));\n\t\t--_sds-textfield-padding-block: var(--sds-textfield-padding-block, 0);\n\t\t--_sds-textfield-padding-inline: var(--sds-textfield-padding-inline, var(--sds-spacing-xs));\n\t\t--_sds-textfield-padding-icon: var(--sds-textfield-padding-icon, calc(var(--sds-spacing-xs) + var(--sds-components-icon-md)));\n\t\t--_sds-textfield-disabled-opacity: var(--sds-textfield-disabled-opacity, var(--sds-color-states-disabled-opacity));\n\t\t--_sds-textfield-max-width: var(--sds-textfield-input-max-width, var(--sds-typography-max-line-width, 60ch));\n\n\t\t--_sds-textfield-label-text-color: var(--sds-textfield-label-text-color, var(--sds-color-text-default, var(--sds-color-neutral-text-default)));\n\t\t--_sds-textfield-label-font-size: var(--sds-textfield-label-font-size, var(--sds-components-font-size-content-md));\n\t\t--_sds-textfield-label-font-weight: var(--sds-textfield-label-font-weight, var(--sds-typography-font-weight-medium));\n\t\t--_sds-textfield-label-line-height: var(--sds-textfield-label-line-height, var(--sds-components-line-height-squeezed-md));\n\n\t\t--_sds-textfield-helptext-text-color: var(--sds-textfield-helptext-text-color, var(--sds-color-text-subtle, var(--sds-color-neutral-text-subtle)));\n\t\t--_sds-textfield-helptext-font-size: var(--sds-textfield-helptext-font-size, var(--sds-components-font-size-content-md));\n\t\t--_sds-textfield-helptext-font-weight: var(--sds-textfield-helptext-font-weight, var(--sds-typography-font-weight-regular));\n\t\t--_sds-textfield-helptext-line-height: var(--sds-textfield-helptext-line-height, var(--sds-components-line-height-squeezed-md));\n\n\t\t--_sds-textfield-focus-color: var(--sds-textfield-focus-color, var(--sds-color-states-focus-outer));\n\t\t--_sds-textfield-focus-inner-color: var(--sds-textfield-focus-inner-color, var(--sds-color-states-focus-inner));\n\t\t--_sds-textfield-focus-spacing: var(--sds-textfield-focus-spacing, var(--sds-color-states-focus-spacing));\n\t\t--_sds-textfield-focus-outline-size: var(--sds-textfield-focus-outline-size, var(--sds-color-states-focus-outline-size));\n\n\t\t--_sds-textfield-cursor: var(--sds-textfield-cursor, auto);\n\n\t\t--_sds-textfield-icon-right: var(--sds-textfield-icon-right, var(--sds-spacing-xs));\n\t\t--_sds-textfield-icon-top: var(--sds-textfield-icon-top, var(--sds-spacing-3xs));\n\n\t\tall: unset;\n\t\tdisplay: block;\n\t\ttext-align: start;\n\t}\n\n\t.sds-textfield {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tgap: var(--_sds-textfield-gap);\n\t\tfont-family: var(--_sds-textfield-font-family);\n\n\t\t.sds-textfield__input-container {\n\t\t\tposition: relative;\n\t\t\tfont-size: var(--_sds-textfield-font-size);\n\t\t\tmax-width: var(--_sds-textfield-max-width);\n\t\t}\n\n\t\t.sds-textfield__input {\n\t\t\tbox-sizing: border-box;\n\t\t\tcolor: var(--_sds-textfield-text-color);\n\t\t\tpadding: var(--_sds-textfield-padding-block) var(--_sds-textfield-padding-inline);\n\t\t\tline-height: var(--_sds-textfield-line-height);\n\t\t\tfont-size: var(--_sds-textfield-font-size);\n\t\t\tfont-weight: var(--_sds-textfield-font-weight);\n\t\t\tfont-family: var(--_sds-textfield-font-family);\n\t\t\tmin-height: var(--_sds-textfield-min-height);\n\t\t\tborder-radius: var(--_sds-textfield-border-radius);\n\t\t\tborder: var(--_sds-textfield-border-width) solid var(--_sds-textfield-border-color);\n\t\t\tbackground: var(--_sds-textfield-background-color);\n\t\t\tcursor: var(--_sds-textfield-cursor);\n\t\t\twidth: 100%;\n\n\t\t\t&:hover {\n\t\t\t\t--_sds-textfield-border-color: var(--sds-textfield-border-color, var(--sds-color-border-strong, var(--sds-color-neutral-border-strong)));\n\t\t\t}\n\n\t\t\t&:focus-visible {\n\t\t\t\tbox-shadow: 0 0 0 var(--_sds-textfield-focus-spacing) var(--_sds-textfield-focus-inner-color);\n\t\t\t\toutline: var(--_sds-textfield-focus-outline-size) solid var(--_sds-textfield-focus-color);\n\t\t\t\toutline-offset: var(--_sds-textfield-focus-spacing);\n\t\t\t}\n\t\t}\n\n\t\t.sds-textfield__label {\n\t\t\tcolor: var(--_sds-textfield-text-color);\n\t\t\tfont-size: var(--_sds-textfield-label-font-size);\n\t\t\tfont-weight: var(--_sds-textfield-label-font-weight);\n\t\t\tline-height: var(--_sds-textfield-label-line-height);\n\t\t}\n\n\t\t.sds-textfield__label:has(sds-icon) {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: row;\n\t\t\talign-items: center;\n\t\t\tgap: var(--_sds-textfield-gap);\n\t\t}\n\n\t\t.sds-textfield__help-text {\n\t\t\tdisplay: block;\n\t\t\tcolor: var(--_sds-textfield-helptext-text-color);\n\t\t\tfont-size: var(--_sds-textfield-helptext-font-size);\n\t\t\tfont-weight: var(--_sds-textfield-helptext-font-weight);\n\t\t\tline-height: var(--_sds-textfield-helptext-line-height);\n\t\t\tmargin: 0;\n\t\t}\n\t}\n\n\t.sds-textfield--error {\n\t\t--_sds-textfield-border-color: var(--sds-textfield-border-color, var(--sds-color-alert-danger-border-default));\n\n\t\t& .sds-textfield__input:hover,\n\t\t& .sds-textfield__input:hover {\n\t\t\t--_sds-textfield-border-color: var(--sds-textfield-border-color, var(--sds-color-alert-danger-border-default));\n\t\t}\n\t}\n\n\t:host([readonly]) {\n\t\t--_sds-textfield-background-color: var(--sds-textfield-background-color, var(--sds-color-surface-tinted, var(--sds-color-neutral-surface-tinted)));\n\t\t--_sds-textfield-cursor: var(--sds-textfield-cursor, default);\n\t}\n\n\t:host(:disabled) {\n\t\topacity: var(--_sds-textfield-disabled-opacity);\n\t\tpointer-events: none;\n\t}\n\n\t.sds-textfield--has-icon {\n\t\t.sds-textfield__input {\n\t\t\tpadding-right: var(--_sds-textfield-padding-icon);\n\t\t}\n\t}\n\n\t::slotted([slot='after']) {\n\t\tposition: absolute;\n\t\ttop: var(--_sds-textfield-icon-top);\n\t\tright: var(--_sds-textfield-icon-right);\n\t\tpointer-events: none;\n\t}\n\n\t:host([size='sm']) {\n\t\t--_sds-textfield-min-height: var(--sds-textfield-height, var(--sds-components-button-sm));\n\t\t--_sds-textfield-font-size: var(--sds-textfield-font-size, var(--sds-components-font-size-content-sm));\n\t\t--_sds-textfield-line-height: var(--sds-textfield-line-height, var(--sds-components-line-height-squeezed-sm));\n\t\t--_sds-textfield-label-font-size: var(--sds-textfield-label-font-size, var(--sds-components-font-size-content-sm));\n\t\t--_sds-textfield-label-line-height: var(--sds-textfield-label-line-height, var(--sds-components-line-height-squeezed-sm));\n\t\t--_sds-textfield-helptext-font-size: var(--sds-textfield-helptext-font-size, var(--sds-components-font-size-content-sm));\n\t\t--_sds-textfield-helptext-line-height: var(--sds-textfield-helptext-line-height, var(--sds-components-line-height-squeezed-sm));\n\t\t--_sds-textfield-icon-top: var(--sds-textfield-icon-top, calc((var(--_sds-textfield-min-height) - var(--sds-components-icon-sm)) / 2));\n\t\t--_sds-textfield-padding-icon: var(--sds-textfield-padding-icon, calc(var(--sds-spacing-xs) + var(--sds-components-icon-sm)));\n\n\t\t&:has(sds-icon:not([size])) {\n\t\t\t--sds-icon-size: var(--sds-textfield-icon-size, var(--sds-components-icon-sm));\n\t\t}\n\t}\n\n\t:host([size='lg']) {\n\t\t--_sds-textfield-min-height: var(--sds-textfield-height, var(--sds-components-button-lg));\n\t\t--_sds-textfield-font-size: var(--sds-textfield-font-size, var(--sds-components-font-size-content-lg));\n\t\t--_sds-textfield-line-height: var(--sds-textfield-line-height, var(--sds-components-line-height-squeezed-lg));\n\t\t--_sds-textfield-label-font-size: var(--sds-textfield-label-font-size, var(--sds-components-font-size-content-lg));\n\t\t--_sds-textfield-label-line-height: var(--sds-textfield-label-line-height, var(--sds-components-line-height-squeezed-lg));\n\t\t--_sds-textfield-helptext-font-size: var(--sds-textfield-helptext-font-size, var(--sds-components-font-size-content-lg));\n\t\t--_sds-textfield-helptext-line-height: var(--sds-textfield-helptext-line-height, var(--sds-components-line-height-squeezed-lg));\n\t\t--_sds-textfield-icon-top: var(--sds-textfield-icon-top, var(--sds-spacing-3xs));\n\t\t--_sds-textfield-padding-icon: var(--sds-textfield-padding-icon, calc(var(--sds-spacing-xs) + var(--sds-components-icon-lg)));\n\n\t\t&:has(sds-icon:not([size])) {\n\t\t\t--sds-icon-size: var(--sds-textfield-icon-size, var(--sds-components-icon-lg));\n\t\t}\n\t}\n`;\n"]}
+{"version":3,"file":"sds-textfield.styles.js","sourceRoot":"","sources":["../../src/sds-textfield/sds-textfield.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuLxB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`\n\t:host {\n\t\t--_sds-textfield-background-color: var(--sds-textfield-background-color, var(--sds-color-background-default, var(--sds-color-neutral-background-default)));\n\t\t--_sds-textfield-text-color: var(--sds-textfield-text-color, var(--sds-color-text-default, var(--sds-color-neutral-text-default)));\n\n\t\t--_sds-textfield-border-color: var(--sds-textfield-border-color, var(--sds-color-border-default, var(--sds-color-neutral-border-default)));\n\t\t--_sds-textfield-border-width: var(--sds-textfield-border-width, var(--sds-border-sm));\n\t\t--_sds-textfield-border-radius: var(--sds-textfield-border-radius, var(--sds-radius-sm));\n\n\t\t--_sds-textfield-font-family: var(--sds-textfield-font-family, var(--sds-typography-font-family-roboto));\n\t\t--_sds-textfield-font-size: var(--sds-textfield-font-size, var(--sds-components-font-size-content-md));\n\t\t--_sds-textfield-font-weight: var(--sds-textfield-font-weight, var(--sds-typography-font-weight-regular));\n\t\t--_sds-textfield-line-height: var(--sds-textfield-line-height, var(--sds-components-line-height-squeezed-md));\n\t\t--_sds-textfield-min-height: var(--sds-textfield-height, var(--sds-components-button-md));\n\n\t\t--_sds-textfield-gap: var(--sds-textfield-gap, var(--sds-spacing-3xs));\n\t\t--_sds-textfield-padding-block: var(--sds-textfield-padding-block, 0);\n\t\t--_sds-textfield-padding-inline: var(--sds-textfield-padding-inline, var(--sds-spacing-xs));\n\t\t--_sds-textfield-padding-icon: var(--sds-textfield-padding-icon, calc(var(--sds-spacing-xs) + var(--sds-components-icon-md)));\n\t\t--_sds-textfield-disabled-opacity: var(--sds-textfield-disabled-opacity, var(--sds-color-states-disabled-opacity));\n\t\t--_sds-textfield-max-width: var(--sds-textfield-input-max-width, var(--sds-typography-max-line-width, 60ch));\n\n\t\t--_sds-textfield-label-text-color: var(--sds-textfield-label-text-color, var(--sds-color-text-default, var(--sds-color-neutral-text-default)));\n\t\t--_sds-textfield-label-font-size: var(--sds-textfield-label-font-size, var(--sds-components-font-size-content-md));\n\t\t--_sds-textfield-label-font-weight: var(--sds-textfield-label-font-weight, var(--sds-typography-font-weight-medium));\n\t\t--_sds-textfield-label-line-height: var(--sds-textfield-label-line-height, var(--sds-components-line-height-squeezed-md));\n\n\t\t--_sds-textfield-helptext-text-color: var(--sds-textfield-helptext-text-color, var(--sds-color-text-subtle, var(--sds-color-neutral-text-subtle)));\n\t\t--_sds-textfield-helptext-font-size: var(--sds-textfield-helptext-font-size, var(--sds-components-font-size-content-md));\n\t\t--_sds-textfield-helptext-font-weight: var(--sds-textfield-helptext-font-weight, var(--sds-typography-font-weight-regular));\n\t\t--_sds-textfield-helptext-line-height: var(--sds-textfield-helptext-line-height, var(--sds-components-line-height-squeezed-md));\n\n\t\t--_sds-textfield-focus-color: var(--sds-textfield-focus-color, var(--sds-color-states-focus-outer));\n\t\t--_sds-textfield-focus-inner-color: var(--sds-textfield-focus-inner-color, var(--sds-color-states-focus-inner));\n\t\t--_sds-textfield-focus-spacing: var(--sds-textfield-focus-spacing, var(--sds-color-states-focus-spacing));\n\t\t--_sds-textfield-focus-outline-size: var(--sds-textfield-focus-outline-size, var(--sds-color-states-focus-outline-size));\n\n\t\t--_sds-textfield-cursor: var(--sds-textfield-cursor, auto);\n\n\t\t--_sds-textfield-icon-right: var(--sds-textfield-icon-right, var(--sds-spacing-xs));\n\t\t--_sds-textfield-icon-top: var(--sds-textfield-icon-top, var(--sds-spacing-3xs));\n\n\t\tall: unset;\n\t\tdisplay: block;\n\t\ttext-align: start;\n\t}\n\n\t.sds-textfield {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tgap: var(--_sds-textfield-gap);\n\t\tfont-family: var(--_sds-textfield-font-family);\n\n\t\t.sds-textfield__input-container {\n\t\t\tposition: relative;\n\t\t\tfont-size: var(--_sds-textfield-font-size);\n\t\t\tmax-width: var(--_sds-textfield-max-width);\n\t\t}\n\n\t\t.sds-textfield__input {\n\t\t\tbox-sizing: border-box;\n\t\t\tcolor: var(--_sds-textfield-text-color);\n\t\t\tpadding: var(--_sds-textfield-padding-block) var(--_sds-textfield-padding-inline);\n\t\t\tline-height: var(--_sds-textfield-line-height);\n\t\t\tfont-size: var(--_sds-textfield-font-size);\n\t\t\tfont-weight: var(--_sds-textfield-font-weight);\n\t\t\tfont-family: var(--_sds-textfield-font-family);\n\t\t\tmin-height: var(--_sds-textfield-min-height);\n\t\t\tborder-radius: var(--_sds-textfield-border-radius);\n\t\t\tborder: var(--_sds-textfield-border-width) solid var(--_sds-textfield-border-color);\n\t\t\tbackground: var(--_sds-textfield-background-color);\n\t\t\tcursor: var(--_sds-textfield-cursor);\n\t\t\twidth: 100%;\n\n\t\t\t&:hover {\n\t\t\t\t--_sds-textfield-border-color: var(--sds-textfield-border-color, var(--sds-color-border-strong, var(--sds-color-neutral-border-strong)));\n\t\t\t}\n\n\t\t\t&:focus-visible {\n\t\t\t\tbox-shadow: 0 0 0 var(--_sds-textfield-focus-spacing) var(--_sds-textfield-focus-inner-color);\n\t\t\t\toutline: var(--_sds-textfield-focus-outline-size) solid var(--_sds-textfield-focus-color);\n\t\t\t\toutline-offset: var(--_sds-textfield-focus-spacing);\n\t\t\t}\n\t\t}\n\n\t\t.sds-textfield__label {\n\t\t\tcolor: var(--_sds-textfield-text-color);\n\t\t\tfont-size: var(--_sds-textfield-label-font-size);\n\t\t\tfont-weight: var(--_sds-textfield-label-font-weight);\n\t\t\tline-height: var(--_sds-textfield-label-line-height);\n\t\t}\n\n\t\t.sds-textfield__label:has(sds-icon) {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: row;\n\t\t\talign-items: center;\n\t\t\tgap: var(--_sds-textfield-gap);\n\t\t}\n\n\t\t/* Visually hidden, but still the input's accessible name. Taking the label out of\n\t\t   the flex flow also drops the gap above the input. */\n\t\t.sds-textfield__label--hidden {\n\t\t\tclip-path: inset(50%);\n\t\t\theight: 1px;\n\t\t\toverflow: hidden;\n\t\t\tposition: absolute;\n\t\t\twhite-space: nowrap;\n\t\t\twidth: 1px;\n\t\t}\n\n\t\t.sds-textfield__help-text {\n\t\t\tdisplay: block;\n\t\t\tcolor: var(--_sds-textfield-helptext-text-color);\n\t\t\tfont-size: var(--_sds-textfield-helptext-font-size);\n\t\t\tfont-weight: var(--_sds-textfield-helptext-font-weight);\n\t\t\tline-height: var(--_sds-textfield-helptext-line-height);\n\t\t\tmargin: 0;\n\t\t}\n\t}\n\n\t.sds-textfield--error {\n\t\t--_sds-textfield-border-color: var(--sds-textfield-border-color, var(--sds-color-alert-danger-border-default));\n\n\t\t& .sds-textfield__input:hover,\n\t\t& .sds-textfield__input:hover {\n\t\t\t--_sds-textfield-border-color: var(--sds-textfield-border-color, var(--sds-color-alert-danger-border-default));\n\t\t}\n\t}\n\n\t:host([readonly]) {\n\t\t--_sds-textfield-background-color: var(--sds-textfield-background-color, var(--sds-color-surface-tinted, var(--sds-color-neutral-surface-tinted)));\n\t\t--_sds-textfield-cursor: var(--sds-textfield-cursor, default);\n\t}\n\n\t:host(:disabled) {\n\t\topacity: var(--_sds-textfield-disabled-opacity);\n\t\tpointer-events: none;\n\t}\n\n\t.sds-textfield--has-icon {\n\t\t.sds-textfield__input {\n\t\t\tpadding-right: var(--_sds-textfield-padding-icon);\n\t\t}\n\t}\n\n\t::slotted([slot='after']) {\n\t\tposition: absolute;\n\t\ttop: var(--_sds-textfield-icon-top);\n\t\tright: var(--_sds-textfield-icon-right);\n\t\tpointer-events: none;\n\t}\n\n\t:host([size='sm']) {\n\t\t--_sds-textfield-min-height: var(--sds-textfield-height, var(--sds-components-button-sm));\n\t\t--_sds-textfield-font-size: var(--sds-textfield-font-size, var(--sds-components-font-size-content-sm));\n\t\t--_sds-textfield-line-height: var(--sds-textfield-line-height, var(--sds-components-line-height-squeezed-sm));\n\t\t--_sds-textfield-label-font-size: var(--sds-textfield-label-font-size, var(--sds-components-font-size-content-sm));\n\t\t--_sds-textfield-label-line-height: var(--sds-textfield-label-line-height, var(--sds-components-line-height-squeezed-sm));\n\t\t--_sds-textfield-helptext-font-size: var(--sds-textfield-helptext-font-size, var(--sds-components-font-size-content-sm));\n\t\t--_sds-textfield-helptext-line-height: var(--sds-textfield-helptext-line-height, var(--sds-components-line-height-squeezed-sm));\n\t\t--_sds-textfield-icon-top: var(--sds-textfield-icon-top, calc((var(--_sds-textfield-min-height) - var(--sds-components-icon-sm)) / 2));\n\t\t--_sds-textfield-padding-icon: var(--sds-textfield-padding-icon, calc(var(--sds-spacing-xs) + var(--sds-components-icon-sm)));\n\n\t\t&:has(sds-icon:not([size])) {\n\t\t\t--sds-icon-size: var(--sds-textfield-icon-size, var(--sds-components-icon-sm));\n\t\t}\n\t}\n\n\t:host([size='lg']) {\n\t\t--_sds-textfield-min-height: var(--sds-textfield-height, var(--sds-components-button-lg));\n\t\t--_sds-textfield-font-size: var(--sds-textfield-font-size, var(--sds-components-font-size-content-lg));\n\t\t--_sds-textfield-line-height: var(--sds-textfield-line-height, var(--sds-components-line-height-squeezed-lg));\n\t\t--_sds-textfield-label-font-size: var(--sds-textfield-label-font-size, var(--sds-components-font-size-content-lg));\n\t\t--_sds-textfield-label-line-height: var(--sds-textfield-label-line-height, var(--sds-components-line-height-squeezed-lg));\n\t\t--_sds-textfield-helptext-font-size: var(--sds-textfield-helptext-font-size, var(--sds-components-font-size-content-lg));\n\t\t--_sds-textfield-helptext-line-height: var(--sds-textfield-helptext-line-height, var(--sds-components-line-height-squeezed-lg));\n\t\t--_sds-textfield-icon-top: var(--sds-textfield-icon-top, var(--sds-spacing-3xs));\n\t\t--_sds-textfield-padding-icon: var(--sds-textfield-padding-icon, calc(var(--sds-spacing-xs) + var(--sds-components-icon-lg)));\n\n\t\t&:has(sds-icon:not([size])) {\n\t\t\t--sds-icon-size: var(--sds-textfield-icon-size, var(--sds-components-icon-lg));\n\t\t}\n\t}\n`;\n"]}