{"version":3,"file":"templates.cjs","names":[],"sources":["../../../src/inputs/shared/templates.ts"],"sourcesContent":["import { html } from '@vielzeug/ore';\nimport type { Readable } from '@vielzeug/ripple';\n\nimport { type CounterState, counterClassName } from '../../core';\n\n/**\n * Renders the standard assistive text region (helper/error) used across all\n * field components. Encapsulates the repeated `aria-live`/`hidden` markup so\n * each component only passes the data.\n *\n * @param assistiveId - The stable ID shared with the ARIA `aria-describedby` attribute.\n * @param errorText   - Reactive error text signal from the field primitive.\n * @param helperText  - Reactive helper text signal from the field primitive.\n * @param setRef      - Optional callback to capture the container element.\n */\nexport const renderHelperRegion = (\n  assistiveId: string,\n  errorText: Readable<string>,\n  helperText: Readable<string>,\n  setRef?: (el: HTMLElement | null) => void,\n) => {\n  return html`\n    <div\n      class=\"helper-text\"\n      part=\"helper-text\"\n      id=\"${assistiveId}\"\n      role=\"${() => (errorText.value ? 'alert' : null)}\"\n      aria-live=\"polite\"\n      ?hidden=\"${() => !errorText.value && !helperText.value}\"\n      ref=${(el: HTMLElement | null) => {\n        setRef?.(el);\n      }}>\n      ${() => errorText.value || helperText.value}\n    </div>\n  `;\n};\n\n/**\n * Inline error/success status icon shown inside a field — identical markup across\n * `ore-input`, `ore-textarea`, and `ore-message-composer` (previously hand-duplicated in all\n * three, down to the same derived-signal names).\n */\nexport const renderStatusIcon = (errorText: Readable<string>) => html`\n  <span\n    class=\"status-icon\"\n    part=\"status-icon\"\n    aria-hidden=\"true\"\n    data-status=\"${() => (errorText.value ? 'error' : 'success')}\">\n    ${() =>\n      errorText.value\n        ? html`\n            <ore-icon name=\"alert-circle\" size=\"14\" stroke-width=\"2\" aria-hidden=\"true\"></ore-icon>\n          `\n        : html`\n            <ore-icon name=\"check\" size=\"14\" stroke-width=\"2.5\" aria-hidden=\"true\"></ore-icon>\n          `}\n  </span>\n`;\n\n/**\n * Character counter + separate helper/error text regions below a field — identical across\n * `ore-textarea` and `ore-message-composer` (kept out of `ore-input`, which slots its\n * helper/error content and drives its counter off a different data-attribute scheme via its\n * own `char-counter` part — a genuinely different shape, not worth forcing into this one).\n */\nexport const renderFieldStatusRegion = (tf: {\n  assistiveId: string;\n  counter: Readable<CounterState> | null;\n  errorId: string;\n  errorText: Readable<string>;\n  helperText: Readable<string>;\n}) => html`\n  <span class=\"${() => counterClassName(tf.counter?.value)}\" aria-live=\"polite\" ?hidden=\"${() => !tf.counter}\">\n    ${() => tf.counter?.value.counterText.replace(' / ', '/') ?? ''}\n  </span>\n  <div\n    id=\"${tf.assistiveId}\"\n    class=\"helper-text\"\n    aria-live=\"polite\"\n    part=\"helper\"\n    ?hidden=\"${() => !!tf.errorText.value || !tf.helperText.value}\">\n    ${() => tf.helperText.value}\n  </div>\n  <div id=\"${tf.errorId}\" class=\"helper-text\" role=\"alert\" part=\"error\" ?hidden=\"${() => !tf.errorText.value}\">\n    ${() => tf.errorText.value}\n  </div>\n`;\n"],"mappings":"4EAeA,IAAa,GACX,EACA,EACA,EACA,IAEO,EAAA,IAAI;;;;YAID,EAAY;kBACH,EAAU,MAAQ,QAAU,KAAM;;qBAEhC,CAAC,EAAU,OAAS,CAAC,EAAW,MAAM;YAChD,GAA2B,CAChC,IAAS,CAAE,CACb,EAAE;YACM,EAAU,OAAS,EAAW,MAAM;;IAUrC,EAAoB,GAAgC,EAAA,IAAI;;;;;uBAK3C,EAAU,MAAQ,QAAU,UAAW;UAE3D,EAAU,MACN,EAAA,IAAI;;YAGJ,EAAA,IAAI;;YAEF;;EAUC,EAA2B,GAMlC,EAAA,IAAI;qBACa,EAAA,iBAAiB,EAAG,SAAS,KAAK,EAAE,oCAAsC,CAAC,EAAG,QAAQ;UACjG,EAAG,SAAS,MAAM,YAAY,QAAQ,MAAO,GAAG,GAAK,GAAG;;;UAG1D,EAAG,YAAY;;;;mBAIJ,CAAC,CAAC,EAAG,UAAU,OAAS,CAAC,EAAG,WAAW,MAAM;UACtD,EAAG,WAAW,MAAM;;aAEnB,EAAG,QAAQ,+DAAiE,CAAC,EAAG,UAAU,MAAM;UACjG,EAAG,UAAU,MAAM"}