Add catalog package

2026-05-05 12:03:46 +00:00
commit 30946ce94e
17 changed files with 804 additions and 0 deletions
@@ -0,0 +1,37 @@
+import { DeesElement, html, customElement, css } from '@design.estate/dees-element';
+import { shxElementStyles } from './tokens.js';
+
+declare global {
+  interface HTMLElementTagNameMap {
+    'shx-badge': ShxBadge;
+  }
+}
+
+@customElement('shx-badge')
+export class ShxBadge extends DeesElement {
+  public static demo = () => html`<shx-badge>local-first</shx-badge>`;
+  public static demoGroups = ['smarthome.exchange primitives'];
+
+  public static styles = [
+    ...shxElementStyles,
+    css`
+      :host {
+        display: inline-flex;
+        align-items: center;
+        min-height: 22px;
+        padding: 0 8px;
+        border: 1px solid color-mix(in srgb, var(--shx-accent), transparent 70%);
+        border-radius: 999px;
+        background: var(--shx-accent-soft);
+        color: var(--shx-accent);
+        font: 600 11px/1 var(--shx-mono);
+        letter-spacing: 0.04em;
+        text-transform: uppercase;
+      }
+    `,
+  ];
+
+  public render() {
+    return html`<slot></slot>`;
+  }
+}