{"version":3,"file":"BqCard-DSOYUDl_.cjs","names":[],"sources":["../src/components/card/BqCard.ts"],"sourcesContent":["/**\r\n * Card component - content container with optional header and footer.\r\n * @element bq-card\r\n * @prop {string}  title    - Card header title\r\n * @prop {boolean} elevated - box-shadow elevation\r\n * @prop {string}  padding  - none | sm | md | lg\r\n * @slot         - Card body content\r\n * @slot header  - Custom header\r\n * @slot footer  - Card footer\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 BqCardProps = { title: string; elevated: boolean; padding: string };\r\n\r\nconst definition: ComponentDefinition<BqCardProps> = {\r\n  props: {\r\n    title: { type: String, default: '' },\r\n    elevated: { type: Boolean, default: true },\r\n    padding: { type: String, default: 'md' },\r\n  },\r\n  styles: `\r\n    ${getBaseStyles()}\r\n    *, *::before, *::after { box-sizing: border-box; }\r\n    :host { display: block; }\r\n    .card {\r\n      background: var(--bq-bg-base,#fff);\r\n      border-radius: var(--bq-radius-xl,0.75rem);\r\n      border: 1px solid var(--bq-border-base,#e2e8f0);\r\n      overflow: hidden; font-family: var(--bq-font-family-sans);\r\n    }\r\n    :host([elevated]) .card { box-shadow: var(--bq-shadow-md); }\r\n    .card-header {\r\n      padding: var(--bq-space-5,1.25rem) var(--bq-space-6,1.5rem);\r\n      border-bottom: 1px solid var(--bq-border-base,#e2e8f0);\r\n    }\r\n    .card-header:empty { display: none; }\r\n    .card-title { font-size: var(--bq-font-size-lg,1.125rem); font-weight: var(--bq-font-weight-semibold,600); color: var(--bq-text-base,#0f172a); margin: 0; }\r\n    .card-body[data-padding=\"none\"] { padding: 0; }\r\n    .card-body[data-padding=\"sm\"]   { padding: var(--bq-space-3,0.75rem); }\r\n    .card-body[data-padding=\"md\"]   { padding: var(--bq-space-6,1.5rem); }\r\n    .card-body[data-padding=\"lg\"]   { padding: var(--bq-space-8,2rem); }\r\n    .card-footer {\r\n      padding: var(--bq-space-4,1rem) var(--bq-space-6,1.5rem);\r\n      border-top: 1px solid var(--bq-border-base,#e2e8f0);\r\n      background: var(--bq-bg-subtle,#f8fafc);\r\n    }\r\n    .card-footer:empty { display: none; }\r\n  `,\r\n  render({ props }) {\r\n    const headerContent = props.title\r\n      ? `<div class=\"card-header\" part=\"header\"><h3 class=\"card-title\">${escapeHtml(props.title)}</h3><slot name=\"header\"></slot></div>`\r\n      : '<slot name=\"header\"></slot>';\r\n    return html`\r\n      <article part=\"card\" class=\"card\">\r\n        ${headerContent}\r\n        <div\r\n          part=\"body\"\r\n          class=\"card-body\"\r\n          data-padding=\"${escapeHtml(props.padding)}\"\r\n        >\r\n          <slot></slot>\r\n        </div>\r\n        <div part=\"footer\" class=\"card-footer\"><slot name=\"footer\"></slot></div>\r\n      </article>\r\n    `;\r\n  },\r\n};\r\n\r\ncomponent<BqCardProps>('bq-card', definition);\r\n"],"mappings":";;;;;AAuEA,2BAAA,EAAuB,WAAW;CArDhC,OAAO;EACL,OAAO;GAAE,MAAM;GAAQ,SAAS;GAAI;EACpC,UAAU;GAAE,MAAM;GAAS,SAAS;GAAM;EAC1C,SAAS;GAAE,MAAM;GAAQ,SAAS;GAAM;EACzC;CACD,QAAQ;MACJ,eAAA,eAAe,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2BpB,OAAO,EAAE,SAAS;AAIhB,SAAO,2BAAA,CAAI;;UAHW,MAAM,QACxB,iEAAiE,2BAAA,GAAW,MAAM,MAAM,CAAC,0CACzF,gCAGgB;;;;0BAIE,2BAAA,GAAW,MAAM,QAAQ,CAAC;;;;;;;;CAUlB,CAAW"}