@pine-ds/core 3.9.0 → 3.11.0

package/dist/pine-core/p-f25274c9.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["pdsInputTokensCss","labelCss","pdsInputCss","PdsInput","constructor","hostRef","this","inheritedAttributes","isComposing","hasPrefix","hasSuffix","hasPrepend","hasAppend","hasAction","type","value","hasFocus","onInputEvent","ev","input","target","emitInputChange","onChangeEvent","emitValueChange","onBlurEvent","focusedValue","pdsBlur","emit","onFocusEvent","pdsFocus","onCompositionStart","onCompositionEnd","setFocus","nativeInput","focus","updateAddonWidths","requestAnimationFrame","prefixEl","prefixWidth","offsetWidth","el","style","setProperty","suffixEl","suffixWidth","renderPrefix","querySelector","h","class","part","ref","name","onSlotchange","renderSuffix","renderPrepend","renderAppend","renderAction","componentWillLoad","Object","assign","inheritAriaAttributes","originalPdsInput","pdsInput","connectedCallback","attachInternals","internals","componentDidLoad","debounceChanged","updateFormValue","componentDidUpdate","debounce","undefined","debounceEvent","valueChanged","getValue","toString","event","newValue","pdsChange","setFormValue","setValidity","validity","validationMessage","formResetCallback","formDisabledCallback","disabled","formStateRestoreCallback","state","FormData","get","render","componentId","errorMessage","helperMessage","invalid","label","inputWrapperClasses","Host","key","readonly","hideLabel","fullWidth","htmlFor","required","assignDescription","autocomplete","id","max","maxlength","min","minlength","pattern","placeholder","readOnly","step","onInput","onChange","onBlur","onFocus","onCompositionstart","onCompositionend","messageId","icon","danger","size"],"sources":["src/components/pds-input/pds-input.tokens.scss?tag=pds-input&encapsulation=shadow","src/global/styles/utils/label.scss?tag=pds-input&encapsulation=shadow","src/components/pds-input/pds-input.scss?tag=pds-input&encapsulation=shadow","src/components/pds-input/pds-input.tsx"],"sourcesContent":["@use '~@kajabi-ui/styles/dist/pine/components/pds-input/pds-input.tokens'\n",":host {\n  display: inline-block;\n}\n\n:host([aria-disabled=\"true\"]) label {\n  color: var(--pine-color-text-label-disabled);\n}\n\n:host([aria-readonly=\"true\"]) {\n  label {\n    color: var(--pine-color-text-label-readonly);\n  }\n}\n\nlabel {\n  color: var(--pine-color-text-label);\n  font: var(--pine-typography-body-medium);\n  letter-spacing: var(--pine-letter-spacing);\n}\n",":host {\n  --pds-input-background: var(--pine-color-background-container);\n  --pds-input-border-color: var(--pine-color-border);\n  --pds-input-border-color-hover: var(--pine-color-border-hover);\n  --pds-input-border-color-disabled: var(--pine-color-border-disabled);\n\n  --pds-input-border-radius: var(--pine-dimension-125);\n  --pds-input-border-width: var(--pine-border-width-thin);\n  --pds-input-padding-x: var(--pine-dimension-150);\n  --pds-input-padding-y: calc(var(--pine-dimension-xs) - var(--pine-border-width));\n  --pds-input-font: var(--pine-typography-body);\n  --pds-input-text-color: var(--pine-color-text-active);\n  --pds-input-placeholder-color: var(--pine-color-text-placeholder);\n  --pds-input-icon-color: var(--pine-color-text-secondary);\n  --pds-input-disabled-background: var(--pine-color-background-container-disabled);\n  --pds-input-disabled-text-color: var(--pine-color-text-disabled);\n  --pds-input-error-color: var(--pine-color-text-message-danger);\n  --pds-input-error-background: var(--pine-input-color-background-danger);\n  --pds-input-error-border: var(--pine-color-border-danger);\n  --pds-input-error-border-hover: var(--pine-color-border-danger-hover);\n  --pds-input-addon-background: var(--pine-color-background-subtle);\n  --pds-input-addon-color: var(--pine-color-text-secondary);\n  --pds-input-field-min-height: var(--pine-dimension-450);\n  --box-shadow-focus: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);\n  --box-shadow-focus-error: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring-danger);\n\n  display: inline;\n\n  pds-select::part(select) {\n    background-color: var(--pds-input-error-background);\n    border-color: var(--pds-input-error-border);\n  }\n\n  &::part(prefix),\n  &::part(suffix) {\n    align-items: center;\n    color: var(--pine-color-text-label-readonly);\n    display: flex;\n    height: 100%;\n    position: absolute;\n    top: 50%;\n    transform: translateY(-50%);\n    white-space: nowrap;\n    z-index: var(--pine-z-index-raised);\n  }\n\n  &::part(prefix) {\n    border-end-start-radius: var(--pds-input-border-radius);\n    border-inline-end: var(--pine-border-width-none);\n    border-start-start-radius: var(--pds-input-border-radius);\n    left: var(--pds-input-padding-x);\n  }\n\n  &::part(suffix) {\n    border-end-end-radius: var(--pds-input-border-radius);\n    border-inline-start: var(--pine-border-width-none);\n    border-start-end-radius: var(--pds-input-border-radius);\n    right: var(--pds-input-padding-x);\n  }\n\n  &::part(prepend),\n  &::part(append) {\n    align-items: center;\n    background-color: var(--pds-input-addon-background);\n    border: var(--pds-input-border-width) solid var(--pds-input-border-color);\n    color: var(--pds-input-addon-color);\n    display: flex;\n    overflow: visible;\n  }\n\n  &::part(prepend) {\n    border-end-start-radius: var(--pds-input-border-radius);\n    border-inline-end: var(--pine-border-width-none);\n    border-start-start-radius: var(--pds-input-border-radius);\n  }\n\n  &::part(append) {\n    border-end-end-radius: var(--pds-input-border-radius);\n    border-inline-start: var(--pine-border-width-none);\n    border-start-end-radius: var(--pds-input-border-radius);\n  }\n}\n\n/* stylelint-disable-next-line */\n:host([has-prepend]) ::slotted(pds-button[slot=\"prepend\"]) {\n  --pds-button-background: var(--pds-input-addon-background);\n  --pds-button-border: var(--pine-border-width-none);\n  --pds-button-border-radius: var(--pine-dimension-none);\n  --pds-button-border-radius-end-end: var(--pine-dimension-none);\n  --pds-button-border-radius-start-end: var(--pine-dimension-none);\n  --pds-button-border-radius-start-start: var(--pds-input-border-radius);\n  --pds-button-border-radius-end-start: var(--pds-input-border-radius);\n  --pds-button-min-height: calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));\n  --pds-button-box-shadow-focus: 0 0 0 3px var(--pine-color-focus-ring);\n  --pds-button-outline-focus: none;\n}\n\n/* stylelint-disable-next-line */\n:host([has-append]) ::slotted(pds-button[slot=\"append\"]) {\n  --pds-button-background: var(--pds-input-addon-background);\n  --pds-button-border: var(--pine-border-width-none);\n  --pds-button-border-radius: var(--pine-dimension-none);\n  --pds-button-border-radius-end-start: var(--pine-dimension-none);\n  --pds-button-border-radius-start-start: var(--pine-dimension-none);\n  --pds-button-border-radius-start-end: var(--pds-input-border-radius);\n  --pds-button-border-radius-end-end: var(--pds-input-border-radius);\n  --pds-button-min-height: calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));\n  --pds-button-box-shadow-focus: 0 0 0 3px var(--pine-color-focus-ring);\n  --pds-button-outline-focus: none;\n}\n\n/* stylelint-disable-next-line */\n:host([has-prepend]) ::slotted(pds-select[slot=\"prepend\"]) {\n  --pds-select-background: var(--pds-input-addon-background);\n  --pds-select-border: var(--pine-border-width-none);\n  --pds-select-border-radius-end-end: var(--pine-dimension-none);\n  --pds-select-border-radius-start-end: var(--pine-dimension-none);\n  --pds-select-min-height: calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));\n}\n\n/* stylelint-disable-next-line */\n:host([has-append]) ::slotted(pds-select[slot=\"append\"]) {\n  --pds-select-background: var(--pds-input-addon-background);\n  --pds-select-border: var(--pine-border-width-none);\n  --pds-select-border-radius-end-start: var(--pine-dimension-none);\n  --pds-select-border-radius-start-start: var(--pine-dimension-none);\n  --pds-select-min-height: calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));\n}\n\n:host([aria-readonly=\"true\"]) {\n  input {\n    background-color: var(--pine-color-background-container-disabled);\n    color: var(--pine-color-text-readonly);\n  }\n}\n\n:host([disabled=\"true\"]) {\n  &::part(prepend),\n  &::part(append) {\n    background-color: var(--pds-input-disabled-background);\n    border: var(--pds-input-border-width) solid var(--pds-input-border-color-disabled);\n  }\n}\n\n:host([full-width=\"true\"]) {\n  width: 100%;\n}\n\n:host([invalid=\"true\"]) {\n  &::part(prepend),\n  &::part(append) {\n    background-color: var(--pds-input-error-background);\n    border: var(--pds-input-border-width) solid var(--pds-input-error-border);\n  }\n}\n\n:host([highlight]:not([disabled]):not([aria-disabled=\"true\"]):not([invalid]):not([aria-readonly=\"true\"])) {\n  --pds-input-background: var(--pine-color-accent-disabled);\n  --pds-input-border-color: var(--pine-color-accent);\n  --pds-input-border-color-hover: var(--pine-color-accent-hover);\n  --pds-input-text-color: var(--pine-color-text-accent);\n\n  &::part(prefix),\n  &::part(suffix) {\n    color: var(--pine-color-text-accent);\n  }\n\n  .pds-input__field:focus-visible {\n    outline-color: var(--pine-color-focus-ring);\n  }\n}\n\n.pds-input {\n  display: flex;\n  flex-direction: column;\n}\n\n.pds-input__label-wrapper {\n  align-items: center;\n  display: flex;\n  justify-content: space-between;\n  margin-block-end: var(--pine-dimension-2xs);\n}\n\n.pds-input__label {\n  color: var(--pine-color-text-active);\n  margin-block-end: var(--pine-dimension-2xs);\n}\n\n// When label is inside wrapper, remove its margin\n.pds-input__label-wrapper .pds-input__label {\n  margin-block-end: 0;\n}\n\n.pds-input__action {\n  align-items: center;\n  display: flex;\n  gap: var(--pine-dimension-xs);\n  margin-inline-start: var(--pine-dimension-xs);\n}\n\n.pds-input__field-wrapper {\n  align-items: center;\n  display: flex;\n  position: relative;\n  width: 100%;\n\n  &.has-prefix .pds-input__field {\n    padding-inline-start: calc(2 * var(--pds-input-padding-x) + var(--prefix-width, 1em));\n  }\n\n  &.has-suffix .pds-input__field {\n    padding-inline-end: calc(2 * var(--pds-input-padding-x) + var(--suffix-width, 1em));\n  }\n\n  &.has-prepend .pds-input__field {\n    border-end-start-radius: var(--pine-dimension-none);\n    border-start-start-radius: var(--pine-dimension-none);\n  }\n\n  &.has-append .pds-input__field {\n    border-end-end-radius: var(--pine-dimension-none);\n    border-start-end-radius: var(--pine-dimension-none);\n  }\n}\n\n.pds-input__field {\n  background: var(--pds-input-background);\n  border: var(--pds-input-border-width) solid var(--pds-input-border-color);\n  border-radius: var(--pds-input-border-radius);\n  box-sizing: border-box;\n  color: var(--pds-input-text-color);\n  flex: 1;\n  font: var(--pds-input-font);\n  letter-spacing: var(--pine-letter-spacing);\n  min-height: var(--pds-input-field-min-height);\n  min-width: var(--pine-dimension-none);\n  padding: var(--pds-input-padding-y) var(--pds-input-padding-x);\n  transition: border-color 0.2s ease;\n  width: 100%;\n\n  &:hover:not(:disabled) {\n    border-color: var(--pds-input-border-color-hover);\n  }\n\n  &:disabled {\n    background: var(--pds-input-disabled-background);\n    border-color: var(--pine-color-border-disabled);\n    color: var(--pds-input-disabled-text-color);\n    cursor: not-allowed;\n\n    &::placeholder {\n      color: var(--pine-color-text-placeholder-disabled);\n    }\n  }\n\n  .has-error &:hover:not(:disabled) {\n    border-color: var(--pds-input-error-border-hover);\n  }\n\n  &:focus-visible:not(.has-error) {\n    border-color: var(--pine-color-border-active);\n    outline: var(--pine-outline-focus);\n    outline-offset: var(--pine-border-width);\n    position: relative;\n    z-index: 1;\n\n    :host([has-prepend]) &,\n    :host([has-append]) &,\n    :host([has-prefix]) &,\n    :host([has-suffix]) & {\n      outline-offset: var(--pine-dimension-none);\n    }\n  }\n\n  &::placeholder {\n    color: var(--pds-input-placeholder-color);\n  }\n\n  .has-error & {\n    background-color: var(--pds-input-error-background);\n    border-color: var(--pds-input-error-border);\n\n    &:focus-visible {\n      outline-color: var(--pine-color-focus-ring-danger);\n      position: relative;\n      z-index: 1;\n    }\n  }\n}\n\n.pds-input__error-message,\n.pds-input__helper-message {\n  color: var(--pine-color-text-message);\n  font: var(--pine-typography-body-sm);\n  margin-block-end: var(--pine-dimension-none);\n  margin-block-start: var(--pine-dimension-2xs);\n}\n\n.pds-input__error-message {\n  align-items: center;\n  color: var(--pds-input-error-color);\n  display: flex;\n  gap: var(--pine-dimension-2xs);\n}\n\n.visually-hidden {\n  border: 0;\n  clip: rect(0 0 0 0);\n  clip-path: polygon(0 0, 0 0, 0 0);\n  height: 1px;\n  margin: -1px;\n  overflow: hidden;\n  padding: 0;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { assignDescription, messageId } from '../../utils/form';\nimport { inheritAriaAttributes } from '@utils/attributes';\nimport type { Attributes } from '@utils/attributes';\nimport { InputChangeEventDetail, InputInputEventDetail } from './input-interface';\nimport { debounceEvent } from '@utils/utils';\nimport { danger } from '@pine-ds/icons/icons';\n\n/**\n * @slot append - Content to be displayed after the input field\n * @slot prefix - Content that is displayed visually within the input field before the input field\n * @slot prepend - Content to be displayed before the input field\n * @slot suffix - Content that is displayed visually within the input field after the input field\n * @slot action - Content to be displayed in the label area, typically for help icons or links\n */\n@Component({\n  tag: 'pds-input',\n  styleUrls: ['pds-input.tokens.scss', '../../global/styles/utils/label.scss', 'pds-input.scss'],\n  shadow: true,\n  formAssociated: true,\n})\nexport class PdsInput {\n\n  private nativeInput?: HTMLInputElement;\n  private inheritedAttributes: Attributes = {};\n  private isComposing = false;\n  private prefixEl?: HTMLElement;\n  private suffixEl?: HTMLElement;\n  private focusedValue?: string | number | null;\n  private originalPdsInput?: EventEmitter<InputInputEventDetail>;\n  private internals?: ElementInternals;\n\n  @Element() el!: HTMLPdsInputElement;\n\n  /**\n   * If true, the input has prefix content (non-focusable)\n   */\n  @State() hasPrefix = false;\n\n  /**\n   * If true, the input has suffix content (non-focusable)\n   */\n  @State() hasSuffix = false;\n\n  /**\n   * If true, the input has prepend content (focusable)\n   */\n  @State() hasPrepend = false;\n\n  /**\n   * If true, the input has append content (focusable)\n   */\n  @State() hasAppend = false;\n\n  /**\n   * If true, the input has action content in the label area\n   */\n  @State() hasAction = false;\n\n  /**\n   * Emitted when the input loses focus.\n   */\n  @Event() pdsBlur!: EventEmitter<FocusEvent>;\n\n  /**\n   * Emitted when the value has changed.\n   *\n   * This event will not emit when programmatically setting the `value` property.\n   */\n  @Event() pdsChange!: EventEmitter<InputChangeEventDetail>;\n\n  /**\n   * Emitted when the input has focus.\n   */\n  @Event() pdsFocus!: EventEmitter<FocusEvent>;\n\n  /**\n   * Emitted when a keyboard input occurs.\n   */\n  @Event() pdsInput: EventEmitter<InputInputEventDetail>;\n\n  /**\n   * Sets focus on the native `input` in the `pds-input`. Use this method instead of the global\n   * `input.focus()`.\n   */\n  @Method()\n  async setFocus() {\n    if (this.nativeInput) {\n      this.nativeInput.focus();\n    }\n  }\n\n\n  /**\n   * Specifies if and how the browser provides `autocomplete` assistance for the field.\n   */\n  @Prop() autocomplete: string;\n\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId!: string;\n\n  /**\n   * Sets the number of milliseconds to wait before updating the value.\n   */\n  @Prop() debounce?: number;\n\n  /**\n   * Determines whether or not the input field is disabled.\n   */\n  @Prop() disabled?: boolean;\n\n  /**\n   * Specifies the error message and provides an error-themed treatment to the field.\n   */\n  @Prop() errorMessage?: string;\n\n  /**\n   * Displays a message or hint below the input field.\n   */\n  @Prop() helperMessage?: string;\n\n  /**\n   * Determines whether or not the input field is invalid or throws an error.\n   */\n  @Prop() invalid?: boolean;\n\n  /**\n   * Text to be displayed as the input label.\n   */\n  @Prop() label?: string;\n\n  /**\n   * Visually hides the label text for instances where only the input should be displayed. Label remains accessible to assistive technology such as screen readers.\n   * Note: When true, the action slot is also hidden to maintain a minimal UI.\n   */\n  @Prop() hideLabel: boolean;\n\n  /**\n   * Specifies the maximum value for the input field.\n   */\n  @Prop() max?: string;\n\n  /**\n   * Specifies the maximum number of characters allowed in the input field.\n   */\n  @Prop() maxlength?: string;\n\n  /**\n   * Specifies the minimum value for the input field.\n   */\n  @Prop() min?: string;\n\n  /**\n   * Specifies the minimum number of characters allowed in the input field.\n   */\n  @Prop() minlength?: string;\n\n  /**\n   * Specifies the name. Submitted with the form name/value pair.\n   */\n  @Prop() name?: string;\n\n  /**\n   * Specifies the regular expression that the input value is checked against.\n   */\n  @Prop() pattern?: string;\n\n  /**\n   * Specifies a short hint that describes the expected value of the input field.\n   */\n  @Prop() placeholder?: string;\n\n  /**\n   * Determines whether or not the input field is readonly.\n   */\n  @Prop() readonly?: boolean;\n\n  /**\n   * Determines whether or not the input field is required.\n   */\n  @Prop() required?: boolean;\n\n  /**\n   * Works with the `min` and `max` attributes to define increments for the input field.\n   */\n  @Prop() step?: string;\n\n  /**\n   * Determines the type of control that will be displayed\n   * `'email'`, `'number'`, `'password'`, `'tel'`, `'text'`, `'url'`\n   * @defaultValue \"text\"\n   */\n  @Prop() type = 'text';\n\n  /**\n   * The value of the input.\n   */\n  @Prop({mutable: true}) value?: string | number | null = '';\n\n  /**\n   * Determines whether or not the input field takes full width of its container.\n   */\n  @Prop() fullWidth?: boolean;\n\n  /**\n   * Applies highlight styling to the input field.\n   */\n  @Prop({ reflect: true }) highlight?: boolean;\n\n  /**\n   * Determines if the input has focus.\n   */\n  @State() hasFocus = false;\n\n  private updateAddonWidths() {\n    requestAnimationFrame(() => {\n      if (this.prefixEl) {\n        const prefixWidth = this.prefixEl.offsetWidth;\n        this.el.style.setProperty('--prefix-width', `${prefixWidth}px`);\n      }\n\n      if (this.suffixEl) {\n        const suffixWidth = this.suffixEl.offsetWidth;\n        this.el.style.setProperty('--suffix-width', `${suffixWidth}px`);\n      }\n    });\n  }\n\n  private renderPrefix() {\n    const hasPrefix = this.el.querySelector('[slot=\"prefix\"]') !== null;\n    if (hasPrefix) {\n      return (\n        <div class=\"pds-input__prefix\" part=\"prefix\" ref={(el) => this.prefixEl = el as HTMLElement}>\n          <slot name=\"prefix\" onSlotchange={() => this.updateAddonWidths()}></slot>\n        </div>\n      );\n    }\n    return null;\n  }\n\n  private renderSuffix() {\n    const hasSuffix = this.el.querySelector('[slot=\"suffix\"]') !== null;\n    if (hasSuffix) {\n      return (\n        <div class=\"pds-input__suffix\" part=\"suffix\" ref={(el) => this.suffixEl = el as HTMLElement}>\n          <slot name=\"suffix\" onSlotchange={() => this.updateAddonWidths()}></slot>\n        </div>\n      );\n    }\n    return null;\n  }\n\n  private renderPrepend() {\n    const hasPrepend = this.el.querySelector('[slot=\"prepend\"]') !== null;\n    if (hasPrepend) {\n      return (\n        <div class=\"pds-input__prepend\" part=\"prepend\">\n          <slot name=\"prepend\"></slot>\n        </div>\n      );\n    }\n    return null;\n  }\n\n  private renderAppend() {\n    const hasAppend = this.el.querySelector('[slot=\"append\"]') !== null;\n    if (hasAppend) {\n      return (\n        <div class=\"pds-input__append\" part=\"append\">\n          <slot name=\"append\"></slot>\n        </div>\n      );\n    }\n    return null;\n  }\n\n  private renderAction() {\n    const hasAction = this.el.querySelector('[slot=\"action\"]') !== null;\n    if (hasAction) {\n      return (\n        <div class=\"pds-input__action\" part=\"action\">\n          <slot name=\"action\"></slot>\n        </div>\n      );\n    }\n    return null;\n  }\n\n  componentWillLoad() {\n    this.inheritedAttributes = {\n      ...inheritAriaAttributes(this.el)\n    };\n    this.hasPrefix = this.el.querySelector('[slot=\"prefix\"]') !== null;\n    this.hasSuffix = this.el.querySelector('[slot=\"suffix\"]') !== null;\n    this.hasPrepend = this.el.querySelector('[slot=\"prepend\"]') !== null;\n    this.hasAppend = this.el.querySelector('[slot=\"append\"]') !== null;\n    this.hasAction = this.el.querySelector('[slot=\"action\"]') !== null;\n\n    // Store the original pdsInput event emitter\n    this.originalPdsInput = this.pdsInput;\n  }\n\n  connectedCallback() {\n    // Initialize ElementInternals for form association\n    if (this.el.attachInternals) {\n      this.internals = this.el.attachInternals();\n    }\n  }\n\n  componentDidLoad() {\n    this.debounceChanged();\n    this.updateAddonWidths();\n    // Set initial form value\n    this.updateFormValue();\n  }\n\n  componentDidUpdate() {\n    this.updateAddonWidths();\n  }\n\n  @Watch('debounce')\n  protected debounceChanged() {\n    const { pdsInput, debounce, originalPdsInput } = this;\n\n    /**\n     * If debounce is undefined, we have to manually revert the pdsInput emitter in case\n     * debounce used to be set to a number. Otherwise, the event would stay debounced.\n     */\n    this.pdsInput = debounce === undefined ? originalPdsInput ?? pdsInput : debounceEvent(pdsInput, debounce);\n  }\n\n  @Watch('value')\n  protected valueChanged() {\n    const nativeInput = this.nativeInput;\n    const value = this.getValue();\n\n    if (nativeInput && nativeInput.value !== value && !this.isComposing) {\n      nativeInput.value = value;\n    }\n\n    // Update form value when value changes\n    this.updateFormValue();\n  }\n\n  private getValue(): string {\n    return typeof this.value === 'number' ? this.value.toString() : (this.value || '').toString();\n  }\n\n  private onInputEvent = (ev: Event) => {\n    const input = ev.target as HTMLInputElement | null;\n    if (input) {\n      this.value = input.value || '';\n    }\n    this.emitInputChange(ev);\n  };\n\n  private onChangeEvent = (ev: Event) => {\n    this.emitValueChange(ev);\n  };\n\n  private onBlurEvent = (ev: FocusEvent) => {\n    this.hasFocus = false;\n\n    if (this.focusedValue !== this.value) {\n      /**\n       * Emits the `pdsChange` event when the input value\n       * is different than the value when the input was focused.\n       */\n      this.emitValueChange(ev);\n    }\n\n    this.pdsBlur.emit(ev);\n  };\n\n  private onFocusEvent = (ev: FocusEvent) => {\n    this.hasFocus = true;\n    this.focusedValue = this.value;\n\n    this.pdsFocus.emit(ev);\n  };\n\n  private onCompositionStart = () => {\n    this.isComposing = true;\n  }\n\n  private onCompositionEnd = () => {\n    this.isComposing = false;\n  }\n\n  /**\n   * Emits a pdsChange event\n   */\n  private emitValueChange(event?: Event) {\n    const { value } = this;\n    const newValue = value == null ? value : value.toString();\n\n    this.focusedValue = newValue;\n    this.pdsChange.emit({ value: newValue, event });\n  }\n\n  /**\n   * Emits a `pdsInput` event\n   */\n  private emitInputChange(event?: Event) {\n    const { value } = this;\n\n    // Checks for both null and undefined values\n    const newValue = value == null ? value : value.toString();\n\n    this.pdsInput.emit({ value: newValue, event });\n  }\n\n  /**\n   * Updates the form value using ElementInternals API\n   */\n  private updateFormValue() {\n    if (this.internals && this.internals.setFormValue) {\n      const value = this.getValue();\n      this.internals.setFormValue(value || null);\n\n      // Set validity based on native input validation\n      if (this.nativeInput && this.internals && this.internals.setValidity) {\n        this.internals.setValidity(\n          this.nativeInput.validity,\n          this.nativeInput.validationMessage,\n          this.nativeInput\n        );\n      }\n    }\n  }\n\n  /**\n   * Form Associated Custom Elements API: Called when the form is reset\n   */\n  formResetCallback() {\n    this.value = '';\n    this.updateFormValue();\n  }\n\n  /**\n   * Form Associated Custom Elements API: Called when the form is disabled\n   */\n  formDisabledCallback(disabled: boolean) {\n    this.disabled = disabled;\n  }\n\n  /**\n   * Form Associated Custom Elements API: Called to restore form state\n   */\n  formStateRestoreCallback(state: string | FormData | null) {\n    if (typeof state === 'string') {\n      this.value = state;\n    } else if (state instanceof FormData && this.name) {\n      // Extract value from FormData using the input's name\n      const value = state.get(this.name);\n      if (typeof value === 'string') {\n        this.value = value;\n      }\n    }\n  }\n\n  render() {\n    const {\n      componentId,\n      disabled,\n      errorMessage,\n      helperMessage,\n      invalid = false,\n      label,\n    } = this;\n\n    const value = this.getValue();\n\n    const inputWrapperClasses = {\n      'pds-input__field-wrapper': true,\n      'has-focus': this.hasFocus,\n      'has-error': invalid || !!errorMessage,\n      'is-disabled': disabled,\n      'has-prefix': this.hasPrefix,\n      'has-suffix': this.hasSuffix,\n      'has-prepend': this.hasPrepend,\n      'has-append': this.hasAppend,\n    };\n\n    return (\n      <Host\n        aria-disabled={this.disabled ? 'true' : null}\n        aria-readonly={this.readonly ? 'true' : null}\n        has-prefix={this.hasPrefix ? 'true' : null}\n        has-suffix={this.hasSuffix ? 'true' : null}\n        has-prepend={this.hasPrepend ? 'true' : null}\n        has-append={this.hasAppend ? 'true' : null}\n        has-action={this.hasAction && !this.hideLabel ? 'true' : null}\n        full-width={this.fullWidth ? 'true' : null}\n      >\n        <div class=\"pds-input\">\n          {label && (\n            <div class=\"pds-input__label-wrapper\">\n              <label htmlFor={componentId} class=\"pds-input__label\">\n                <span class={this.hideLabel ? 'visually-hidden' : ''}>\n                  {label}\n                  {this.required && <span class=\"pds-input__required-indicator\"> *</span>}\n                </span>\n              </label>\n              {!this.hideLabel && this.renderAction()}\n            </div>\n          )}\n\n          <div class={inputWrapperClasses}>\n            {this.renderPrepend()}\n            {this.renderPrefix()}\n            <input\n              ref={(input) => (this.nativeInput = input)}\n              class=\"pds-input__field\"\n              aria-describedby={assignDescription(componentId, invalid, helperMessage)}\n              aria-invalid={invalid ? \"true\" : undefined}\n              autocomplete={this.autocomplete}\n              disabled={disabled}\n              id={componentId}\n              max={this.max}\n              maxlength={this.maxlength}\n              min={this.min}\n              minlength={this.minlength}\n              name={this.name}\n              pattern={this.pattern}\n              placeholder={this.placeholder}\n              readOnly={this.readonly}\n              required={this.required}\n              step={this.step}\n              type={this.type}\n              value={value}\n              onInput={this.onInputEvent}\n              onChange={this.onChangeEvent}\n              onBlur={this.onBlurEvent}\n              onFocus={this.onFocusEvent}\n              onCompositionstart={this.onCompositionStart}\n              onCompositionend={this.onCompositionEnd}\n              {...this.inheritedAttributes}\n            />\n            {this.renderSuffix()}\n            {this.renderAppend()}\n          </div>\n\n          {helperMessage && (\n            <p class=\"pds-input__helper-message\" id={messageId(componentId, 'helper')}>\n              {helperMessage}\n            </p>\n          )}\n\n          {errorMessage && (\n            <p class=\"pds-input__error-message\" id={messageId(componentId, 'error')}>\n              <pds-icon icon={danger} size=\"small\" />\n              {errorMessage}\n            </p>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/pine-core/p-f5d78141.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["pdsDividerCss","PdsDivider","constructor","hostRef","this","vertical","classNames","push","offset","offsetClassName","join","render","h","Host","key","id","componentId","class"],"sources":["src/components/pds-divider/pds-divider.scss?tag=pds-divider&encapsulation=shadow","src/components/pds-divider/pds-divider.tsx"],"sourcesContent":["$pds-divider-offsets: (\n  xxs: var(--pine-dimension-2xs),\n  xs: var(--pine-dimension-xs),\n  sm: var(--pine-dimension-sm),\n  md: var(--pine-dimension-md),\n  lg: var(--pine-dimension-lg),\n  xl: var(--pine-dimension-xl),\n  xxl: var(--pine-dimension-2xl),\n);\n\n.pds-divider {\n  background: var(--pine-color-border);\n  border: 0;\n  display: flex;\n  height: var(--pine-border-width);\n  margin: 0;\n  width: 100%;\n}\n\n.pds-divider--vertical {\n  height: 100%;\n  width: 1px;\n}\n\n@each $offset, $value in $pds-divider-offsets {\n  .pds-divider--offset-#{$offset} {\n    margin: 0 calc($value * -1);\n    padding: 0 $value;\n\n    &.pds-divider--vertical {\n      margin: calc($value * -1) 0;\n      padding: $value 0;\n    }\n  }\n}\n\n@media (max-width: 767px) {\n  .pds-divider--vertical {\n    display: none;\n  }\n}\n","import { Component, Prop, Host, h } from '@stencil/core';\n\n@Component({\n  tag: 'pds-divider',\n  styleUrls: ['pds-divider.scss'],\n  shadow: true,\n})\nexport class PdsDivider {\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId: string;\n\n  /**\n   * Adds offset margin/padding to expand the width (horizontal) or the height (vertical) of divider.\n   */\n  @Prop() offset: 'xxs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';\n\n  /**\n   * Sets divider to display vertically.\n   * @defaultValue false\n   */\n  @Prop() vertical = false;\n\n  private classNames() {\n    const classNames = ['pds-divider'];\n\n    if (this.vertical) {\n      classNames.push('pds-divider--vertical');\n    }\n\n    if (this.offset) {\n      const offsetClassName = 'pds-divider--offset-' + this.offset;\n      classNames.push(offsetClassName);\n    }\n\n    return classNames.join(' ');\n  }\n\n  render() {\n    return (\n      <Host id={this.componentId}>\n        <hr class={this.classNames()} />\n      </Host>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAgB,o1D,MCOTC,EAAU,MALvB,WAAAC,CAAAC,G,UAoBUC,KAAQC,SAAG,KAwBpB,CAtBS,UAAAC,GACN,MAAMA,EAAa,CAAC,eAEpB,GAAIF,KAAKC,SAAU,CACjBC,EAAWC,KAAK,wB,CAGlB,GAAIH,KAAKI,OAAQ,CACf,MAAMC,EAAkB,uBAAyBL,KAAKI,OACtDF,EAAWC,KAAKE,E,CAGlB,OAAOH,EAAWI,KAAK,I,CAGzB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,GAAIX,KAAKY,aACbJ,EAAI,MAAAE,IAAA,2CAAAG,MAAOb,KAAKE,e","ignoreList":[]}

package/dist/pine-core/p-f61ee383.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["pdsFiltersCss","PdsFilters","exports","class_1","prototype","render","h","Host","key","id","this","componentId","class"],"sources":["src/components/pds-filters/pds-filters.scss?tag=pds-filters&encapsulation=shadow","src/components/pds-filters/pds-filters.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.pds-filters {\n  align-items: flex-start;\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--pine-dimension-100);\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\nimport type { BasePdsProps } from '@utils/interfaces';\n\n/**\n * @slot (default) - Container for pds-filter components.\n */\n\n@Component({\n  tag: 'pds-filters',\n  styleUrl: 'pds-filters.scss',\n  shadow: true,\n})\nexport class PdsFilters implements BasePdsProps {\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId: string;\n\n  render() {\n    return (\n      <Host id={this.componentId}>\n        <div class=\"pds-filters\">\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kJAAA,IAAMA,EAAgB,iL,ICYTC,EAAUC,EAAA,yB,wBAMrBC,EAAAC,UAAAC,OAAA,WACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,GAAIC,KAAKC,aACbL,EAAK,OAAAE,IAAA,2CAAAI,MAAM,eACTN,EAAa,QAAAE,IAAA,8C,WAVA,I","ignoreList":[]}

package/dist/pine-core/p-f8e1545e.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["pdsTableCellCss","PdsTableCell","constructor","hostRef","this","scrollContainer","setupRetries","tableScrolling","handleScroll","scrollLeft","error","console","warn","componentWillRender","tableRef","hostElement","closest","componentDidLoad","responsive","fixedColumn","setupScrollListener","disconnectedCallback","cleanupScrollListener","container","_a","shadowRoot","querySelector","addEventListener","passive","setupTimer","window","setTimeout","removeEventListener","undefined","clearTimeout","classNames","compact","push","cellAlign","truncate","join","render","h","Host","key","class","role","part","style","selectable"],"sources":["src/components/pds-table/pds-table-cell/pds-table-cell.scss?tag=pds-table-cell&encapsulation=shadow","src/components/pds-table/pds-table-cell/pds-table-cell.tsx"],"sourcesContent":[":host {\n  --box-shadow-fixed: 3px 3px 6px -2px rgba(0, 0, 0, 0.2);\n\n  color: var(--pine-color-text);\n  display: table-cell;\n  font-family: var(--pine-font-family-body);\n  font-size: var(--pine-font-size);\n  font-weight: var(--pine-font-weight-regular);\n  inset-inline-start: var(--pine-dimension-none);\n  letter-spacing: var(--pine-letter-spacing);\n  line-height: var(--pine-line-height-body);\n  padding: var(--pine-dimension-sm);\n  vertical-align: inherit;\n}\n\n:host(.is-compact) {\n  padding-block: var(--pine-dimension-2xs)\n}\n\n:host(.is-fixed) {\n  background: var(--pine-color-background-container);\n  left: 0;\n  position: sticky;\n  z-index: var(--pine-z-index-raised);\n}\n\n// box shadow when table has scrolled and cell is fixed\n:host(.has-scrolled.is-fixed) {\n  box-shadow: var(--box-shadow-fixed);\n}\n\n:host(.is-truncated) {\n  max-width: 100px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n:host(.has-checkbox) {\n  vertical-align: middle;\n  width: 16px;\n}\n\n// Text Alignment\n:host(.pds-table-cell--align-start) {\n  text-align: start;\n}\n\n:host(.pds-table-cell--align-center) {\n  text-align: center;\n}\n\n:host(.pds-table-cell--align-end) {\n  text-align: end;\n}\n\n:host(.pds-table-cell--align-justify) {\n  text-align: justify;\n}\n","import { Component, Element, Host, Prop, State, h } from '@stencil/core';\n\n@Component({\n  tag: 'pds-table-cell',\n  styleUrls: ['pds-table-cell.scss'],\n  shadow: true,\n})\nexport class PdsTableCell {\n  @Element() hostElement: HTMLPdsTableCellElement;\n  private tableRef: HTMLPdsTableElement;\n  private scrollContainer: HTMLElement | null = null;\n  private setupTimer: number | undefined;\n  private setupRetries: number = 0;\n\n  componentWillRender() {\n    this.tableRef = this.hostElement.closest('pds-table') as HTMLPdsTableElement;\n  }\n\n  componentDidLoad() {\n    if (this.tableRef && this.tableRef.responsive && this.tableRef.fixedColumn) {\n      // For responsive tables with fixed columns, set up scroll detection\n      // This enables the first column to show a shadow when the table is scrolled horizontally\n      this.setupScrollListener();\n    }\n  }\n\n  disconnectedCallback() {\n    this.cleanupScrollListener();\n  }\n\n  private setupScrollListener() {\n    if (!this.tableRef) return;\n\n    // Query shadowRoot once and cache the container\n    const container = this.tableRef.shadowRoot?.querySelector('.pds-table-responsive-container') as HTMLElement;\n\n    if (container) {\n      // Container available immediately\n      this.scrollContainer = container;\n      this.scrollContainer.addEventListener('scroll', this.handleScroll, { passive: true });\n      this.handleScroll(); // Initial check\n      this.setupRetries = 0; // Reset counter on success\n    } else {\n      // Container not ready, set up timer for retry with bounds\n      this.setupTimer = window.setTimeout(() => {\n        if (this.scrollContainer) return; // Already found\n        this.setupRetries = (this.setupRetries || 0) + 1;\n        if (this.setupRetries <= 50) {\n          this.setupScrollListener();\n        } else {\n          console.warn('Failed to find responsive container after 50 attempts');\n        }\n      }, 100);\n    }\n  }\n\n  private cleanupScrollListener() {\n    if (this.scrollContainer) {\n      this.scrollContainer.removeEventListener('scroll', this.handleScroll);\n      this.scrollContainer = null;\n    }\n\n    if (this.setupTimer !== undefined) {\n      window.clearTimeout(this.setupTimer);\n      this.setupTimer = undefined;\n    }\n\n    this.setupRetries = 0; // Reset retry counter\n  }\n\n  /**\n   * Sets the text alignment within the cell.\n   */\n  @Prop() cellAlign?: 'start' | 'center' | 'end' | 'justify';\n\n  /**\n   * Truncates content to a max width of 100px and adds an ellipsis.\n   */\n  @Prop() truncate: boolean;\n\n  /**\n   * Determines if the table is currently scrolling.\n   * @defaultValue false\n   */\n  @State() private tableScrolling: boolean = false;\n\n  private classNames() {\n    const classNames = [];\n\n    if (this.tableRef && this.tableRef.compact) {\n      classNames.push('is-compact');\n    }\n\n    if (this.cellAlign) {\n      classNames.push(`pds-table-cell--align-${this.cellAlign}`);\n    }\n\n    if (this.truncate) {\n      classNames.push('is-truncated');\n    }\n\n    if (this.tableRef && this.tableRef.fixedColumn && this.tableScrolling) {\n      classNames.push('has-scrolled');\n    }\n\n    return classNames.join(' ');\n  }\n\n  /**\n   * Handles scroll events to update fixed column shadow state.\n   * Updates the tableScrolling state to control CSS classes for fixed column shadows.\n   * @private\n   */\n  private handleScroll = () => {\n    if (!this.scrollContainer) {\n      return;\n    }\n\n    try {\n      this.tableScrolling = this.scrollContainer.scrollLeft > 0;\n    } catch (error) {\n      console.warn('Scroll handler error:', error);\n    }\n  };\n\n  render() {\n    return (\n      <Host\n        class={this.classNames()}\n        role=\"gridcell\"\n        part=\"cell\"\n        style={\n          this.tableRef &&\n          this.tableRef.fixedColumn &&\n          this.tableRef.selectable\n            ? { '--fixed-cell-position': '40px' }\n            : {}\n          }\n        >\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAkB,qkC,MCOXC,EAAY,MALzB,WAAAC,CAAAC,G,UAQUC,KAAeC,gBAAuB,KAEtCD,KAAYE,aAAW,EAwEdF,KAAcG,eAAY,MA6BnCH,KAAYI,aAAG,KACrB,IAAKJ,KAAKC,gBAAiB,CACzB,M,CAGF,IACED,KAAKG,eAAiBH,KAAKC,gBAAgBI,WAAa,C,CACxD,MAAOC,GACPC,QAAQC,KAAK,wBAAyBF,E,EAsB3C,CAjIC,mBAAAG,GACET,KAAKU,SAAWV,KAAKW,YAAYC,QAAQ,Y,CAG3C,gBAAAC,GACE,GAAIb,KAAKU,UAAYV,KAAKU,SAASI,YAAcd,KAAKU,SAASK,YAAa,CAG1Ef,KAAKgB,qB,EAIT,oBAAAC,GACEjB,KAAKkB,uB,CAGC,mBAAAF,G,MACN,IAAKhB,KAAKU,SAAU,OAGpB,MAAMS,GAAYC,EAAApB,KAAKU,SAASW,cAAY,MAAAD,SAAA,SAAAA,EAAAE,cAAc,mCAE1D,GAAIH,EAAW,CAEbnB,KAAKC,gBAAkBkB,EACvBnB,KAAKC,gBAAgBsB,iBAAiB,SAAUvB,KAAKI,aAAc,CAAEoB,QAAS,OAC9ExB,KAAKI,eACLJ,KAAKE,aAAe,C,KACf,CAELF,KAAKyB,WAAaC,OAAOC,YAAW,KAClC,GAAI3B,KAAKC,gBAAiB,OAC1BD,KAAKE,cAAgBF,KAAKE,cAAgB,GAAK,EAC/C,GAAIF,KAAKE,cAAgB,GAAI,CAC3BF,KAAKgB,qB,KACA,CACLT,QAAQC,KAAK,wD,IAEd,I,EAIC,qBAAAU,GACN,GAAIlB,KAAKC,gBAAiB,CACxBD,KAAKC,gBAAgB2B,oBAAoB,SAAU5B,KAAKI,cACxDJ,KAAKC,gBAAkB,I,CAGzB,GAAID,KAAKyB,aAAeI,UAAW,CACjCH,OAAOI,aAAa9B,KAAKyB,YACzBzB,KAAKyB,WAAaI,S,CAGpB7B,KAAKE,aAAe,C,CAmBd,UAAA6B,GACN,MAAMA,EAAa,GAEnB,GAAI/B,KAAKU,UAAYV,KAAKU,SAASsB,QAAS,CAC1CD,EAAWE,KAAK,a,CAGlB,GAAIjC,KAAKkC,UAAW,CAClBH,EAAWE,KAAK,yBAAyBjC,KAAKkC,Y,CAGhD,GAAIlC,KAAKmC,SAAU,CACjBJ,EAAWE,KAAK,e,CAGlB,GAAIjC,KAAKU,UAAYV,KAAKU,SAASK,aAAef,KAAKG,eAAgB,CACrE4B,EAAWE,KAAK,e,CAGlB,OAAOF,EAAWK,KAAK,I,CAoBzB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAOzC,KAAK+B,aACZW,KAAK,WACLC,KAAK,OACLC,MACE5C,KAAKU,UACLV,KAAKU,SAASK,aACdf,KAAKU,SAASmC,WACV,CAAE,wBAAyB,QAC3B,IAGNP,EAAa,QAAAE,IAAA,6C","ignoreList":[]}

package/dist/pine-core/p-f911dde3.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["pdsAlertTokensCss","pdsAlertCss","PdsAlert","exports","class_1","hostRef","_this","this","small","dismissible","variant","hasActionsContent","handleCloseClick","pdsAlertDismissClick","emit","prototype","componentWillRender","actionsSlot","el","querySelector","renderActions","isSmall","h","class","gap","flex","undefined","name","renderContent","display","truncate","color","tag","render","iconMap","danger","default","info","success","warning","iconName","Host","key","id","componentId","concat","border","padding","icon","size","direction","heading","weight","type","onClick"],"sources":["src/components/pds-alert/pds-alert.tokens.scss?tag=pds-alert&encapsulation=shadow","src/components/pds-alert/pds-alert.scss?tag=pds-alert&encapsulation=shadow","src/components/pds-alert/pds-alert.tsx"],"sourcesContent":["@use '~@kajabi-ui/styles/dist/pine/components/pds-alert/pds-alert.tokens.css';\n",":host {\n  display: block;\n  line-height: 1;\n  width: 100%;\n}\n\n.pds-alert__container {\n  --pds-alert-icon-size: var(--pine-dimension-sm);\n  --pds-alert-border-dismiss-outline: 2px solid var(--pds-alert-color-dismiss);\n\n  --pds-alert-background: var(--pine-alert-color-background);\n  --pds-alert-border-color: var(--pine-alert-color-border);\n  --pds-alert-color-icon: var(--pine-alert-color-icon);\n  --pds-alert-color-text: var(--pine-alert-color-text);\n  --pds-alert-color-dismiss: var(--pine-alert-color-dismiss);\n  --pds-alert-background-dismiss-hover: var(--pine-alert-color-dismiss-hover);\n}\n\n.pds-alert__container--danger {\n  --pds-alert-background: var(--pine-alert-color-danger-background);\n  --pds-alert-border-color: var(--pine-alert-color-danger-border);\n  --pds-alert-color-icon: var(--pine-alert-color-danger-icon);\n  --pds-alert-color-text: var(--pine-alert-color-danger-text);\n  --pds-alert-color-dismiss: var(--pine-alert-color-danger-dismiss);\n  --pds-alert-background-dismiss-hover: var(--pine-alert-color-danger-dismiss-hover);\n}\n\n.pds-alert__container--info {\n  --pds-alert-background: var(--pine-alert-color-info-background);\n  --pds-alert-border-color: var(--pine-alert-color-info-border);\n  --pds-alert-color-icon: var(--pine-alert-color-info-icon);\n  --pds-alert-color-text: var(--pine-alert-color-info-text);\n  --pds-alert-color-dismiss: var(--pine-alert-color-info-dismiss);\n  --pds-alert-background-dismiss-hover: var(--pine-alert-color-info-dismiss-hover);\n}\n\n.pds-alert__container--success {\n  --pds-alert-background: var(--pine-alert-color-success-background);\n  --pds-alert-border-color: var(--pine-alert-color-success-border);\n  --pds-alert-color-icon: var(--pine-alert-color-success-icon);\n  --pds-alert-color-text: var(--pine-alert-color-success-text);\n  --pds-alert-color-dismiss: var(--pine-alert-color-success-dismiss);\n  --pds-alert-background-dismiss-hover: var(--pine-alert-color-success-dismiss-hover);\n}\n\n.pds-alert__container--warning {\n  --pds-alert-background: var(--pine-alert-color-warning-background);\n  --pds-alert-border-color: var(--pine-alert-color-warning-border);\n  --pds-alert-color-icon: var(--pine-alert-color-warning-icon);\n  --pds-alert-color-text: var(--pine-alert-color-warning-text);\n  --pds-alert-color-dismiss: var(--pine-alert-color-warning-dismiss);\n  --pds-alert-background-dismiss-hover: var(--pine-alert-color-warning-dismiss-hover);\n}\n\n.pds-alert__icon {\n  margin-block-start: var(--pine-dimension-2xs);\n}\n\n.pds-alert__icon--small {\n  margin-block-start: calc(var(--pine-dimension-2xs) / 2); // half the default icon margin\n}\n\n.pds-alert__content-wrapper {\n  flex: 1;\n  min-width: 0;\n  overflow: hidden;\n  width: 100%;\n}\n\n.pds-alert__dismiss {\n  align-items: center;\n  background: none;\n  border: 0;\n  border-radius: var(--pine-border-radius-full);\n  cursor: pointer;\n  display: flex;\n  height: var(--pine-dimension-250);\n  justify-content: center;\n  padding: var(--pine-dimension-xs);\n  width: var(--pine-dimension-250);\n}\n\n.pds-alert__dismiss:hover {\n  background: var(--pds-alert-background-dismiss-hover);\n  opacity: 0.8;\n}\n\n.pds-alert__dismiss:focus-visible {\n  outline: var(--pds-alert-border-dismiss-outline);\n}\n\n.pds-alert__description--small {\n  flex: 1 1 auto;\n  max-width: 100%;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.pds-alert__actions {\n  margin-block-start: var(--pine-dimension-sm);\n}\n\n.pds-alert__actions--small {\n  flex-shrink: 0;\n  margin-inline-start: auto;\n  white-space: nowrap;\n}\n","import { Component, Host, h, Prop, Event, EventEmitter, Element, State } from '@stencil/core';\n\n/**\n * @slot actions - Slot for alert actions.\n */\n\n@Component({\n  tag: 'pds-alert',\n  styleUrls: ['pds-alert.tokens.scss', 'pds-alert.scss'],\n  shadow: true,\n})\nexport class PdsAlert {\n\n  @Element() el: HTMLPdsAlertElement;\n\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId: string;\n\n  /**\n   * Text displayed as the heading of the alert.\n   */\n  @Prop() heading: string;\n\n  /**\n   * If true, the alert is displayed in a smaller size and description text is truncated. Heading is not displayed.\n   */\n  @Prop() small = false;\n\n  /**\n   * If true, shows the dismiss button. If false, the dismiss button is hidden.\n   * @defaultValue false\n   */\n  @Prop() dismissible = false;\n\n  /**\n   * Sets the style variant of the alert.\n   * @defaultValue 'default'\n   */\n  @Prop() variant: 'default' | 'danger' | 'info' | 'success' | 'warning' = 'default';\n\n  /**\n   * Event emitted when the dismiss button is clicked.\n   */\n  @Event() pdsAlertDismissClick: EventEmitter<void>;\n\n  @State() hasActionsContent = false;\n\n  private handleCloseClick = () => {\n    this.pdsAlertDismissClick.emit();\n  };\n\n  componentWillRender() {\n    // Check if the actions slot has any content.\n    // If not, hide the actions container to prevent empty space.\n    const actionsSlot = this.el.querySelector('[slot=\"actions\"]');\n    this.hasActionsContent = !!actionsSlot;\n  }\n\n  private renderActions(isSmall: boolean) {\n    return (\n      <pds-box class={isSmall ? \"pds-alert__actions--small\" : \"pds-alert__actions\"} gap=\"sm\" flex={isSmall ? \"none\" : undefined} align-items={isSmall ? undefined : \"center\"}>\n        <slot name=\"actions\"></slot>\n      </pds-box>\n    );\n  }\n\n  private renderContent() {\n    if (this.small) {\n      return (\n        <pds-box display=\"flex\" gap=\"md\" align-items=\"center\">\n          <pds-text\n            truncate={this.small}\n            class=\"pds-alert__description--small\"\n            color=\"var(--pds-alert-color-text)\"\n            tag=\"p\"\n          >\n            <slot></slot>\n          </pds-text>\n          {this.hasActionsContent && this.renderActions(true)}\n        </pds-box>\n      );\n    }\n\n    return (\n      <div>\n        <pds-text class=\"pds-alert__description\" color=\"var(--pds-alert-color-text)\" tag=\"p\">\n          <slot></slot>\n        </pds-text>\n        {this.hasActionsContent && this.renderActions(false)}\n      </div>\n    );\n  }\n\n  render() {\n    const iconMap = {\n      danger: 'warning-filled',\n      default: 'info-circle-filled',\n      info: 'info-circle-filled',\n      success: 'check-circle-filled',\n      warning: 'info-circle-filled',\n    };\n\n    // Get the icon name based on the current variant\n    const iconName = iconMap[this.variant] || iconMap.default;\n\n    return (\n      <Host class=\"pds-alert\" id={this.componentId} variant={this.variant}>\n        <pds-box\n          class={`pds-alert__container pds-alert__container--${this.variant}`}\n          background-color=\"var(--pds-alert-background)\"\n          border-color=\"var(--pds-alert-border-color)\"\n          border-radius=\"md\"\n          border\n          display=\"block\"\n          padding=\"md\"\n        >\n          <pds-box gap=\"sm\" display=\"flex\">\n            <pds-icon\n              class={`pds-alert__icon ${this.small ? 'pds-alert__icon--small' : ''}`}\n              color=\"var(--pds-alert-color-icon)\"\n              icon={iconName}\n              size=\"var(--pds-alert-icon-size)\"\n            />\n            <pds-box class=\"pds-alert__content-wrapper\" direction=\"column\" gap=\"xs\" flex=\"grow\">\n              {this.heading && !this.small && (\n                <pds-text class=\"pds-alert__heading\" color=\"var(--pds-alert-color-text)\" size=\"h5\" tag=\"h3\" weight=\"medium\">\n                  {this.heading}\n                </pds-text>\n              )}\n\n              {this.renderContent()}\n            </pds-box>\n\n            {this.dismissible && (\n              <button class=\"pds-alert__dismiss\" type=\"button\" aria-label=\"Dismiss alert\" onClick={this.handleCloseClick}>\n                <pds-icon icon=\"remove\" size=\"var(--pds-alert-icon-size)\" aria-hidden=\"true\" color=\"var(--pds-alert-color-dismiss)\" />\n              </button>\n            )}\n          </pds-box>\n        </pds-box>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kKAAA,IAAMA,EAAoB,2xDCA1B,IAAMC,EAAc,43G,ICWPC,EAAQC,EAAA,uBALrB,SAAAC,EAAAC,GAAA,IAAAC,EAAAC,K,mEAsBUA,KAAKC,MAAG,MAMRD,KAAWE,YAAG,MAMdF,KAAOG,QAA0D,UAOhEH,KAAiBI,kBAAG,MAErBJ,KAAgBK,iBAAG,WACzBN,EAAKO,qBAAqBC,MAC5B,CA8FD,CA5FCV,EAAAW,UAAAC,oBAAA,WAGE,IAAMC,EAAcV,KAAKW,GAAGC,cAAc,oBAC1CZ,KAAKI,oBAAsBM,C,EAGrBb,EAAAW,UAAAK,cAAA,SAAcC,GACpB,OACEC,EAAS,WAAAC,MAAOF,EAAU,4BAA8B,qBAAsBG,IAAI,KAAKC,KAAMJ,EAAU,OAASK,UAAwB,cAAAL,EAAUK,UAAY,UAC5JJ,EAAA,QAAMK,KAAK,Y,EAKTvB,EAAAW,UAAAa,cAAA,WACN,GAAIrB,KAAKC,MAAO,CACd,OACEc,EAAS,WAAAO,QAAQ,OAAOL,IAAI,KAAI,cAAa,UAC3CF,EAAA,YACEQ,SAAUvB,KAAKC,MACfe,MAAM,gCACNQ,MAAM,8BACNC,IAAI,KAEJV,EAAA,cAEDf,KAAKI,mBAAqBJ,KAAKa,cAAc,M,CAKpD,OACEE,EAAA,WACEA,EAAU,YAAAC,MAAM,yBAAyBQ,MAAM,8BAA8BC,IAAI,KAC/EV,EAAA,cAEDf,KAAKI,mBAAqBJ,KAAKa,cAAc,O,EAKpDhB,EAAAW,UAAAkB,OAAA,WACE,IAAMC,EAAU,CACdC,OAAQ,iBACRC,QAAS,qBACTC,KAAM,qBACNC,QAAS,sBACTC,QAAS,sBAIX,IAAMC,EAAWN,EAAQ3B,KAAKG,UAAYwB,EAAQE,QAElD,OACEd,EAACmB,EAAI,CAAAC,IAAA,2CAACnB,MAAM,YAAYoB,GAAIpC,KAAKqC,YAAalC,QAASH,KAAKG,SAC1DY,EACE,WAAAoB,IAAA,2CAAAnB,MAAO,8CAAAsB,OAA8CtC,KAAKG,SACzC,iDACJ,+CAA+B,gBAC9B,KACdoC,OACA,KAAAjB,QAAQ,QACRkB,QAAQ,MAERzB,EAAA,WAAAoB,IAAA,2CAASlB,IAAI,KAAKK,QAAQ,QACxBP,EACE,YAAAoB,IAAA,2CAAAnB,MAAO,mBAAAsB,OAAmBtC,KAAKC,MAAQ,yBAA2B,IAClEuB,MAAM,8BACNiB,KAAMR,EACNS,KAAK,+BAEP3B,EAAA,WAAAoB,IAAA,2CAASnB,MAAM,6BAA6B2B,UAAU,SAAS1B,IAAI,KAAKC,KAAK,QAC1ElB,KAAK4C,UAAY5C,KAAKC,OACrBc,EAAA,YAAAoB,IAAA,2CAAUnB,MAAM,qBAAqBQ,MAAM,8BAA8BkB,KAAK,KAAKjB,IAAI,KAAKoB,OAAO,UAChG7C,KAAK4C,SAIT5C,KAAKqB,iBAGPrB,KAAKE,aACJa,EAAQ,UAAAoB,IAAA,2CAAAnB,MAAM,qBAAqB8B,KAAK,SAAQ,aAAY,gBAAgBC,QAAS/C,KAAKK,kBACxFU,EAAU,YAAAoB,IAAA,2CAAAM,KAAK,SAASC,KAAK,6BAA4B,cAAa,OAAOlB,MAAM,sC,uHA9H9E,I","ignoreList":[]}

package/dist/pine-core/p-fc2f3466.system.entry.js

@@ -1,2 +0,0 @@
-var __awaiter=this&&this.__awaiter||function(e,r,i,n){function t(e){return e instanceof i?e:new i((function(r){r(e)}))}return new(i||(i=Promise))((function(i,o){function d(e){try{a(n.next(e))}catch(e){o(e)}}function s(e){try{a(n["throw"](e))}catch(e){o(e)}}function a(e){e.done?i(e.value):t(e.value).then(d,s)}a((n=n.apply(e,r||[])).next())}))};var __generator=this&&this.__generator||function(e,r){var i={label:0,sent:function(){if(o[0]&1)throw o[1];return o[1]},trys:[],ops:[]},n,t,o,d;return d={next:s(0),throw:s(1),return:s(2)},typeof Symbol==="function"&&(d[Symbol.iterator]=function(){return this}),d;function s(e){return function(r){return a([e,r])}}function a(s){if(n)throw new TypeError("Generator is already executing.");while(d&&(d=0,s[0]&&(i=0)),i)try{if(n=1,t&&(o=s[0]&2?t["return"]:s[0]?t["throw"]||((o=t["return"])&&o.call(t),0):t.next)&&!(o=o.call(t,s[1])).done)return o;if(t=0,o)s=[s[0]&2,o.value];switch(s[0]){case 0:case 1:o=s;break;case 4:i.label++;return{value:s[1],done:false};case 5:i.label++;t=s[1];s=[0];continue;case 7:s=i.ops.pop();i.trys.pop();continue;default:if(!(o=i.trys,o=o.length>0&&o[o.length-1])&&(s[0]===6||s[0]===2)){i=0;continue}if(s[0]===3&&(!o||s[1]>o[0]&&s[1]<o[3])){i.label=s[1];break}if(s[0]===6&&i.label<o[1]){i.label=o[1];o=s;break}if(o&&i.label<o[2]){i.label=o[2];i.ops.push(s);break}if(o[2])i.ops.pop();i.trys.pop();continue}s=r.call(e,i)}catch(e){s=[6,e];t=0}finally{n=o=0}if(s[0]&5)throw s[1];return{value:s[0]?s[1]:void 0,done:true}}};System.register(["./p-Cxvdulqq.system.js","./p-BHavepTY.system.js","./p-BhQhw0S3.system.js","./p-BG6uGRQj.system.js","./p-BG99uNIQ.system.js"],(function(e){"use strict";var r,i,n,t,o,d,s,a,p,l;return{setters:[function(e){r=e.r;i=e.c;n=e.h;t=e.H;o=e.g},function(e){d=e.a;s=e.m},function(e){a=e.i},function(e){p=e.d},function(e){l=e.i}],execute:function(){var u=":host{--pine-input-color-background-danger:var(--pine-color-red-050)}";var c=":host{display:inline-block}:host([aria-disabled=true]) label{color:var(--pine-color-text-label-disabled)}:host([aria-readonly=true]) label{color:var(--pine-color-text-label-readonly)}label{color:var(--pine-color-text-label);font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing)}";var h=":host{--pds-input-background:var(--pine-color-background-container);--pds-input-border-color:var(--pine-color-border);--pds-input-border-color-hover:var(--pine-color-border-hover);--pds-input-border-color-disabled:var(--pine-color-border-disabled);--pds-input-border-radius:var(--pine-dimension-125);--pds-input-border-width:var(--pine-border-width-thin);--pds-input-padding-x:var(--pine-dimension-150);--pds-input-padding-y:calc(var(--pine-dimension-xs) - var(--pine-border-width));--pds-input-font:var(--pine-typography-body);--pds-input-text-color:var(--pine-color-text-active);--pds-input-placeholder-color:var(--pine-color-text-placeholder);--pds-input-icon-color:var(--pine-color-text-secondary);--pds-input-disabled-background:var(--pine-color-background-container-disabled);--pds-input-disabled-text-color:var(--pine-color-text-disabled);--pds-input-error-color:var(--pine-color-text-message-danger);--pds-input-error-background:var(--pine-input-color-background-danger);--pds-input-error-border:var(--pine-color-border-danger);--pds-input-error-border-hover:var(--pine-color-border-danger-hover);--pds-input-addon-background:var(--pine-color-background-subtle);--pds-input-addon-color:var(--pine-color-text-secondary);--pds-input-field-min-height:var(--pine-dimension-450);--box-shadow-focus:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);--box-shadow-focus-error:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring-danger);display:inline}:host pds-select::part(select){background-color:var(--pds-input-error-background);border-color:var(--pds-input-error-border)}:host::part(prefix),:host::part(suffix){-ms-flex-align:center;align-items:center;color:var(--pine-color-text-label-readonly);display:-ms-flexbox;display:flex;height:100%;position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);white-space:nowrap;z-index:var(--pine-z-index-raised)}:host::part(prefix){border-end-start-radius:var(--pds-input-border-radius);-webkit-border-end:var(--pine-border-width-none);border-inline-end:var(--pine-border-width-none);border-start-start-radius:var(--pds-input-border-radius);left:var(--pds-input-padding-x)}:host::part(suffix){border-end-end-radius:var(--pds-input-border-radius);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);border-start-end-radius:var(--pds-input-border-radius);right:var(--pds-input-padding-x)}:host::part(prepend),:host::part(append){-ms-flex-align:center;align-items:center;background-color:var(--pds-input-addon-background);border:var(--pds-input-border-width) solid var(--pds-input-border-color);color:var(--pds-input-addon-color);display:-ms-flexbox;display:flex;overflow:visible}:host::part(prepend){border-end-start-radius:var(--pds-input-border-radius);-webkit-border-end:var(--pine-border-width-none);border-inline-end:var(--pine-border-width-none);border-start-start-radius:var(--pds-input-border-radius)}:host::part(append){border-end-end-radius:var(--pds-input-border-radius);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);border-start-end-radius:var(--pds-input-border-radius)}:host([has-prepend]) ::slotted(pds-button[slot=prepend]){--pds-button-background:var(--pds-input-addon-background);--pds-button-border:var(--pine-border-width-none);--pds-button-border-radius:var(--pine-dimension-none);--pds-button-border-radius-end-end:var(--pine-dimension-none);--pds-button-border-radius-start-end:var(--pine-dimension-none);--pds-button-border-radius-start-start:var(--pds-input-border-radius);--pds-button-border-radius-end-start:var(--pds-input-border-radius);--pds-button-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));--pds-button-box-shadow-focus:0 0 0 3px var(--pine-color-focus-ring);--pds-button-outline-focus:none}:host([has-append]) ::slotted(pds-button[slot=append]){--pds-button-background:var(--pds-input-addon-background);--pds-button-border:var(--pine-border-width-none);--pds-button-border-radius:var(--pine-dimension-none);--pds-button-border-radius-end-start:var(--pine-dimension-none);--pds-button-border-radius-start-start:var(--pine-dimension-none);--pds-button-border-radius-start-end:var(--pds-input-border-radius);--pds-button-border-radius-end-end:var(--pds-input-border-radius);--pds-button-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));--pds-button-box-shadow-focus:0 0 0 3px var(--pine-color-focus-ring);--pds-button-outline-focus:none}:host([has-prepend]) ::slotted(pds-select[slot=prepend]){--pds-select-background:var(--pds-input-addon-background);--pds-select-border:var(--pine-border-width-none);--pds-select-border-radius-end-end:var(--pine-dimension-none);--pds-select-border-radius-start-end:var(--pine-dimension-none);--pds-select-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)))}:host([has-append]) ::slotted(pds-select[slot=append]){--pds-select-background:var(--pds-input-addon-background);--pds-select-border:var(--pine-border-width-none);--pds-select-border-radius-end-start:var(--pine-dimension-none);--pds-select-border-radius-start-start:var(--pine-dimension-none);--pds-select-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)))}:host([aria-readonly=true]) input{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-readonly)}:host([disabled=true])::part(prepend),:host([disabled=true])::part(append){background-color:var(--pds-input-disabled-background);border:var(--pds-input-border-width) solid var(--pds-input-border-color-disabled)}:host([full-width=true]){width:100%}:host([invalid=true])::part(prepend),:host([invalid=true])::part(append){background-color:var(--pds-input-error-background);border:var(--pds-input-border-width) solid var(--pds-input-error-border)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true])){--pds-input-background:var(--pine-color-accent-disabled);--pds-input-border-color:var(--pine-color-accent);--pds-input-border-color-hover:var(--pine-color-accent-hover);--pds-input-text-color:var(--pine-color-text-accent)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true]))::part(prefix),:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true]))::part(suffix){color:var(--pine-color-text-accent)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true])) .pds-input__field:focus-visible{outline-color:var(--pine-color-focus-ring)}.pds-input{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.pds-input__label-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-input__label{color:var(--pine-color-text-active);-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-input__label-wrapper .pds-input__label{-webkit-margin-after:0;margin-block-end:0}.pds-input__action{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);-webkit-margin-start:var(--pine-dimension-xs);margin-inline-start:var(--pine-dimension-xs)}.pds-input__field-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;position:relative;width:100%}.pds-input__field-wrapper.has-prefix .pds-input__field{-webkit-padding-start:calc(2 * var(--pds-input-padding-x) + var(--prefix-width, 1em));padding-inline-start:calc(2 * var(--pds-input-padding-x) + var(--prefix-width, 1em))}.pds-input__field-wrapper.has-suffix .pds-input__field{-webkit-padding-end:calc(2 * var(--pds-input-padding-x) + var(--suffix-width, 1em));padding-inline-end:calc(2 * var(--pds-input-padding-x) + var(--suffix-width, 1em))}.pds-input__field-wrapper.has-prepend .pds-input__field{border-end-start-radius:var(--pine-dimension-none);border-start-start-radius:var(--pine-dimension-none)}.pds-input__field-wrapper.has-append .pds-input__field{border-end-end-radius:var(--pine-dimension-none);border-start-end-radius:var(--pine-dimension-none)}.pds-input__field{background:var(--pds-input-background);border:var(--pds-input-border-width) solid var(--pds-input-border-color);border-radius:var(--pds-input-border-radius);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--pds-input-text-color);-ms-flex:1;flex:1;font:var(--pds-input-font);letter-spacing:var(--pine-letter-spacing);min-height:var(--pds-input-field-min-height);min-width:var(--pine-dimension-none);padding:var(--pds-input-padding-y) var(--pds-input-padding-x);-webkit-transition:border-color 0.2s ease;transition:border-color 0.2s ease;width:100%}.pds-input__field:hover:not(:disabled){border-color:var(--pds-input-border-color-hover)}.pds-input__field:disabled{background:var(--pds-input-disabled-background);border-color:var(--pine-color-border-disabled);color:var(--pds-input-disabled-text-color);cursor:not-allowed}.pds-input__field:disabled::-webkit-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::-moz-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled:-ms-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::-ms-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::placeholder{color:var(--pine-color-text-placeholder-disabled)}.has-error .pds-input__field:hover:not(:disabled){border-color:var(--pds-input-error-border-hover)}.pds-input__field:focus-visible:not(.has-error){border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width);position:relative;z-index:1}:host([has-prepend]) .pds-input__field:focus-visible:not(.has-error),:host([has-append]) .pds-input__field:focus-visible:not(.has-error),:host([has-prefix]) .pds-input__field:focus-visible:not(.has-error),:host([has-suffix]) .pds-input__field:focus-visible:not(.has-error){outline-offset:var(--pine-dimension-none)}.pds-input__field::-webkit-input-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field::-moz-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field:-ms-input-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field::-ms-input-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field::placeholder{color:var(--pds-input-placeholder-color)}.has-error .pds-input__field{background-color:var(--pds-input-error-background);border-color:var(--pds-input-error-border)}.has-error .pds-input__field:focus-visible{outline-color:var(--pine-color-focus-ring-danger);position:relative;z-index:1}.pds-input__error-message,.pds-input__helper-message{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm);-webkit-margin-after:var(--pine-dimension-none);margin-block-end:var(--pine-dimension-none);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-input__error-message{-ms-flex-align:center;align-items:center;color:var(--pds-input-error-color);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}";var b=e("pds_input",function(){function e(e){var n=this;r(this,e);this.pdsBlur=i(this,"pdsBlur");this.pdsChange=i(this,"pdsChange");this.pdsFocus=i(this,"pdsFocus");this.pdsInput=i(this,"pdsInput");this.inheritedAttributes={};this.isComposing=false;this.hasPrefix=false;this.hasSuffix=false;this.hasPrepend=false;this.hasAppend=false;this.hasAction=false;this.type="text";this.value="";this.hasFocus=false;this.onInputEvent=function(e){var r=e.target;if(r){n.value=r.value||""}n.emitInputChange(e)};this.onChangeEvent=function(e){n.emitValueChange(e)};this.onBlurEvent=function(e){n.hasFocus=false;if(n.focusedValue!==n.value){n.emitValueChange(e)}n.pdsBlur.emit(e)};this.onFocusEvent=function(e){n.hasFocus=true;n.focusedValue=n.value;n.pdsFocus.emit(e)};this.onCompositionStart=function(){n.isComposing=true};this.onCompositionEnd=function(){n.isComposing=false}}e.prototype.setFocus=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){if(this.nativeInput){this.nativeInput.focus()}return[2]}))}))};e.prototype.updateAddonWidths=function(){var e=this;requestAnimationFrame((function(){if(e.prefixEl){var r=e.prefixEl.offsetWidth;e.el.style.setProperty("--prefix-width","".concat(r,"px"))}if(e.suffixEl){var i=e.suffixEl.offsetWidth;e.el.style.setProperty("--suffix-width","".concat(i,"px"))}}))};e.prototype.renderPrefix=function(){var e=this;var r=this.el.querySelector('[slot="prefix"]')!==null;if(r){return n("div",{class:"pds-input__prefix",part:"prefix",ref:function(r){return e.prefixEl=r}},n("slot",{name:"prefix",onSlotchange:function(){return e.updateAddonWidths()}}))}return null};e.prototype.renderSuffix=function(){var e=this;var r=this.el.querySelector('[slot="suffix"]')!==null;if(r){return n("div",{class:"pds-input__suffix",part:"suffix",ref:function(r){return e.suffixEl=r}},n("slot",{name:"suffix",onSlotchange:function(){return e.updateAddonWidths()}}))}return null};e.prototype.renderPrepend=function(){var e=this.el.querySelector('[slot="prepend"]')!==null;if(e){return n("div",{class:"pds-input__prepend",part:"prepend"},n("slot",{name:"prepend"}))}return null};e.prototype.renderAppend=function(){var e=this.el.querySelector('[slot="append"]')!==null;if(e){return n("div",{class:"pds-input__append",part:"append"},n("slot",{name:"append"}))}return null};e.prototype.renderAction=function(){var e=this.el.querySelector('[slot="action"]')!==null;if(e){return n("div",{class:"pds-input__action",part:"action"},n("slot",{name:"action"}))}return null};e.prototype.componentWillLoad=function(){this.inheritedAttributes=Object.assign({},a(this.el));this.hasPrefix=this.el.querySelector('[slot="prefix"]')!==null;this.hasSuffix=this.el.querySelector('[slot="suffix"]')!==null;this.hasPrepend=this.el.querySelector('[slot="prepend"]')!==null;this.hasAppend=this.el.querySelector('[slot="append"]')!==null;this.hasAction=this.el.querySelector('[slot="action"]')!==null;this.originalPdsInput=this.pdsInput};e.prototype.connectedCallback=function(){if(this.el.attachInternals){this.internals=this.el.attachInternals()}};e.prototype.componentDidLoad=function(){this.debounceChanged();this.updateAddonWidths();this.updateFormValue()};e.prototype.componentDidUpdate=function(){this.updateAddonWidths()};e.prototype.debounceChanged=function(){var e=this,r=e.pdsInput,i=e.debounce,n=e.originalPdsInput;this.pdsInput=i===undefined?n!==null&&n!==void 0?n:r:p(r,i)};e.prototype.valueChanged=function(){var e=this.nativeInput;var r=this.getValue();if(e&&e.value!==r&&!this.isComposing){e.value=r}this.updateFormValue()};e.prototype.getValue=function(){return typeof this.value==="number"?this.value.toString():(this.value||"").toString()};e.prototype.emitValueChange=function(e){var r=this.value;var i=r==null?r:r.toString();this.focusedValue=i;this.pdsChange.emit({value:i,event:e})};e.prototype.emitInputChange=function(e){var r=this.value;var i=r==null?r:r.toString();this.pdsInput.emit({value:i,event:e})};e.prototype.updateFormValue=function(){if(this.internals&&this.internals.setFormValue){var e=this.getValue();this.internals.setFormValue(e||null);if(this.nativeInput&&this.internals&&this.internals.setValidity){this.internals.setValidity(this.nativeInput.validity,this.nativeInput.validationMessage,this.nativeInput)}}};e.prototype.formResetCallback=function(){this.value="";this.updateFormValue()};e.prototype.formDisabledCallback=function(e){this.disabled=e};e.prototype.formStateRestoreCallback=function(e){if(typeof e==="string"){this.value=e}else if(e instanceof FormData&&this.name){var r=e.get(this.name);if(typeof r==="string"){this.value=r}}};e.prototype.render=function(){var e=this;var r=this,i=r.componentId,o=r.disabled,a=r.errorMessage,p=r.helperMessage,u=r.invalid,c=u===void 0?false:u,h=r.label;var b=this.getValue();var f={"pds-input__field-wrapper":true,"has-focus":this.hasFocus,"has-error":c||!!a,"is-disabled":o,"has-prefix":this.hasPrefix,"has-suffix":this.hasSuffix,"has-prepend":this.hasPrepend,"has-append":this.hasAppend};return n(t,{key:"0d467b2414d99894effb67209c034f6623f9776b","aria-disabled":this.disabled?"true":null,"aria-readonly":this.readonly?"true":null,"has-prefix":this.hasPrefix?"true":null,"has-suffix":this.hasSuffix?"true":null,"has-prepend":this.hasPrepend?"true":null,"has-append":this.hasAppend?"true":null,"has-action":this.hasAction&&!this.hideLabel?"true":null,"full-width":this.fullWidth?"true":null},n("div",{key:"8d16365611e4831c18e1b86900f7c122562cd846",class:"pds-input"},h&&n("div",{key:"8855edd2da8d1f684fd67f901a159fb6d3db58d9",class:"pds-input__label-wrapper"},n("label",{key:"c761a6f511d01b24f177eff1db27dd96cea2b939",htmlFor:i,class:"pds-input__label"},n("span",{key:"e3f8f7e71c7e49b138b3b10c07efa2a90a7de22e",class:this.hideLabel?"visually-hidden":""},h,this.required&&n("span",{key:"94e0d362bdf53a7d8e5efb0b3b1f0ba8b9588a74",class:"pds-input__required-indicator"}," *"))),!this.hideLabel&&this.renderAction()),n("div",{key:"3625024f654df87566cd76521d5fd6e1fda7004e",class:f},this.renderPrepend(),this.renderPrefix(),n("input",Object.assign({key:"271e4fd1004c65c8463a4508324f45d341c36414",ref:function(r){return e.nativeInput=r},class:"pds-input__field","aria-describedby":d(i,c,p),"aria-invalid":c?"true":undefined,autocomplete:this.autocomplete,disabled:o,id:i,max:this.max,maxlength:this.maxlength,min:this.min,minlength:this.minlength,name:this.name,pattern:this.pattern,placeholder:this.placeholder,readOnly:this.readonly,required:this.required,step:this.step,type:this.type,value:b,onInput:this.onInputEvent,onChange:this.onChangeEvent,onBlur:this.onBlurEvent,onFocus:this.onFocusEvent,onCompositionstart:this.onCompositionStart,onCompositionend:this.onCompositionEnd},this.inheritedAttributes)),this.renderSuffix(),this.renderAppend()),p&&n("p",{key:"64e2efb4ed95507d9bcf54c3616780af58c05675",class:"pds-input__helper-message",id:s(i,"helper")},p),a&&n("p",{key:"3ab683996ffa0331a108e028979b172078b4c6ef",class:"pds-input__error-message",id:s(i,"error")},n("pds-icon",{key:"c8b357bd7757ae50d665928b9130b14128860721",icon:l,size:"small"}),a)))};Object.defineProperty(e,"formAssociated",{get:function(){return true},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"el",{get:function(){return o(this)},enumerable:false,configurable:true});Object.defineProperty(e,"watchers",{get:function(){return{debounce:["debounceChanged"],value:["valueChanged"]}},enumerable:false,configurable:true});return e}());b.style=u+(c+h)}}}));
-//# sourceMappingURL=p-fc2f3466.system.entry.js.map

package/dist/pine-core/p-fc2f3466.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["pdsInputTokensCss","labelCss","pdsInputCss","PdsInput","exports","class_1","hostRef","_this","this","inheritedAttributes","isComposing","hasPrefix","hasSuffix","hasPrepend","hasAppend","hasAction","type","value","hasFocus","onInputEvent","ev","input","target","emitInputChange","onChangeEvent","emitValueChange","onBlurEvent","focusedValue","pdsBlur","emit","onFocusEvent","pdsFocus","onCompositionStart","onCompositionEnd","prototype","setFocus","nativeInput","focus","updateAddonWidths","requestAnimationFrame","prefixEl","prefixWidth","offsetWidth","el","style","setProperty","concat","suffixEl","suffixWidth","renderPrefix","querySelector","h","class","part","ref","name","onSlotchange","renderSuffix","renderPrepend","renderAppend","renderAction","componentWillLoad","Object","assign","inheritAriaAttributes","originalPdsInput","pdsInput","connectedCallback","attachInternals","internals","componentDidLoad","debounceChanged","updateFormValue","componentDidUpdate","_a","debounce","undefined","debounceEvent","valueChanged","getValue","toString","event","newValue","pdsChange","setFormValue","setValidity","validity","validationMessage","formResetCallback","formDisabledCallback","disabled","formStateRestoreCallback","state","FormData","get","render","componentId","errorMessage","helperMessage","_b","invalid","label","inputWrapperClasses","Host","key","readonly","hideLabel","fullWidth","htmlFor","required","assignDescription","autocomplete","id","max","maxlength","min","minlength","pattern","placeholder","readOnly","step","onInput","onChange","onBlur","onFocus","onCompositionstart","onCompositionend","messageId","icon","danger","size"],"sources":["src/components/pds-input/pds-input.tokens.scss?tag=pds-input&encapsulation=shadow","src/global/styles/utils/label.scss?tag=pds-input&encapsulation=shadow","src/components/pds-input/pds-input.scss?tag=pds-input&encapsulation=shadow","src/components/pds-input/pds-input.tsx"],"sourcesContent":["@use '~@kajabi-ui/styles/dist/pine/components/pds-input/pds-input.tokens'\n",":host {\n  display: inline-block;\n}\n\n:host([aria-disabled=\"true\"]) label {\n  color: var(--pine-color-text-label-disabled);\n}\n\n:host([aria-readonly=\"true\"]) {\n  label {\n    color: var(--pine-color-text-label-readonly);\n  }\n}\n\nlabel {\n  color: var(--pine-color-text-label);\n  font: var(--pine-typography-body-medium);\n  letter-spacing: var(--pine-letter-spacing);\n}\n",":host {\n  --pds-input-background: var(--pine-color-background-container);\n  --pds-input-border-color: var(--pine-color-border);\n  --pds-input-border-color-hover: var(--pine-color-border-hover);\n  --pds-input-border-color-disabled: var(--pine-color-border-disabled);\n\n  --pds-input-border-radius: var(--pine-dimension-125);\n  --pds-input-border-width: var(--pine-border-width-thin);\n  --pds-input-padding-x: var(--pine-dimension-150);\n  --pds-input-padding-y: calc(var(--pine-dimension-xs) - var(--pine-border-width));\n  --pds-input-font: var(--pine-typography-body);\n  --pds-input-text-color: var(--pine-color-text-active);\n  --pds-input-placeholder-color: var(--pine-color-text-placeholder);\n  --pds-input-icon-color: var(--pine-color-text-secondary);\n  --pds-input-disabled-background: var(--pine-color-background-container-disabled);\n  --pds-input-disabled-text-color: var(--pine-color-text-disabled);\n  --pds-input-error-color: var(--pine-color-text-message-danger);\n  --pds-input-error-background: var(--pine-input-color-background-danger);\n  --pds-input-error-border: var(--pine-color-border-danger);\n  --pds-input-error-border-hover: var(--pine-color-border-danger-hover);\n  --pds-input-addon-background: var(--pine-color-background-subtle);\n  --pds-input-addon-color: var(--pine-color-text-secondary);\n  --pds-input-field-min-height: var(--pine-dimension-450);\n  --box-shadow-focus: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);\n  --box-shadow-focus-error: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring-danger);\n\n  display: inline;\n\n  pds-select::part(select) {\n    background-color: var(--pds-input-error-background);\n    border-color: var(--pds-input-error-border);\n  }\n\n  &::part(prefix),\n  &::part(suffix) {\n    align-items: center;\n    color: var(--pine-color-text-label-readonly);\n    display: flex;\n    height: 100%;\n    position: absolute;\n    top: 50%;\n    transform: translateY(-50%);\n    white-space: nowrap;\n    z-index: var(--pine-z-index-raised);\n  }\n\n  &::part(prefix) {\n    border-end-start-radius: var(--pds-input-border-radius);\n    border-inline-end: var(--pine-border-width-none);\n    border-start-start-radius: var(--pds-input-border-radius);\n    left: var(--pds-input-padding-x);\n  }\n\n  &::part(suffix) {\n    border-end-end-radius: var(--pds-input-border-radius);\n    border-inline-start: var(--pine-border-width-none);\n    border-start-end-radius: var(--pds-input-border-radius);\n    right: var(--pds-input-padding-x);\n  }\n\n  &::part(prepend),\n  &::part(append) {\n    align-items: center;\n    background-color: var(--pds-input-addon-background);\n    border: var(--pds-input-border-width) solid var(--pds-input-border-color);\n    color: var(--pds-input-addon-color);\n    display: flex;\n    overflow: visible;\n  }\n\n  &::part(prepend) {\n    border-end-start-radius: var(--pds-input-border-radius);\n    border-inline-end: var(--pine-border-width-none);\n    border-start-start-radius: var(--pds-input-border-radius);\n  }\n\n  &::part(append) {\n    border-end-end-radius: var(--pds-input-border-radius);\n    border-inline-start: var(--pine-border-width-none);\n    border-start-end-radius: var(--pds-input-border-radius);\n  }\n}\n\n/* stylelint-disable-next-line */\n:host([has-prepend]) ::slotted(pds-button[slot=\"prepend\"]) {\n  --pds-button-background: var(--pds-input-addon-background);\n  --pds-button-border: var(--pine-border-width-none);\n  --pds-button-border-radius: var(--pine-dimension-none);\n  --pds-button-border-radius-end-end: var(--pine-dimension-none);\n  --pds-button-border-radius-start-end: var(--pine-dimension-none);\n  --pds-button-border-radius-start-start: var(--pds-input-border-radius);\n  --pds-button-border-radius-end-start: var(--pds-input-border-radius);\n  --pds-button-min-height: calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));\n  --pds-button-box-shadow-focus: 0 0 0 3px var(--pine-color-focus-ring);\n  --pds-button-outline-focus: none;\n}\n\n/* stylelint-disable-next-line */\n:host([has-append]) ::slotted(pds-button[slot=\"append\"]) {\n  --pds-button-background: var(--pds-input-addon-background);\n  --pds-button-border: var(--pine-border-width-none);\n  --pds-button-border-radius: var(--pine-dimension-none);\n  --pds-button-border-radius-end-start: var(--pine-dimension-none);\n  --pds-button-border-radius-start-start: var(--pine-dimension-none);\n  --pds-button-border-radius-start-end: var(--pds-input-border-radius);\n  --pds-button-border-radius-end-end: var(--pds-input-border-radius);\n  --pds-button-min-height: calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));\n  --pds-button-box-shadow-focus: 0 0 0 3px var(--pine-color-focus-ring);\n  --pds-button-outline-focus: none;\n}\n\n/* stylelint-disable-next-line */\n:host([has-prepend]) ::slotted(pds-select[slot=\"prepend\"]) {\n  --pds-select-background: var(--pds-input-addon-background);\n  --pds-select-border: var(--pine-border-width-none);\n  --pds-select-border-radius-end-end: var(--pine-dimension-none);\n  --pds-select-border-radius-start-end: var(--pine-dimension-none);\n  --pds-select-min-height: calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));\n}\n\n/* stylelint-disable-next-line */\n:host([has-append]) ::slotted(pds-select[slot=\"append\"]) {\n  --pds-select-background: var(--pds-input-addon-background);\n  --pds-select-border: var(--pine-border-width-none);\n  --pds-select-border-radius-end-start: var(--pine-dimension-none);\n  --pds-select-border-radius-start-start: var(--pine-dimension-none);\n  --pds-select-min-height: calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));\n}\n\n:host([aria-readonly=\"true\"]) {\n  input {\n    background-color: var(--pine-color-background-container-disabled);\n    color: var(--pine-color-text-readonly);\n  }\n}\n\n:host([disabled=\"true\"]) {\n  &::part(prepend),\n  &::part(append) {\n    background-color: var(--pds-input-disabled-background);\n    border: var(--pds-input-border-width) solid var(--pds-input-border-color-disabled);\n  }\n}\n\n:host([full-width=\"true\"]) {\n  width: 100%;\n}\n\n:host([invalid=\"true\"]) {\n  &::part(prepend),\n  &::part(append) {\n    background-color: var(--pds-input-error-background);\n    border: var(--pds-input-border-width) solid var(--pds-input-error-border);\n  }\n}\n\n:host([highlight]:not([disabled]):not([aria-disabled=\"true\"]):not([invalid]):not([aria-readonly=\"true\"])) {\n  --pds-input-background: var(--pine-color-accent-disabled);\n  --pds-input-border-color: var(--pine-color-accent);\n  --pds-input-border-color-hover: var(--pine-color-accent-hover);\n  --pds-input-text-color: var(--pine-color-text-accent);\n\n  &::part(prefix),\n  &::part(suffix) {\n    color: var(--pine-color-text-accent);\n  }\n\n  .pds-input__field:focus-visible {\n    outline-color: var(--pine-color-focus-ring);\n  }\n}\n\n.pds-input {\n  display: flex;\n  flex-direction: column;\n}\n\n.pds-input__label-wrapper {\n  align-items: center;\n  display: flex;\n  justify-content: space-between;\n  margin-block-end: var(--pine-dimension-2xs);\n}\n\n.pds-input__label {\n  color: var(--pine-color-text-active);\n  margin-block-end: var(--pine-dimension-2xs);\n}\n\n// When label is inside wrapper, remove its margin\n.pds-input__label-wrapper .pds-input__label {\n  margin-block-end: 0;\n}\n\n.pds-input__action {\n  align-items: center;\n  display: flex;\n  gap: var(--pine-dimension-xs);\n  margin-inline-start: var(--pine-dimension-xs);\n}\n\n.pds-input__field-wrapper {\n  align-items: center;\n  display: flex;\n  position: relative;\n  width: 100%;\n\n  &.has-prefix .pds-input__field {\n    padding-inline-start: calc(2 * var(--pds-input-padding-x) + var(--prefix-width, 1em));\n  }\n\n  &.has-suffix .pds-input__field {\n    padding-inline-end: calc(2 * var(--pds-input-padding-x) + var(--suffix-width, 1em));\n  }\n\n  &.has-prepend .pds-input__field {\n    border-end-start-radius: var(--pine-dimension-none);\n    border-start-start-radius: var(--pine-dimension-none);\n  }\n\n  &.has-append .pds-input__field {\n    border-end-end-radius: var(--pine-dimension-none);\n    border-start-end-radius: var(--pine-dimension-none);\n  }\n}\n\n.pds-input__field {\n  background: var(--pds-input-background);\n  border: var(--pds-input-border-width) solid var(--pds-input-border-color);\n  border-radius: var(--pds-input-border-radius);\n  box-sizing: border-box;\n  color: var(--pds-input-text-color);\n  flex: 1;\n  font: var(--pds-input-font);\n  letter-spacing: var(--pine-letter-spacing);\n  min-height: var(--pds-input-field-min-height);\n  min-width: var(--pine-dimension-none);\n  padding: var(--pds-input-padding-y) var(--pds-input-padding-x);\n  transition: border-color 0.2s ease;\n  width: 100%;\n\n  &:hover:not(:disabled) {\n    border-color: var(--pds-input-border-color-hover);\n  }\n\n  &:disabled {\n    background: var(--pds-input-disabled-background);\n    border-color: var(--pine-color-border-disabled);\n    color: var(--pds-input-disabled-text-color);\n    cursor: not-allowed;\n\n    &::placeholder {\n      color: var(--pine-color-text-placeholder-disabled);\n    }\n  }\n\n  .has-error &:hover:not(:disabled) {\n    border-color: var(--pds-input-error-border-hover);\n  }\n\n  &:focus-visible:not(.has-error) {\n    border-color: var(--pine-color-border-active);\n    outline: var(--pine-outline-focus);\n    outline-offset: var(--pine-border-width);\n    position: relative;\n    z-index: 1;\n\n    :host([has-prepend]) &,\n    :host([has-append]) &,\n    :host([has-prefix]) &,\n    :host([has-suffix]) & {\n      outline-offset: var(--pine-dimension-none);\n    }\n  }\n\n  &::placeholder {\n    color: var(--pds-input-placeholder-color);\n  }\n\n  .has-error & {\n    background-color: var(--pds-input-error-background);\n    border-color: var(--pds-input-error-border);\n\n    &:focus-visible {\n      outline-color: var(--pine-color-focus-ring-danger);\n      position: relative;\n      z-index: 1;\n    }\n  }\n}\n\n.pds-input__error-message,\n.pds-input__helper-message {\n  color: var(--pine-color-text-message);\n  font: var(--pine-typography-body-sm);\n  margin-block-end: var(--pine-dimension-none);\n  margin-block-start: var(--pine-dimension-2xs);\n}\n\n.pds-input__error-message {\n  align-items: center;\n  color: var(--pds-input-error-color);\n  display: flex;\n  gap: var(--pine-dimension-2xs);\n}\n\n.visually-hidden {\n  border: 0;\n  clip: rect(0 0 0 0);\n  clip-path: polygon(0 0, 0 0, 0 0);\n  height: 1px;\n  margin: -1px;\n  overflow: hidden;\n  padding: 0;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { assignDescription, messageId } from '../../utils/form';\nimport { inheritAriaAttributes } from '@utils/attributes';\nimport type { Attributes } from '@utils/attributes';\nimport { InputChangeEventDetail, InputInputEventDetail } from './input-interface';\nimport { debounceEvent } from '@utils/utils';\nimport { danger } from '@pine-ds/icons/icons';\n\n/**\n * @slot append - Content to be displayed after the input field\n * @slot prefix - Content that is displayed visually within the input field before the input field\n * @slot prepend - Content to be displayed before the input field\n * @slot suffix - Content that is displayed visually within the input field after the input field\n * @slot action - Content to be displayed in the label area, typically for help icons or links\n */\n@Component({\n  tag: 'pds-input',\n  styleUrls: ['pds-input.tokens.scss', '../../global/styles/utils/label.scss', 'pds-input.scss'],\n  shadow: true,\n  formAssociated: true,\n})\nexport class PdsInput {\n\n  private nativeInput?: HTMLInputElement;\n  private inheritedAttributes: Attributes = {};\n  private isComposing = false;\n  private prefixEl?: HTMLElement;\n  private suffixEl?: HTMLElement;\n  private focusedValue?: string | number | null;\n  private originalPdsInput?: EventEmitter<InputInputEventDetail>;\n  private internals?: ElementInternals;\n\n  @Element() el!: HTMLPdsInputElement;\n\n  /**\n   * If true, the input has prefix content (non-focusable)\n   */\n  @State() hasPrefix = false;\n\n  /**\n   * If true, the input has suffix content (non-focusable)\n   */\n  @State() hasSuffix = false;\n\n  /**\n   * If true, the input has prepend content (focusable)\n   */\n  @State() hasPrepend = false;\n\n  /**\n   * If true, the input has append content (focusable)\n   */\n  @State() hasAppend = false;\n\n  /**\n   * If true, the input has action content in the label area\n   */\n  @State() hasAction = false;\n\n  /**\n   * Emitted when the input loses focus.\n   */\n  @Event() pdsBlur!: EventEmitter<FocusEvent>;\n\n  /**\n   * Emitted when the value has changed.\n   *\n   * This event will not emit when programmatically setting the `value` property.\n   */\n  @Event() pdsChange!: EventEmitter<InputChangeEventDetail>;\n\n  /**\n   * Emitted when the input has focus.\n   */\n  @Event() pdsFocus!: EventEmitter<FocusEvent>;\n\n  /**\n   * Emitted when a keyboard input occurs.\n   */\n  @Event() pdsInput: EventEmitter<InputInputEventDetail>;\n\n  /**\n   * Sets focus on the native `input` in the `pds-input`. Use this method instead of the global\n   * `input.focus()`.\n   */\n  @Method()\n  async setFocus() {\n    if (this.nativeInput) {\n      this.nativeInput.focus();\n    }\n  }\n\n\n  /**\n   * Specifies if and how the browser provides `autocomplete` assistance for the field.\n   */\n  @Prop() autocomplete: string;\n\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId!: string;\n\n  /**\n   * Sets the number of milliseconds to wait before updating the value.\n   */\n  @Prop() debounce?: number;\n\n  /**\n   * Determines whether or not the input field is disabled.\n   */\n  @Prop() disabled?: boolean;\n\n  /**\n   * Specifies the error message and provides an error-themed treatment to the field.\n   */\n  @Prop() errorMessage?: string;\n\n  /**\n   * Displays a message or hint below the input field.\n   */\n  @Prop() helperMessage?: string;\n\n  /**\n   * Determines whether or not the input field is invalid or throws an error.\n   */\n  @Prop() invalid?: boolean;\n\n  /**\n   * Text to be displayed as the input label.\n   */\n  @Prop() label?: string;\n\n  /**\n   * Visually hides the label text for instances where only the input should be displayed. Label remains accessible to assistive technology such as screen readers.\n   * Note: When true, the action slot is also hidden to maintain a minimal UI.\n   */\n  @Prop() hideLabel: boolean;\n\n  /**\n   * Specifies the maximum value for the input field.\n   */\n  @Prop() max?: string;\n\n  /**\n   * Specifies the maximum number of characters allowed in the input field.\n   */\n  @Prop() maxlength?: string;\n\n  /**\n   * Specifies the minimum value for the input field.\n   */\n  @Prop() min?: string;\n\n  /**\n   * Specifies the minimum number of characters allowed in the input field.\n   */\n  @Prop() minlength?: string;\n\n  /**\n   * Specifies the name. Submitted with the form name/value pair.\n   */\n  @Prop() name?: string;\n\n  /**\n   * Specifies the regular expression that the input value is checked against.\n   */\n  @Prop() pattern?: string;\n\n  /**\n   * Specifies a short hint that describes the expected value of the input field.\n   */\n  @Prop() placeholder?: string;\n\n  /**\n   * Determines whether or not the input field is readonly.\n   */\n  @Prop() readonly?: boolean;\n\n  /**\n   * Determines whether or not the input field is required.\n   */\n  @Prop() required?: boolean;\n\n  /**\n   * Works with the `min` and `max` attributes to define increments for the input field.\n   */\n  @Prop() step?: string;\n\n  /**\n   * Determines the type of control that will be displayed\n   * `'email'`, `'number'`, `'password'`, `'tel'`, `'text'`, `'url'`\n   * @defaultValue \"text\"\n   */\n  @Prop() type = 'text';\n\n  /**\n   * The value of the input.\n   */\n  @Prop({mutable: true}) value?: string | number | null = '';\n\n  /**\n   * Determines whether or not the input field takes full width of its container.\n   */\n  @Prop() fullWidth?: boolean;\n\n  /**\n   * Applies highlight styling to the input field.\n   */\n  @Prop({ reflect: true }) highlight?: boolean;\n\n  /**\n   * Determines if the input has focus.\n   */\n  @State() hasFocus = false;\n\n  private updateAddonWidths() {\n    requestAnimationFrame(() => {\n      if (this.prefixEl) {\n        const prefixWidth = this.prefixEl.offsetWidth;\n        this.el.style.setProperty('--prefix-width', `${prefixWidth}px`);\n      }\n\n      if (this.suffixEl) {\n        const suffixWidth = this.suffixEl.offsetWidth;\n        this.el.style.setProperty('--suffix-width', `${suffixWidth}px`);\n      }\n    });\n  }\n\n  private renderPrefix() {\n    const hasPrefix = this.el.querySelector('[slot=\"prefix\"]') !== null;\n    if (hasPrefix) {\n      return (\n        <div class=\"pds-input__prefix\" part=\"prefix\" ref={(el) => this.prefixEl = el as HTMLElement}>\n          <slot name=\"prefix\" onSlotchange={() => this.updateAddonWidths()}></slot>\n        </div>\n      );\n    }\n    return null;\n  }\n\n  private renderSuffix() {\n    const hasSuffix = this.el.querySelector('[slot=\"suffix\"]') !== null;\n    if (hasSuffix) {\n      return (\n        <div class=\"pds-input__suffix\" part=\"suffix\" ref={(el) => this.suffixEl = el as HTMLElement}>\n          <slot name=\"suffix\" onSlotchange={() => this.updateAddonWidths()}></slot>\n        </div>\n      );\n    }\n    return null;\n  }\n\n  private renderPrepend() {\n    const hasPrepend = this.el.querySelector('[slot=\"prepend\"]') !== null;\n    if (hasPrepend) {\n      return (\n        <div class=\"pds-input__prepend\" part=\"prepend\">\n          <slot name=\"prepend\"></slot>\n        </div>\n      );\n    }\n    return null;\n  }\n\n  private renderAppend() {\n    const hasAppend = this.el.querySelector('[slot=\"append\"]') !== null;\n    if (hasAppend) {\n      return (\n        <div class=\"pds-input__append\" part=\"append\">\n          <slot name=\"append\"></slot>\n        </div>\n      );\n    }\n    return null;\n  }\n\n  private renderAction() {\n    const hasAction = this.el.querySelector('[slot=\"action\"]') !== null;\n    if (hasAction) {\n      return (\n        <div class=\"pds-input__action\" part=\"action\">\n          <slot name=\"action\"></slot>\n        </div>\n      );\n    }\n    return null;\n  }\n\n  componentWillLoad() {\n    this.inheritedAttributes = {\n      ...inheritAriaAttributes(this.el)\n    };\n    this.hasPrefix = this.el.querySelector('[slot=\"prefix\"]') !== null;\n    this.hasSuffix = this.el.querySelector('[slot=\"suffix\"]') !== null;\n    this.hasPrepend = this.el.querySelector('[slot=\"prepend\"]') !== null;\n    this.hasAppend = this.el.querySelector('[slot=\"append\"]') !== null;\n    this.hasAction = this.el.querySelector('[slot=\"action\"]') !== null;\n\n    // Store the original pdsInput event emitter\n    this.originalPdsInput = this.pdsInput;\n  }\n\n  connectedCallback() {\n    // Initialize ElementInternals for form association\n    if (this.el.attachInternals) {\n      this.internals = this.el.attachInternals();\n    }\n  }\n\n  componentDidLoad() {\n    this.debounceChanged();\n    this.updateAddonWidths();\n    // Set initial form value\n    this.updateFormValue();\n  }\n\n  componentDidUpdate() {\n    this.updateAddonWidths();\n  }\n\n  @Watch('debounce')\n  protected debounceChanged() {\n    const { pdsInput, debounce, originalPdsInput } = this;\n\n    /**\n     * If debounce is undefined, we have to manually revert the pdsInput emitter in case\n     * debounce used to be set to a number. Otherwise, the event would stay debounced.\n     */\n    this.pdsInput = debounce === undefined ? originalPdsInput ?? pdsInput : debounceEvent(pdsInput, debounce);\n  }\n\n  @Watch('value')\n  protected valueChanged() {\n    const nativeInput = this.nativeInput;\n    const value = this.getValue();\n\n    if (nativeInput && nativeInput.value !== value && !this.isComposing) {\n      nativeInput.value = value;\n    }\n\n    // Update form value when value changes\n    this.updateFormValue();\n  }\n\n  private getValue(): string {\n    return typeof this.value === 'number' ? this.value.toString() : (this.value || '').toString();\n  }\n\n  private onInputEvent = (ev: Event) => {\n    const input = ev.target as HTMLInputElement | null;\n    if (input) {\n      this.value = input.value || '';\n    }\n    this.emitInputChange(ev);\n  };\n\n  private onChangeEvent = (ev: Event) => {\n    this.emitValueChange(ev);\n  };\n\n  private onBlurEvent = (ev: FocusEvent) => {\n    this.hasFocus = false;\n\n    if (this.focusedValue !== this.value) {\n      /**\n       * Emits the `pdsChange` event when the input value\n       * is different than the value when the input was focused.\n       */\n      this.emitValueChange(ev);\n    }\n\n    this.pdsBlur.emit(ev);\n  };\n\n  private onFocusEvent = (ev: FocusEvent) => {\n    this.hasFocus = true;\n    this.focusedValue = this.value;\n\n    this.pdsFocus.emit(ev);\n  };\n\n  private onCompositionStart = () => {\n    this.isComposing = true;\n  }\n\n  private onCompositionEnd = () => {\n    this.isComposing = false;\n  }\n\n  /**\n   * Emits a pdsChange event\n   */\n  private emitValueChange(event?: Event) {\n    const { value } = this;\n    const newValue = value == null ? value : value.toString();\n\n    this.focusedValue = newValue;\n    this.pdsChange.emit({ value: newValue, event });\n  }\n\n  /**\n   * Emits a `pdsInput` event\n   */\n  private emitInputChange(event?: Event) {\n    const { value } = this;\n\n    // Checks for both null and undefined values\n    const newValue = value == null ? value : value.toString();\n\n    this.pdsInput.emit({ value: newValue, event });\n  }\n\n  /**\n   * Updates the form value using ElementInternals API\n   */\n  private updateFormValue() {\n    if (this.internals && this.internals.setFormValue) {\n      const value = this.getValue();\n      this.internals.setFormValue(value || null);\n\n      // Set validity based on native input validation\n      if (this.nativeInput && this.internals && this.internals.setValidity) {\n        this.internals.setValidity(\n          this.nativeInput.validity,\n          this.nativeInput.validationMessage,\n          this.nativeInput\n        );\n      }\n    }\n  }\n\n  /**\n   * Form Associated Custom Elements API: Called when the form is reset\n   */\n  formResetCallback() {\n    this.value = '';\n    this.updateFormValue();\n  }\n\n  /**\n   * Form Associated Custom Elements API: Called when the form is disabled\n   */\n  formDisabledCallback(disabled: boolean) {\n    this.disabled = disabled;\n  }\n\n  /**\n   * Form Associated Custom Elements API: Called to restore form state\n   */\n  formStateRestoreCallback(state: string | FormData | null) {\n    if (typeof state === 'string') {\n      this.value = state;\n    } else if (state instanceof FormData && this.name) {\n      // Extract value from FormData using the input's name\n      const value = state.get(this.name);\n      if (typeof value === 'string') {\n        this.value = value;\n      }\n    }\n  }\n\n  render() {\n    const {\n      componentId,\n      disabled,\n      errorMessage,\n      helperMessage,\n      invalid = false,\n      label,\n    } = this;\n\n    const value = this.getValue();\n\n    const inputWrapperClasses = {\n      'pds-input__field-wrapper': true,\n      'has-focus': this.hasFocus,\n      'has-error': invalid || !!errorMessage,\n      'is-disabled': disabled,\n      'has-prefix': this.hasPrefix,\n      'has-suffix': this.hasSuffix,\n      'has-prepend': this.hasPrepend,\n      'has-append': this.hasAppend,\n    };\n\n    return (\n      <Host\n        aria-disabled={this.disabled ? 'true' : null}\n        aria-readonly={this.readonly ? 'true' : null}\n        has-prefix={this.hasPrefix ? 'true' : null}\n        has-suffix={this.hasSuffix ? 'true' : null}\n        has-prepend={this.hasPrepend ? 'true' : null}\n        has-append={this.hasAppend ? 'true' : null}\n        has-action={this.hasAction && !this.hideLabel ? 'true' : null}\n        full-width={this.fullWidth ? 'true' : null}\n      >\n        <div class=\"pds-input\">\n          {label && (\n            <div class=\"pds-input__label-wrapper\">\n              <label htmlFor={componentId} class=\"pds-input__label\">\n                <span class={this.hideLabel ? 'visually-hidden' : ''}>\n                  {label}\n                  {this.required && <span class=\"pds-input__required-indicator\"> *</span>}\n                </span>\n              </label>\n              {!this.hideLabel && this.renderAction()}\n            </div>\n          )}\n\n          <div class={inputWrapperClasses}>\n            {this.renderPrepend()}\n            {this.renderPrefix()}\n            <input\n              ref={(input) => (this.nativeInput = input)}\n              class=\"pds-input__field\"\n              aria-describedby={assignDescription(componentId, invalid, helperMessage)}\n              aria-invalid={invalid ? \"true\" : undefined}\n              autocomplete={this.autocomplete}\n              disabled={disabled}\n              id={componentId}\n              max={this.max}\n              maxlength={this.maxlength}\n              min={this.min}\n              minlength={this.minlength}\n              name={this.name}\n              pattern={this.pattern}\n              placeholder={this.placeholder}\n              readOnly={this.readonly}\n              required={this.required}\n              step={this.step}\n              type={this.type}\n              value={value}\n              onInput={this.onInputEvent}\n              onChange={this.onChangeEvent}\n              onBlur={this.onBlurEvent}\n              onFocus={this.onFocusEvent}\n              onCompositionstart={this.onCompositionStart}\n              onCompositionend={this.onCompositionEnd}\n              {...this.inheritedAttributes}\n            />\n            {this.renderSuffix()}\n            {this.renderAppend()}\n          </div>\n\n          {helperMessage && (\n            <p class=\"pds-input__helper-message\" id={messageId(componentId, 'helper')}>\n              {helperMessage}\n            </p>\n          )}\n\n          {errorMessage && (\n            <p class=\"pds-input__error-message\" id={messageId(componentId, 'error')}>\n              <pds-icon icon={danger} size=\"small\" />\n              {errorMessage}\n            </p>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"gzDAAA,IAAMA,EAAoB,wECA1B,IAAMC,EAAW,qTCAjB,IAAMC,EAAc,+0W,ICqBPC,EAAQC,EAAA,uBANrB,SAAAC,EAAAC,GAAA,IAAAC,EAAAC,K,8IASUA,KAAmBC,oBAAe,GAClCD,KAAWE,YAAG,MAYbF,KAASG,UAAG,MAKZH,KAASI,UAAG,MAKZJ,KAAUK,WAAG,MAKbL,KAASM,UAAG,MAKZN,KAASO,UAAG,MAyIbP,KAAIQ,KAAG,OAKQR,KAAKS,MAA4B,GAe/CT,KAAQU,SAAG,MAwIZV,KAAAW,aAAe,SAACC,GACtB,IAAMC,EAAQD,EAAGE,OACjB,GAAID,EAAO,CACTd,EAAKU,MAAQI,EAAMJ,OAAS,E,CAE9BV,EAAKgB,gBAAgBH,EACvB,EAEQZ,KAAAgB,cAAgB,SAACJ,GACvBb,EAAKkB,gBAAgBL,EACvB,EAEQZ,KAAAkB,YAAc,SAACN,GACrBb,EAAKW,SAAW,MAEhB,GAAIX,EAAKoB,eAAiBpB,EAAKU,MAAO,CAKpCV,EAAKkB,gBAAgBL,E,CAGvBb,EAAKqB,QAAQC,KAAKT,EACpB,EAEQZ,KAAAsB,aAAe,SAACV,GACtBb,EAAKW,SAAW,KAChBX,EAAKoB,aAAepB,EAAKU,MAEzBV,EAAKwB,SAASF,KAAKT,EACrB,EAEQZ,KAAkBwB,mBAAG,WAC3BzB,EAAKG,YAAc,IACrB,EAEQF,KAAgByB,iBAAG,WACzB1B,EAAKG,YAAc,KACrB,CA4KD,CA3dOL,EAAA6B,UAAAC,SAAN,W,qFACE,GAAI3B,KAAK4B,YAAa,CACpB5B,KAAK4B,YAAYC,O,kBAgIbhC,EAAA6B,UAAAI,kBAAA,eAAA/B,EAAAC,KACN+B,uBAAsB,WACpB,GAAIhC,EAAKiC,SAAU,CACjB,IAAMC,EAAclC,EAAKiC,SAASE,YAClCnC,EAAKoC,GAAGC,MAAMC,YAAY,iBAAkB,GAAAC,OAAGL,EAAW,M,CAG5D,GAAIlC,EAAKwC,SAAU,CACjB,IAAMC,EAAczC,EAAKwC,SAASL,YAClCnC,EAAKoC,GAAGC,MAAMC,YAAY,iBAAkB,GAAAC,OAAGE,EAAW,M,CAE9D,G,EAGM3C,EAAA6B,UAAAe,aAAA,eAAA1C,EAAAC,KACN,IAAMG,EAAYH,KAAKmC,GAAGO,cAAc,qBAAuB,KAC/D,GAAIvC,EAAW,CACb,OACEwC,EAAA,OAAKC,MAAM,oBAAoBC,KAAK,SAASC,IAAK,SAACX,GAAO,OAAApC,EAAKiC,SAAWG,CAAhB,GACxDQ,EAAA,QAAMI,KAAK,SAASC,aAAc,WAAM,OAAAjD,EAAK+B,mBAAL,I,CAI9C,OAAO,I,EAGDjC,EAAA6B,UAAAuB,aAAA,eAAAlD,EAAAC,KACN,IAAMI,EAAYJ,KAAKmC,GAAGO,cAAc,qBAAuB,KAC/D,GAAItC,EAAW,CACb,OACEuC,EAAA,OAAKC,MAAM,oBAAoBC,KAAK,SAASC,IAAK,SAACX,GAAO,OAAApC,EAAKwC,SAAWJ,CAAhB,GACxDQ,EAAA,QAAMI,KAAK,SAASC,aAAc,WAAM,OAAAjD,EAAK+B,mBAAL,I,CAI9C,OAAO,I,EAGDjC,EAAA6B,UAAAwB,cAAA,WACN,IAAM7C,EAAaL,KAAKmC,GAAGO,cAAc,sBAAwB,KACjE,GAAIrC,EAAY,CACd,OACEsC,EAAA,OAAKC,MAAM,qBAAqBC,KAAK,WACnCF,EAAA,QAAMI,KAAK,Y,CAIjB,OAAO,I,EAGDlD,EAAA6B,UAAAyB,aAAA,WACN,IAAM7C,EAAYN,KAAKmC,GAAGO,cAAc,qBAAuB,KAC/D,GAAIpC,EAAW,CACb,OACEqC,EAAA,OAAKC,MAAM,oBAAoBC,KAAK,UAClCF,EAAA,QAAMI,KAAK,W,CAIjB,OAAO,I,EAGDlD,EAAA6B,UAAA0B,aAAA,WACN,IAAM7C,EAAYP,KAAKmC,GAAGO,cAAc,qBAAuB,KAC/D,GAAInC,EAAW,CACb,OACEoC,EAAA,OAAKC,MAAM,oBAAoBC,KAAK,UAClCF,EAAA,QAAMI,KAAK,W,CAIjB,OAAO,I,EAGTlD,EAAA6B,UAAA2B,kBAAA,WACErD,KAAKC,oBAAmBqD,OAAAC,OAAA,GACnBC,EAAsBxD,KAAKmC,KAEhCnC,KAAKG,UAAYH,KAAKmC,GAAGO,cAAc,qBAAuB,KAC9D1C,KAAKI,UAAYJ,KAAKmC,GAAGO,cAAc,qBAAuB,KAC9D1C,KAAKK,WAAaL,KAAKmC,GAAGO,cAAc,sBAAwB,KAChE1C,KAAKM,UAAYN,KAAKmC,GAAGO,cAAc,qBAAuB,KAC9D1C,KAAKO,UAAYP,KAAKmC,GAAGO,cAAc,qBAAuB,KAG9D1C,KAAKyD,iBAAmBzD,KAAK0D,Q,EAG/B7D,EAAA6B,UAAAiC,kBAAA,WAEE,GAAI3D,KAAKmC,GAAGyB,gBAAiB,CAC3B5D,KAAK6D,UAAY7D,KAAKmC,GAAGyB,iB,GAI7B/D,EAAA6B,UAAAoC,iBAAA,WACE9D,KAAK+D,kBACL/D,KAAK8B,oBAEL9B,KAAKgE,iB,EAGPnE,EAAA6B,UAAAuC,mBAAA,WACEjE,KAAK8B,mB,EAIGjC,EAAA6B,UAAAqC,gBAAA,WACF,IAAAG,EAA2ClE,KAAzC0D,EAAQQ,EAAAR,SAAES,EAAQD,EAAAC,SAAEV,EAAgBS,EAAAT,iBAM5CzD,KAAK0D,SAAWS,IAAaC,UAAYX,IAAA,MAAAA,SAAgB,EAAhBA,EAAoBC,EAAWW,EAAcX,EAAUS,E,EAIxFtE,EAAA6B,UAAA4C,aAAA,WACR,IAAM1C,EAAc5B,KAAK4B,YACzB,IAAMnB,EAAQT,KAAKuE,WAEnB,GAAI3C,GAAeA,EAAYnB,QAAUA,IAAUT,KAAKE,YAAa,CACnE0B,EAAYnB,MAAQA,C,CAItBT,KAAKgE,iB,EAGCnE,EAAA6B,UAAA6C,SAAA,WACN,cAAcvE,KAAKS,QAAU,SAAWT,KAAKS,MAAM+D,YAAcxE,KAAKS,OAAS,IAAI+D,U,EA+C7E3E,EAAA6B,UAAAT,gBAAA,SAAgBwD,GACd,IAAAhE,EAAUT,KAAIS,MACtB,IAAMiE,EAAWjE,GAAS,KAAOA,EAAQA,EAAM+D,WAE/CxE,KAAKmB,aAAeuD,EACpB1E,KAAK2E,UAAUtD,KAAK,CAAEZ,MAAOiE,EAAUD,MAAKA,G,EAMtC5E,EAAA6B,UAAAX,gBAAA,SAAgB0D,GACd,IAAAhE,EAAUT,KAAIS,MAGtB,IAAMiE,EAAWjE,GAAS,KAAOA,EAAQA,EAAM+D,WAE/CxE,KAAK0D,SAASrC,KAAK,CAAEZ,MAAOiE,EAAUD,MAAKA,G,EAMrC5E,EAAA6B,UAAAsC,gBAAA,WACN,GAAIhE,KAAK6D,WAAa7D,KAAK6D,UAAUe,aAAc,CACjD,IAAMnE,EAAQT,KAAKuE,WACnBvE,KAAK6D,UAAUe,aAAanE,GAAS,MAGrC,GAAIT,KAAK4B,aAAe5B,KAAK6D,WAAa7D,KAAK6D,UAAUgB,YAAa,CACpE7E,KAAK6D,UAAUgB,YACb7E,KAAK4B,YAAYkD,SACjB9E,KAAK4B,YAAYmD,kBACjB/E,KAAK4B,Y,IASb/B,EAAA6B,UAAAsD,kBAAA,WACEhF,KAAKS,MAAQ,GACbT,KAAKgE,iB,EAMPnE,EAAA6B,UAAAuD,qBAAA,SAAqBC,GACnBlF,KAAKkF,SAAWA,C,EAMlBrF,EAAA6B,UAAAyD,yBAAA,SAAyBC,GACvB,UAAWA,IAAU,SAAU,CAC7BpF,KAAKS,MAAQ2E,C,MACR,GAAIA,aAAiBC,UAAYrF,KAAK+C,KAAM,CAEjD,IAAMtC,EAAQ2E,EAAME,IAAItF,KAAK+C,MAC7B,UAAWtC,IAAU,SAAU,CAC7BT,KAAKS,MAAQA,C,IAKnBZ,EAAA6B,UAAA6D,OAAA,eAAAxF,EAAAC,KACQ,IAAAkE,EAOFlE,KANFwF,EAAWtB,EAAAsB,YACXN,EAAQhB,EAAAgB,SACRO,EAAYvB,EAAAuB,aACZC,EAAaxB,EAAAwB,cACbC,EAAAzB,EAAA0B,UAAOD,SAAA,EAAG,MAAKA,EACfE,EAAK3B,EAAA2B,MAGP,IAAMpF,EAAQT,KAAKuE,WAEnB,IAAMuB,EAAsB,CAC1B,2BAA4B,KAC5B,YAAa9F,KAAKU,SAClB,YAAakF,KAAaH,EAC1B,cAAeP,EACf,aAAclF,KAAKG,UACnB,aAAcH,KAAKI,UACnB,cAAeJ,KAAKK,WACpB,aAAcL,KAAKM,WAGrB,OACEqC,EAACoD,EAAI,CAAAC,IAAA,2DACYhG,KAAKkF,SAAW,OAAS,KACzB,gBAAAlF,KAAKiG,SAAW,OAAS,KAAI,aAChCjG,KAAKG,UAAY,OAAS,KAAI,aAC9BH,KAAKI,UAAY,OAAS,KAAI,cAC7BJ,KAAKK,WAAa,OAAS,KAAI,aAChCL,KAAKM,UAAY,OAAS,KAAI,aAC9BN,KAAKO,YAAcP,KAAKkG,UAAY,OAAS,KAC7C,aAAAlG,KAAKmG,UAAY,OAAS,MAEtCxD,EAAK,OAAAqD,IAAA,2CAAApD,MAAM,aACRiD,GACClD,EAAK,OAAAqD,IAAA,2CAAApD,MAAM,4BACTD,EAAA,SAAAqD,IAAA,2CAAOI,QAASZ,EAAa5C,MAAM,oBACjCD,EAAA,QAAAqD,IAAA,2CAAMpD,MAAO5C,KAAKkG,UAAY,kBAAoB,IAC/CL,EACA7F,KAAKqG,UAAY1D,EAAA,QAAAqD,IAAA,2CAAMpD,MAAM,iCAAyC,SAGzE5C,KAAKkG,WAAalG,KAAKoD,gBAI7BT,EAAK,OAAAqD,IAAA,2CAAApD,MAAOkD,GACT9F,KAAKkD,gBACLlD,KAAKyC,eACNE,EAAA,QAAAW,OAAAC,OAAA,CAAAyC,IAAA,2CACElD,IAAK,SAACjC,GAAK,OAAMd,EAAK6B,YAAcf,CAAzB,EACX+B,MAAM,mBACY,mBAAA0D,EAAkBd,EAAaI,EAASF,GAAc,eAC1DE,EAAU,OAASxB,UACjCmC,aAAcvG,KAAKuG,aACnBrB,SAAUA,EACVsB,GAAIhB,EACJiB,IAAKzG,KAAKyG,IACVC,UAAW1G,KAAK0G,UAChBC,IAAK3G,KAAK2G,IACVC,UAAW5G,KAAK4G,UAChB7D,KAAM/C,KAAK+C,KACX8D,QAAS7G,KAAK6G,QACdC,YAAa9G,KAAK8G,YAClBC,SAAU/G,KAAKiG,SACfI,SAAUrG,KAAKqG,SACfW,KAAMhH,KAAKgH,KACXxG,KAAMR,KAAKQ,KACXC,MAAOA,EACPwG,QAASjH,KAAKW,aACduG,SAAUlH,KAAKgB,cACfmG,OAAQnH,KAAKkB,YACbkG,QAASpH,KAAKsB,aACd+F,mBAAoBrH,KAAKwB,mBACzB8F,iBAAkBtH,KAAKyB,kBACnBzB,KAAKC,sBAEVD,KAAKiD,eACLjD,KAAKmD,gBAGPuC,GACC/C,EAAA,KAAAqD,IAAA,2CAAGpD,MAAM,4BAA4B4D,GAAIe,EAAU/B,EAAa,WAC7DE,GAIJD,GACC9C,EAAG,KAAAqD,IAAA,2CAAApD,MAAM,2BAA2B4D,GAAIe,EAAU/B,EAAa,UAC7D7C,EAAA,YAAAqD,IAAA,2CAAUwB,KAAMC,EAAQC,KAAK,UAC5BjC,I,uXArhBM,I","ignoreList":[]}

package/dist/pine-core/p-fe60ee09.entry.js

@@ -1,2 +0,0 @@
-import{r as s,h as t,H as i,g as a}from"./p-Bf1dou5H.js";const e=":host{--tabs-dimension-panel-margin-top:var(--pine-dimension-none);--tabs-dimension-panel-padding:0;display:block}.pds-tabs__tablist{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:var(--pine-dimension-md)}:host(.pds-tabs--availability) .pds-tabs__tablist{gap:var(--pine-dimension-xs)}:host(.pds-tabs--filter) .pds-tabs__tablist{gap:var(--pine-dimension-sm)}:host(.pds-tabs--pill) .pds-tabs__tablist{background-color:var(--pine-color-grey-100);border:var(--pine-border-width-thin) solid var(--pine-color-grey-200);border-radius:var(--pine-dimension-100);display:-ms-inline-flexbox;display:inline-flex;display:-ms-flexbox;display:flex;gap:0;height:var(--pine-dimension-450)}";const n=class{constructor(t){s(this,t)}tabClickHandler(s){if(this.componentId===s.detail[1]){this.activeTabIndex=s.detail[0];this.activeTabName=this.tabs[this.activeTabIndex].name}}handleKeyDown(s){const t=["ArrowLeft","ArrowRight","Home","End"];const i=s.target;const a=i.closest("pds-tab");const e=a&&a.closest("pds-tabs")===this.el;if(t.includes(s.key)&&e){s.preventDefault();this.moveActiveTab(s.key)}}moveActiveTab(s){const t=0;const i=this.tabs.length-1;let a=null;switch(s){case"ArrowLeft":a=this.activeTabIndex===t?i:this.activeTabIndex+-1;break;case"ArrowRight":a=this.activeTabIndex===i?t:this.activeTabIndex+1;break;case"Home":a=t;break;case"End":a=i;break}this.tabs[a].children[0].focus();this.activeTabName=this.tabs[a].name;this.activeTabIndex=a}findAllChildren(){const s=Array.from(this.el.querySelectorAll("pds-tab"));const t=Array.from(this.el.querySelectorAll("pds-tabpanel"));this.tabs=s.filter((s=>s.closest("pds-tabs")===this.el));this.tabPanels=t.filter((s=>s.closest("pds-tabs")===this.el))}propGeneration(s,t=0){s.parentComponentId=this.componentId.toString();s.variant=this.variant.toString();s.selected=this.activeTabName===s.name?true:false;s["index"]=t}passPropsToChildren(){this.tabs.forEach(((s,t)=>{if(this.activeTabName===s.name)this.activeTabIndex=t;this.propGeneration(s,t)}));this.tabPanels.forEach((s=>{this.propGeneration(s)}))}classNames(){let s=`pds-tabs`;if(this.variant&&this.variant!="primary"){const t=`pds-tabs--${this.variant}`;s+=" "+t}return s}componentWillLoad(){this.findAllChildren()}componentWillRender(){this.passPropsToChildren()}render(){return t(i,{key:"729d6b9d3deb5a31cc7b1d9b18334761a856f933","active-tab-name":this.activeTabName,class:this.classNames(),id:this.componentId},t("div",{key:"87e06225508059a3c1b548440cf7da9b68df77fd",class:"pds-tabs__tablist",role:"tablist","aria-label":this.tablistLabel,part:"tab-list"},t("slot",{key:"5e8c4c941a7f6aea1ce3378641931c104b6b45cf",name:"tabs"})),t("slot",{key:"b396ed81d9a1c957803a94dbfe965986c6afc870",name:"tabpanels"}))}get el(){return a(this)}};n.style=e;export{n as pds_tabs};
-//# sourceMappingURL=p-fe60ee09.entry.js.map

package/dist/pine-core/p-fe60ee09.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["pdsTabsCss","PdsTabs","tabClickHandler","event","this","componentId","detail","activeTabIndex","activeTabName","tabs","name","handleKeyDown","ev","keySet","target","targetTab","closest","isOwnTab","el","includes","key","preventDefault","moveActiveTab","firstTabNumber","lastTabNumber","length","moveFocusTo","children","focus","findAllChildren","allTabs","Array","from","querySelectorAll","allTabPanels","filter","tab","tabPanels","panel","propGeneration","child","index","parentComponentId","toString","variant","selected","passPropsToChildren","forEach","classNames","className","variantClassName","componentWillLoad","componentWillRender","render","h","Host","class","id","role","tablistLabel","part"],"sources":["src/components/pds-tabs/pds-tabs.scss?tag=pds-tabs&encapsulation=shadow","src/components/pds-tabs/pds-tabs.tsx"],"sourcesContent":[":host {\n  /**\n   * @prop --tabs-dimension-panel-margin-top: Optional margin-top for panels\n   */\n  --tabs-dimension-panel-margin-top: var(--pine-dimension-none);\n  /**\n   * @prop --tabs-dimension-panel-padding: Optional padding for panels\n   */\n  --tabs-dimension-panel-padding: 0;\n\n  display: block;\n}\n\n.pds-tabs__tablist {\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--pine-dimension-md);\n}\n\n:host(.pds-tabs--availability) .pds-tabs__tablist {\n  gap: var(--pine-dimension-xs);\n}\n\n:host(.pds-tabs--filter) .pds-tabs__tablist {\n  gap: var(--pine-dimension-sm);\n}\n\n:host(.pds-tabs--pill) .pds-tabs__tablist {\n  background-color: var(--pine-color-grey-100);\n  border: var(--pine-border-width-thin) solid var(--pine-color-grey-200);\n  border-radius: var(--pine-dimension-100);\n  display: inline-flex;\n  display: flex;\n  gap: 0;\n  height: var(--pine-dimension-450);\n}\n","import { Component, Element, Host, h, Prop, Listen } from '@stencil/core';\n\n  /**\n * @slot tabs - Content is placed within the `div[role=\"tablist\"]` element as children\n * @slot tabpanels - Content is placed directly after the `div[role=\"tablist\"]` element as siblings\n * @part tab-list - Exposes the container element that holds all the tab buttons for styling.\n */\n@Component({\n  tag: 'pds-tabs',\n  styleUrls: ['pds-tabs.scss'],\n  shadow: true,\n})\nexport class PdsTabs {\n  private tabs;\n  private tabPanels;\n\n  @Element() el: HTMLPdsTabsElement;\n\n  /**\n   * Sets the aria-label attached to the tablist element\n   */\n  @Prop() tablistLabel!: string;\n\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId!: string;\n\n  /**\n   * Sets tabs variant styles as outlined in Figma documentation\n   */\n  @Prop() variant!: 'primary' | 'availability' | 'filter' | 'pill';\n\n  /**\n   * Sets the starting active tab name and maintains the name as the component re-renders\n   */\n  @Prop({mutable: true}) activeTabName!: string;\n\n  /**\n   * Sets the starting active tab index number and maintains the index number as the component re-renders\n   */\n  /** @internal */\n  @Prop({mutable: true}) activeTabIndex: number;\n\n  @Listen('pdsTabClick', {\n    target: 'body',\n  })\n  tabClickHandler(event: CustomEvent<any>) {\n    if (this.componentId === event.detail[1]) {\n      this.activeTabIndex = event.detail[0];\n      this.activeTabName = this.tabs[this.activeTabIndex].name;\n    }\n  }\n\n  @Listen('keydown', {})\n  handleKeyDown(ev: KeyboardEvent) {\n    const keySet = [\"ArrowLeft\", \"ArrowRight\", \"Home\", \"End\"];\n\n    // Only handle keyboard navigation if the event originated from a tab button\n    // that belongs to THIS tabs component\n    const target = ev.target as HTMLElement;\n    const targetTab = target.closest('pds-tab');\n\n    // Check if the tab belongs to this tabs instance (not a nested one)\n    const isOwnTab = targetTab && targetTab.closest('pds-tabs') === this.el;\n\n    if (keySet.includes(ev.key) && isOwnTab) {\n      ev.preventDefault();\n      this.moveActiveTab(ev.key);\n    }\n  }\n\n  private moveActiveTab(key: string) {\n    const firstTabNumber = 0;\n    const lastTabNumber = this.tabs.length - 1;\n\n    let moveFocusTo = null;\n\n    switch (key) {\n      case 'ArrowLeft':\n        moveFocusTo = (this.activeTabIndex === firstTabNumber) ? lastTabNumber : (this.activeTabIndex + (-1));\n        break;\n      case 'ArrowRight':\n        moveFocusTo = (this.activeTabIndex === lastTabNumber) ? firstTabNumber : (this.activeTabIndex + 1);\n        break;\n      case 'Home':\n        moveFocusTo = firstTabNumber;\n        break;\n      case 'End':\n        moveFocusTo = lastTabNumber;\n        break;\n    }\n\n    // Move focus to the button element within `pds-tab`\n    this.tabs[moveFocusTo].children[0].focus();\n    this.activeTabName = this.tabs[moveFocusTo].name;\n    this.activeTabIndex = moveFocusTo;\n  }\n\n  private findAllChildren() {\n    // Only select direct children tabs/tabpanels, not nested ones\n    const allTabs = Array.from(this.el.querySelectorAll('pds-tab'));\n    const allTabPanels = Array.from(this.el.querySelectorAll('pds-tabpanel'));\n\n    // Filter to only include tabs that belong to this tabs component (not nested)\n    this.tabs = allTabs.filter(tab => tab.closest('pds-tabs') === this.el);\n    this.tabPanels = allTabPanels.filter(panel => panel.closest('pds-tabs') === this.el);\n  }\n\n  private propGeneration(child, index = 0) {\n    child.parentComponentId = this.componentId.toString();\n    child.variant = this.variant.toString();\n    child.selected = (this.activeTabName === child.name) ? true : false;\n    child['index'] = index;\n  }\n\n  private passPropsToChildren() {\n    this.tabs.forEach((child, index) => {\n      if (this.activeTabName === child.name) this.activeTabIndex = index;\n      this.propGeneration(child, index);\n    });\n\n    this.tabPanels.forEach((child) => {\n      this.propGeneration(child);\n    });\n  }\n\n  private classNames() {\n    let className = `pds-tabs`;\n    if (this.variant && this.variant != 'primary') {\n      const variantClassName = `pds-tabs--${this.variant}`;\n      className += ' ' + variantClassName;\n    }\n\n    return className;\n  };\n\n  componentWillLoad() {\n    this.findAllChildren();\n  }\n\n  componentWillRender() {\n    this.passPropsToChildren();\n  }\n\n  render() {\n    return (\n      <Host active-tab-name={this.activeTabName} class={this.classNames()} id={this.componentId}>\n        <div class=\"pds-tabs__tablist\" role=\"tablist\" aria-label={this.tablistLabel} part=\"tab-list\">\n          <slot name=\"tabs\" />\n        </div>\n        <slot name=\"tabpanels\" />\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAa,2rB,MCYNC,EAAO,M,yBAmClB,eAAAC,CAAgBC,GACd,GAAIC,KAAKC,cAAgBF,EAAMG,OAAO,GAAI,CACxCF,KAAKG,eAAiBJ,EAAMG,OAAO,GACnCF,KAAKI,cAAgBJ,KAAKK,KAAKL,KAAKG,gBAAgBG,I,EAKxD,aAAAC,CAAcC,GACZ,MAAMC,EAAS,CAAC,YAAa,aAAc,OAAQ,OAInD,MAAMC,EAASF,EAAGE,OAClB,MAAMC,EAAYD,EAAOE,QAAQ,WAGjC,MAAMC,EAAWF,GAAaA,EAAUC,QAAQ,cAAgBZ,KAAKc,GAErE,GAAIL,EAAOM,SAASP,EAAGQ,MAAQH,EAAU,CACvCL,EAAGS,iBACHjB,KAAKkB,cAAcV,EAAGQ,I,EAIlB,aAAAE,CAAcF,GACpB,MAAMG,EAAiB,EACvB,MAAMC,EAAgBpB,KAAKK,KAAKgB,OAAS,EAEzC,IAAIC,EAAc,KAElB,OAAQN,GACN,IAAK,YACHM,EAAetB,KAAKG,iBAAmBgB,EAAkBC,EAAiBpB,KAAKG,gBAAkB,EACjG,MACF,IAAK,aACHmB,EAAetB,KAAKG,iBAAmBiB,EAAiBD,EAAkBnB,KAAKG,eAAiB,EAChG,MACF,IAAK,OACHmB,EAAcH,EACd,MACF,IAAK,MACHG,EAAcF,EACd,MAIJpB,KAAKK,KAAKiB,GAAaC,SAAS,GAAGC,QACnCxB,KAAKI,cAAgBJ,KAAKK,KAAKiB,GAAahB,KAC5CN,KAAKG,eAAiBmB,C,CAGhB,eAAAG,GAEN,MAAMC,EAAUC,MAAMC,KAAK5B,KAAKc,GAAGe,iBAAiB,YACpD,MAAMC,EAAeH,MAAMC,KAAK5B,KAAKc,GAAGe,iBAAiB,iBAGzD7B,KAAKK,KAAOqB,EAAQK,QAAOC,GAAOA,EAAIpB,QAAQ,cAAgBZ,KAAKc,KACnEd,KAAKiC,UAAYH,EAAaC,QAAOG,GAASA,EAAMtB,QAAQ,cAAgBZ,KAAKc,I,CAG3E,cAAAqB,CAAeC,EAAOC,EAAQ,GACpCD,EAAME,kBAAoBtC,KAAKC,YAAYsC,WAC3CH,EAAMI,QAAUxC,KAAKwC,QAAQD,WAC7BH,EAAMK,SAAYzC,KAAKI,gBAAkBgC,EAAM9B,KAAQ,KAAO,MAC9D8B,EAAM,SAAWC,C,CAGX,mBAAAK,GACN1C,KAAKK,KAAKsC,SAAQ,CAACP,EAAOC,KACxB,GAAIrC,KAAKI,gBAAkBgC,EAAM9B,KAAMN,KAAKG,eAAiBkC,EAC7DrC,KAAKmC,eAAeC,EAAOC,EAAM,IAGnCrC,KAAKiC,UAAUU,SAASP,IACtBpC,KAAKmC,eAAeC,EAAM,G,CAItB,UAAAQ,GACN,IAAIC,EAAY,WAChB,GAAI7C,KAAKwC,SAAWxC,KAAKwC,SAAW,UAAW,CAC7C,MAAMM,EAAmB,aAAa9C,KAAKwC,UAC3CK,GAAa,IAAMC,C,CAGrB,OAAOD,C,CAGT,iBAAAE,GACE/C,KAAKyB,iB,CAGP,mBAAAuB,GACEhD,KAAK0C,qB,CAGP,MAAAO,GACE,OACEC,EAACC,EAAI,CAAAnC,IAAA,6DAAkBhB,KAAKI,cAAegD,MAAOpD,KAAK4C,aAAcS,GAAIrD,KAAKC,aAC5EiD,EAAA,OAAAlC,IAAA,2CAAKoC,MAAM,oBAAoBE,KAAK,UAAsB,aAAAtD,KAAKuD,aAAcC,KAAK,YAChFN,EAAA,QAAAlC,IAAA,2CAAMV,KAAK,UAEb4C,EAAA,QAAAlC,IAAA,2CAAMV,KAAK,c","ignoreList":[]}