{"version":3,"file":"BqDivider-BRapuIDG.cjs","names":[],"sources":["../src/components/divider/BqDivider.ts"],"sourcesContent":["/**\r\n * Divider component - horizontal or vertical separator.\r\n * @element bq-divider\r\n * @prop {string} orientation - horizontal | vertical\r\n * @prop {string} variant     - solid | dashed | dotted\r\n * @prop {string} label       - Optional center label\r\n */\r\nimport type { ComponentDefinition } from '@bquery/bquery/component';\r\nimport { component, html } from '@bquery/bquery/component';\r\nimport { escapeHtml } from '@bquery/bquery/security';\r\nimport { getBaseStyles } from '../../utils/styles.js';\r\n\r\ntype BqDividerProps = { orientation: string; variant: string; label: string };\r\n\r\nconst definition: ComponentDefinition<BqDividerProps> = {\r\n  props: {\r\n    orientation: { type: String, default: 'horizontal' },\r\n    variant: { type: String, default: 'solid' },\r\n    label: { type: String, default: '' },\r\n  },\r\n  styles: `\r\n    ${getBaseStyles()}\r\n    :host { display: block; }\r\n    .divider {\r\n      display: flex; align-items: center; gap: 0.75rem;\r\n      color: var(--bq-text-subtle,#94a3b8);\r\n      font-family: var(--bq-font-family-sans);\r\n      font-size: var(--bq-font-size-sm,0.875rem);\r\n    }\r\n    .line {\r\n      flex: 1; border: none; border-top: 1px solid var(--bq-border-base,#e2e8f0); margin: 0;\r\n    }\r\n    .divider[data-variant=\"dashed\"] .line { border-top-style: dashed; }\r\n    .divider[data-variant=\"dotted\"] .line { border-top-style: dotted; }\r\n    :host([orientation=\"vertical\"]) .divider { flex-direction: column; height: 100%; width: fit-content; }\r\n    :host([orientation=\"vertical\"]) .line { flex: 1; border-top: none; border-left: 1px solid var(--bq-border-base,#e2e8f0); width: 0; }\r\n    :host([orientation=\"vertical\"]) [part=\"label\"] {\r\n      writing-mode: vertical-rl;\r\n      text-orientation: mixed;\r\n      line-height: 1;\r\n      white-space: nowrap;\r\n    }\r\n  `,\r\n  render({ props }) {\r\n    const label = props.label\r\n      ? `<span part=\"label\">${escapeHtml(props.label)}</span>`\r\n      : '';\r\n    return html`<div\r\n      part=\"divider\"\r\n      class=\"divider\"\r\n      data-variant=\"${escapeHtml(props.variant)}\"\r\n      role=\"separator\"\r\n      aria-orientation=\"${escapeHtml(props.orientation)}\"\r\n    >\r\n      <hr class=\"line\" part=\"line\" />\r\n      ${label} ${props.label ? '<hr class=\"line\" part=\"line\" />' : ''}\r\n    </div>`;\r\n  },\r\n};\r\n\r\ncomponent<BqDividerProps>('bq-divider', definition);\r\n"],"mappings":";;;;;AA4DA,2BAAA,EAA0B,cAAc;CA7CtC,OAAO;EACL,aAAa;GAAE,MAAM;GAAQ,SAAS;GAAc;EACpD,SAAS;GAAE,MAAM;GAAQ,SAAS;GAAS;EAC3C,OAAO;GAAE,MAAM;GAAQ,SAAS;GAAI;EACrC;CACD,QAAQ;MACJ,eAAA,eAAe,CAAC;;;;;;;;;;;;;;;;;;;;;;CAsBpB,OAAO,EAAE,SAAS;EAChB,MAAM,QAAQ,MAAM,QAChB,sBAAsB,2BAAA,GAAW,MAAM,MAAM,CAAC,WAC9C;AACJ,SAAO,2BAAA,CAAI;;;sBAGO,2BAAA,GAAW,MAAM,QAAQ,CAAC;;0BAEtB,2BAAA,GAAW,MAAM,YAAY,CAAC;;;QAGhD,MAAM,GAAG,MAAM,QAAQ,wCAAoC,GAAG;;;CAK9B,CAAW"}