{"version":3,"file":"BqBadge-CZ6bbple.cjs","names":[],"sources":["../src/components/badge/BqBadge.ts"],"sourcesContent":["/**\r\n * Badge component - small status/label indicator.\r\n * @element bq-badge\r\n * @prop {string}  variant - primary | secondary | success | danger | warning | info | outline\r\n * @prop {string}  size    - sm | md | lg\r\n * @prop {boolean} pill    - fully-rounded\r\n * @slot - Badge content\r\n */\r\nimport { component, html } from '@bquery/bquery/component';\r\nimport type { ComponentDefinition } from '@bquery/bquery/component';\r\nimport { escapeHtml } from '@bquery/bquery/security';\r\nimport { getBaseStyles } from '../../utils/styles.js';\r\n\r\ntype BqBadgeProps = { variant: string; size: string; pill: boolean };\r\n\r\nconst definition: ComponentDefinition<BqBadgeProps> = {\r\n  props: {\r\n    variant: { type: String, default: 'primary' },\r\n    size:    { type: String, default: 'md' },\r\n    pill:    { type: Boolean, default: false },\r\n  },\r\n  styles: `\r\n    ${getBaseStyles()}\r\n    :host { display: inline-flex; }\r\n    .badge {\r\n      display: inline-flex; align-items: center; gap: 0.25rem;\r\n      font-weight: var(--bq-font-weight-semibold,600); line-height: 1; white-space: nowrap;\r\n      border-radius: var(--bq-radius-md,0.375rem);\r\n    }\r\n    :host([pill]) .badge { border-radius: var(--bq-radius-full,9999px); }\r\n    .badge[data-size=\"sm\"] { font-size: 0.6875rem; padding: 0.125rem 0.5rem; }\r\n    .badge[data-size=\"md\"] { font-size: 0.75rem; padding: 0.2rem 0.6rem; }\r\n    .badge[data-size=\"lg\"] { font-size: 0.875rem; padding: 0.3rem 0.75rem; }\r\n    .badge[data-variant=\"primary\"]   { background: var(--bq-color-primary-100,#dbeafe); color: var(--bq-color-primary-700,#1d4ed8); }\r\n    .badge[data-variant=\"secondary\"] { background: var(--bq-color-secondary-100,#f1f5f9); color: var(--bq-color-secondary-700,#334155); }\r\n    .badge[data-variant=\"success\"]   { background: var(--bq-color-success-100,#dcfce7); color: var(--bq-color-success-700,#15803d); }\r\n    .badge[data-variant=\"danger\"]    { background: var(--bq-color-danger-100,#fee2e2); color: var(--bq-color-danger-700,#b91c1c); }\r\n    .badge[data-variant=\"warning\"]   { background: var(--bq-color-warning-100,#fef3c7); color: var(--bq-color-warning-700,#b45309); }\r\n    .badge[data-variant=\"info\"]      { background: var(--bq-color-info-100,#dbeafe); color: var(--bq-color-info-700,#1d4ed8); }\r\n    .badge[data-variant=\"outline\"]   { background: transparent; color: var(--bq-text-base,#0f172a); border: 1.5px solid var(--bq-border-emphasis,#cbd5e1); }\r\n  `,\r\n  render({ props }) {\r\n    return html`<span part=\"badge\" class=\"badge\" data-variant=\"${escapeHtml(props.variant)}\" data-size=\"${escapeHtml(props.size)}\"><slot></slot></span>`;\r\n  },\r\n};\r\n\r\ncomponent<BqBadgeProps>('bq-badge', definition);\r\n"],"mappings":";;;;;;;;;;;;;AA8CA,2BAAA,EAAwB,YAAY;CA9BlC,OAAO;EACL,SAAS;GAAE,MAAM;GAAQ,SAAS;GAAW;EAC7C,MAAS;GAAE,MAAM;GAAQ,SAAS;GAAM;EACxC,MAAS;GAAE,MAAM;GAAS,SAAS;GAAO;EAC3C;CACD,QAAQ;MACJ,eAAA,eAAe,CAAC;;;;;;;;;;;;;;;;;;;CAmBpB,OAAO,EAAE,SAAS;AAChB,SAAO,2BAAA,CAAI,kDAAkD,2BAAA,GAAW,MAAM,QAAQ,CAAC,eAAe,2BAAA,GAAW,MAAM,KAAK,CAAC;;CAI7F,CAAW"}