@ds-mo/ui 14.26.0 → 14.27.1

package/dist/components/p-DVLghmNY.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["fieldCss","fieldCounter","tokens","value","split","filter","Boolean","uniqueTokens","groups","Set","flat","Field","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","error","focused","filled","dirty","touched","controlDisabled","controlRequired","generatedId","initialValue","authoredAria","WeakMap","syncControl","control","findControl","readValue","set","labelledby","getAttribute","describedby","isDsControl","tagName","startsWith","inputId","controlId","updateControlAttribute","authored","get","labelId","join","renderedDescription","descriptionId","renderedError","errorId","undefined","length","disabled","isInactive","hasAttribute","required","handleLabelClick","event","preventDefault","setFocus","handleFocusIn","handleFocusOut","relatedTarget","Node","el","contains","handleValueChange","componentDidLoad","requestAnimationFrame","componentDidRender","onFieldContractChange","fieldId","description","errorMessage","Array","isArray","String","name","removeAttribute","setAttribute","controlContainer","querySelector","render","h","Host","key","onFocusin","onFocusout","onInput","onChange","onDsChange","class","as","variant","color","emphasis","for","textId","onClick","label","ref","onSlotchange","role"],"sources":["src/wc/components/Field/Field.css?tag=ds-field&encapsulation=scoped","src/wc/components/Field/Field.tsx"],"sourcesContent":["@import '../../utils/field-stack.css';\n\n:host {\n  display: block;\n}\n\n.field__control {\n  display: flex;\n  min-width: 0;\n}\n\n.field__control > * {\n  width: 100%;\n}\n","import { Component, Element, Prop, State, Watch, h, Host } from '@stencil/core';\n\ninterface FieldControl extends HTMLElement {\n  value?: string | string[];\n  inputId?: string;\n  error?: boolean;\n  disabled?: boolean;\n  isInactive?: boolean;\n  required?: boolean;\n  setFocus?: () => Promise<void> | void;\n}\n\ninterface AuthoredAria {\n  labelledby: string[];\n  describedby: string[];\n}\n\nlet fieldCounter = 0;\n\nconst tokens = (value: string | null | undefined): string[] =>\n  value?.split(/\\s+/).filter(Boolean) ?? [];\n\nconst uniqueTokens = (...groups: string[][]): string[] => [...new Set(groups.flat())];\n\n@Component({\n  tag: 'ds-field',\n  styleUrl: 'Field.css',\n  scoped: true,\n})\nexport class Field {\n  @Element() el!: HTMLElement;\n\n  /** Persistent visible label for the single slotted control. */\n  @Prop() label!: string;\n  /** Explicit ID for the slotted control; generated when omitted. */\n  @Prop() fieldId: string | undefined;\n  /** Optional guidance associated with the slotted control while no visible error is shown. */\n  @Prop() description: string | undefined;\n  /** Invalid visual and accessible state forwarded to supported ds controls. */\n  @Prop() error: boolean = false;\n  /** Visible error associated with the slotted control while error is true. */\n  @Prop() errorMessage: string | undefined;\n\n  @State() private focused = false;\n  @State() private filled = false;\n  @State() private dirty = false;\n  @State() private touched = false;\n  @State() private controlDisabled = false;\n  @State() private controlRequired = false;\n\n  private readonly generatedId = `ds-field-${++fieldCounter}`;\n  private controlContainer?: HTMLDivElement;\n  private control?: FieldControl;\n  private initialValue = '';\n  private authoredAria = new WeakMap<FieldControl, AuthoredAria>();\n\n  componentDidLoad() {\n    this.syncControl();\n    requestAnimationFrame(() => this.syncControl());\n  }\n\n  componentDidRender() {\n    this.syncControl();\n  }\n\n  @Watch('fieldId')\n  @Watch('description')\n  @Watch('error')\n  @Watch('errorMessage')\n  onFieldContractChange() {\n    this.syncControl();\n  }\n\n  private get controlId(): string {\n    return this.fieldId || this.generatedId;\n  }\n\n  private get labelId(): string {\n    return `${this.controlId}-label`;\n  }\n\n  private get descriptionId(): string {\n    return `${this.controlId}-description`;\n  }\n\n  private get errorId(): string {\n    return `${this.controlId}-error`;\n  }\n\n  private get renderedDescription(): boolean {\n    return Boolean(this.description) && !this.renderedError;\n  }\n\n  private get renderedError(): boolean {\n    return this.error && Boolean(this.errorMessage);\n  }\n\n  private readValue(control: FieldControl): string {\n    const value = control.value;\n    return Array.isArray(value) ? value.join('\\u001f') : String(value ?? '');\n  }\n\n  private updateControlAttribute(control: FieldControl, name: string, value: string | undefined) {\n    if (value === undefined) {\n      if (control.hasAttribute(name)) control.removeAttribute(name);\n      return;\n    }\n    if (control.getAttribute(name) !== value) control.setAttribute(name, value);\n  }\n\n  private findControl(): FieldControl | undefined {\n    return this.controlContainer?.querySelector<FieldControl>(':scope > :not(slot)') ?? undefined;\n  }\n\n  private syncControl = () => {\n    const control = this.findControl();\n    if (!control) return;\n\n    if (control !== this.control) {\n      this.control = control;\n      this.initialValue = this.readValue(control);\n      this.authoredAria.set(control, {\n        labelledby: tokens(control.getAttribute('aria-labelledby')),\n        describedby: tokens(control.getAttribute('aria-describedby')),\n      });\n    }\n\n    const isDsControl = control.tagName.startsWith('DS-');\n    if (isDsControl && 'inputId' in control) control.inputId = this.controlId;\n    else this.updateControlAttribute(control, 'id', this.controlId);\n\n    const authored = this.authoredAria.get(control) ?? { labelledby: [], describedby: [] };\n    const labelledby = uniqueTokens(authored.labelledby, [this.labelId]).join(' ');\n    const describedby = uniqueTokens(\n      authored.describedby,\n      this.renderedDescription ? [this.descriptionId] : [],\n      this.renderedError ? [this.errorId] : []\n    ).join(' ');\n\n    this.updateControlAttribute(control, 'aria-labelledby', labelledby);\n    this.updateControlAttribute(control, 'aria-describedby', describedby || undefined);\n    this.updateControlAttribute(control, 'aria-invalid', this.error ? 'true' : undefined);\n\n    if (isDsControl && 'error' in control && control.error !== this.error)\n      control.error = this.error;\n\n    const value = this.readValue(control);\n    this.filled = value.length > 0;\n    this.dirty = value !== this.initialValue;\n    this.controlDisabled = Boolean(\n      control.disabled || control.isInactive || control.hasAttribute('disabled')\n    );\n    this.controlRequired = Boolean(control.required || control.hasAttribute('required'));\n  };\n\n  private handleLabelClick = (event: MouseEvent) => {\n    if (!this.control?.tagName.startsWith('DS-')) return;\n    event.preventDefault();\n    this.control.setFocus?.();\n  };\n\n  private handleFocusIn = () => {\n    this.focused = true;\n  };\n\n  private handleFocusOut = (event: FocusEvent) => {\n    if (event.relatedTarget instanceof Node && this.el.contains(event.relatedTarget)) return;\n    this.focused = false;\n    this.touched = true;\n  };\n\n  private handleValueChange = () => {\n    this.syncControl();\n  };\n\n  render() {\n    return (\n      <Host\n        data-focused={this.focused ? '' : undefined}\n        data-filled={this.filled ? '' : undefined}\n        data-dirty={this.dirty ? '' : undefined}\n        data-touched={this.touched ? '' : undefined}\n        data-invalid={this.error ? '' : undefined}\n        data-disabled={this.controlDisabled ? '' : undefined}\n        data-required={this.controlRequired ? '' : undefined}\n        onFocusin={this.handleFocusIn}\n        onFocusout={this.handleFocusOut}\n        onInput={this.handleValueChange}\n        onChange={this.handleValueChange}\n        onDsChange={this.handleValueChange}\n      >\n        <div class=\"field ds-field-stack\">\n          <ds-text\n            class=\"field__label\"\n            as=\"label\"\n            variant=\"text-body-small\"\n            color=\"primary\"\n            emphasis\n            for={this.controlId}\n            textId={this.labelId}\n            onClick={this.handleLabelClick}\n          >\n            {this.label}\n          </ds-text>\n          <div class=\"field__control\" ref={el => (this.controlContainer = el)}>\n            <slot onSlotchange={this.syncControl} />\n          </div>\n          {this.renderedDescription && (\n            <ds-text\n              class=\"field__description\"\n              as=\"div\"\n              variant=\"text-body-small\"\n              color=\"secondary\"\n              textId={this.descriptionId}\n            >\n              {this.description}\n            </ds-text>\n          )}\n          {this.renderedError && (\n            <ds-text\n              class=\"field__error\"\n              as=\"div\"\n              variant=\"text-body-small\"\n              color=\"negative\"\n              textId={this.errorId}\n              role=\"alert\"\n            >\n              {this.errorMessage}\n            </ds-text>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}