{"mappings":"AACA,cAAc,sBAAiC;AAG/C,SAAwB,mBAAmB;AAC3C,cAA8C,gBAAgB;;;;;;;;;;AAa9D,cAmBM,cAAc,YAAY;CAC9B;CAKA,AACA,UAAU;;;;CAKV,AACA;;;;CAKA,AACA;CAEA,UAAU,UAAU,eAAe;CAanC,OAAO,MAAM,MAAM,aAAa,QAAQ,QAAQ,SAAS;;AAQ3D,eAAe;AACf,SAAS","names":[],"sources":["../../../../src/web-components/alert/component.ts"],"sourcesContent":["import { godown, htmlSlot, StyleController, styles } from \"@godown/element\";\nimport { type TemplateResult, css, html } from \"lit\";\nimport { property } from \"lit/decorators.js\";\n\nimport { cssGlobalVars, GlobalStyle } from \"../../internal/global-style.js\";\nimport { RingBuilder, ringTypeAttribute, type RingType } from \"../../internal/ring.js\";\n\nconst protoName = \"alert\";\n\n/**\n * {@linkcode Alert} renders a alert.\n *\n * @slot - Alert content.\n * @slot title - Alert title.\n * @slot prefix - Alert prefix.\n * @slot suffix - Alert suffix.\n * @category feedback\n */\n@godown(protoName)\n@styles(css`\n  :host {\n    background: var(${cssGlobalVars.background});\n    color: var(${cssGlobalVars.foreground});\n  }\n\n  :host,\n  :where(:host([contents]) [part=\"root\"]),\n  b {\n    display: block;\n  }\n\n  [part=\"root\"] {\n    padding: 1em;\n    display: grid;\n    grid-template-columns: auto 1fr auto;\n  }\n`)\nclass Alert extends GlobalStyle {\n  constructor() {\n    super();\n    new StyleController(this, () => new RingBuilder({ type: this.ringType }).css);\n  }\n\n  @property({ attribute: ringTypeAttribute })\n  ringType: RingType = \"border\";\n\n  /**\n   * The title is bold and the icon height is the same as it.\n   */\n  @property()\n  title: string;\n\n  /**\n   * Content, if zero value, will be rendered as an unnamed slot.\n   */\n  @property()\n  content: string;\n\n  protected render(): TemplateResult<1> {\n    return html`\n      <div part=\"root\">\n        <div>${htmlSlot(\"prefix\")}</div>\n        <div part=\"content\">\n          <b part=\"title\">${htmlSlot(\"title\", this.title)}</b>\n          ${htmlSlot(\"\", this.content)}\n        </div>\n        <div>${htmlSlot(\"suffix\")}</div>\n      </div>\n    `;\n  }\n\n  static alert(root: HTMLElement, option: Partial<Alert>): Alert {\n    const ai = new this();\n    Object.assign(ai, option);\n    root.appendChild(ai);\n    return ai;\n  }\n}\n\nexport default Alert;\nexport { Alert };\n"],"version":3,"file":"component.d.ts"}