@dezkareid/components 0.0.0 → 1.0.1

package/README.md

@@ -1,19 +1,227 @@
 # @dezkareid/components
 
-A package to export UI components in formats like React, Astro, Vue, etc.
+A package that exports UI components for React, Astro, and Vue. Built on the `@dezkareid/design-tokens` design system with full light/dark theme support via CSS semantic tokens.
 
 ## Installation
 
 ```bash
-npm install @dezkareid/components
+pnpm add @dezkareid/components @dezkareid/design-tokens
 ```
 
-## Usage
+## Package Exports
 
-```javascript
-// Add usage examples here
+| Export | Points to | Notes |
+|---|---|---|
+| `@dezkareid/components/react` | `dist/react.js` | Pre-compiled ES module, includes `.d.ts` types |
+| `@dezkareid/components/astro` | `src/astro/index.ts` | Source — compiled by the consuming Astro app |
+| `@dezkareid/components/vue` | `src/vue/index.ts` | Source — compiled by the consuming Vite/Vue app |
+| `@dezkareid/components/css` | `dist/components.min.css` | Pre-compiled CSS Modules bundle |
+
+## Setup
+
+### 1. Import design tokens
+
+Import the design tokens CSS once at the root of your app — this provides all the CSS custom properties (`--color-*`, `--spacing-*`, etc.) that components depend on:
+
+```js
+import '@dezkareid/design-tokens/dist/css/variables.css';
+```
+
+### 2. Import component styles
+
+Import the compiled component styles once at the root of your app:
+
+```js
+import '@dezkareid/components/css';
+```
+
+> **Note:** The component CSS uses CSS Modules scoped class names. The `@dezkareid/components/css` export is the processed bundle that matches the class names used by the compiled JS — do not import the raw source CSS files from `src/css/`.
+
+Both imports must come before any component usage.
+
+---
+
+## Components
+
+### Button
+
+A clickable element for triggering actions.
+
+**Props**
+
+| Prop | Type | Default | Description |
+|---|---|---|---|
+| `variant` | `'primary' \| 'secondary' \| 'outline' \| 'ghost' \| 'success'` | `'primary'` | Visual style |
+| `size` | `'sm' \| 'md' \| 'lg'` | `'md'` | Size variant |
+| `disabled` | `boolean` | `false` | Disables interaction |
+
+#### React
+
+```tsx
+import { Button } from '@dezkareid/components/react';
+
+<Button variant="primary" size="md" onClick={() => {}}>Click me</Button>
+<Button variant="secondary" size="lg">Secondary</Button>
+<Button disabled>Disabled</Button>
+```
+
+#### Astro
+
+```astro
+---
+import { Button } from '@dezkareid/components/astro';
+---
+<Button variant="primary" size="md">Click me</Button>
+```
+
+#### Vue
+
+```vue
+<script setup>
+import { Button } from '@dezkareid/components/vue';
+</script>
+
+<template>
+  <Button variant="secondary" size="sm">Click me</Button>
+</template>
+```
+
+---
+
+### Tag
+
+A small inline label for categorising or annotating content. Accepts arbitrary slot/children.
+
+**Props**
+
+| Prop | Type | Default | Description |
+|---|---|---|---|
+| `variant` | `'default' \| 'success' \| 'danger'` | `'default'` | Semantic colour |
+
+#### React
+
+```tsx
+import { Tag } from '@dezkareid/components/react';
+
+<Tag variant="default">Draft</Tag>
+<Tag variant="success">Published</Tag>
+<Tag variant="danger">Error</Tag>
+<Tag><strong>Bold label</strong></Tag>
+```
+
+#### Astro
+
+```astro
+---
+import { Tag } from '@dezkareid/components/astro';
+---
+<Tag variant="success">Published</Tag>
 ```
 
+#### Vue
+
+```vue
+<script setup>
+import { Tag } from '@dezkareid/components/vue';
+</script>
+
+<template>
+  <Tag variant="danger">Error</Tag>
+</template>
+```
+
+---
+
+### Card
+
+A contained surface that groups related content.
+
+**Props**
+
+| Prop | Type | Default | Description |
+|---|---|---|---|
+| `elevation` | `'flat' \| 'raised'` | `'raised'` | Shadow depth |
+
+#### React
+
+```tsx
+import { Card } from '@dezkareid/components/react';
+
+<Card elevation="raised">
+  <h2>Title</h2>
+  <p>Body content</p>
+</Card>
+
+<Card elevation="flat">Flat card</Card>
+```
+
+#### Astro
+
+```astro
+---
+import { Card } from '@dezkareid/components/astro';
+---
+<Card elevation="raised">
+  <h2>Title</h2>
+  <p>Body</p>
+</Card>
+```
+
+#### Vue
+
+```vue
+<script setup>
+import { Card } from '@dezkareid/components/vue';
+</script>
+
+<template>
+  <Card elevation="flat">
+    <p>Content</p>
+  </Card>
+</template>
+```
+
+---
+
+### ThemeToggle
+
+A self-contained toggle that switches between light and dark colour schemes. Reads from and persists to `localStorage` (key: `color-scheme`), falling back to the OS `prefers-color-scheme` preference. Applies the theme by setting `color-scheme` on `<html>`.
+
+**Props**: none
+
+#### React
+
+```tsx
+import { ThemeToggle } from '@dezkareid/components/react';
+
+<ThemeToggle />
+```
+
+#### Astro
+
+```astro
+---
+import { ThemeToggle } from '@dezkareid/components/astro';
+---
+<ThemeToggle />
+```
+
+> The Astro component includes an inline script that runs before first paint to prevent FOUC.
+
+#### Vue
+
+```vue
+<script setup>
+import { ThemeToggle } from '@dezkareid/components/vue';
+</script>
+
+<template>
+  <ThemeToggle />
+</template>
+```
+
+---
+
 ## License
 
 ISC

package/dist/_virtual/_commonjsHelpers.js

@@ -0,0 +1,6 @@
+function getDefaultExportFromCjs (x) {
+	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
+}
+
+export { getDefaultExportFromCjs };
+//# sourceMappingURL=_commonjsHelpers.js.map

package/dist/_virtual/_commonjsHelpers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"_commonjsHelpers.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/dist/_virtual/index.js

@@ -0,0 +1,8 @@
+import { getDefaultExportFromCjs } from './_commonjsHelpers.js';
+import { __require as requireClassnames } from '../node_modules/.pnpm/classnames@2.5.1/node_modules/classnames/index.js';
+
+var classnamesExports = requireClassnames();
+var cx = /*@__PURE__*/getDefaultExportFromCjs(classnamesExports);
+
+export { cx as default };
+//# sourceMappingURL=index.js.map

package/dist/_virtual/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/_virtual/index2.js

@@ -0,0 +1,4 @@
+var classnames = {exports: {}};
+
+export { classnames as __module };
+//# sourceMappingURL=index2.js.map

package/dist/_virtual/index2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/astro/index.d.ts

@@ -0,0 +1,5 @@
+export { default as Button } from './Button/index.astro';
+export { default as Tag } from './Tag/index.astro';
+export { default as Card } from './Card/index.astro';
+export { default as ThemeToggle } from './ThemeToggle/index.astro';
+//# sourceMappingURL=index.d.ts.map

package/dist/astro/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/astro/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,GAAG,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,2BAA2B,CAAC"}

package/dist/components.min.css

@@ -0,0 +1 @@
+.button-module_button__-i1WR{align-items:center;border:none;border-radius:var(--spacing-4);cursor:pointer;display:inline-flex;font-family:var(--font-family-base);font-weight:var(--font-weight-medium);justify-content:center;line-height:var(--font-line-height-none);text-decoration:none;transition:opacity .15s ease;white-space:nowrap}.button-module_button--sm__oyPIp,.button-module_button--small__seN6c{font-size:var(--font-size-200);padding:var(--spacing-4) var(--spacing-12)}.button-module_button--md__KsJg5,.button-module_button--medium__4vh1u{font-size:var(--font-size-300);padding:var(--spacing-8) var(--spacing-24)}.button-module_button--large__g15uD,.button-module_button--lg__kuuR5{font-size:var(--font-size-400);padding:var(--spacing-12) var(--spacing-32)}.button-module_button--primary__5NKaZ{background-color:var(--color-primary);border:1px solid transparent;color:var(--color-text-inverse)}.button-module_button--primary__5NKaZ:hover:not(.button-module_button--disabled__5X7It){opacity:.88}.button-module_button--outline__inPG2,.button-module_button--secondary__7CZqp{background-color:transparent;border:1px solid var(--color-primary);color:var(--color-primary)}.button-module_button--outline__inPG2:hover:not(.button-module_button--disabled__5X7It),.button-module_button--secondary__7CZqp:hover:not(.button-module_button--disabled__5X7It){background-color:var(--color-background-secondary)}.button-module_button--success__Y-GUS{background-color:var(--color-success);border:1px solid transparent;color:var(--color-text-inverse)}.button-module_button--success__Y-GUS:hover:not(.button-module_button--disabled__5X7It){opacity:.88}.button-module_button--ghost__7k3yA{background-color:transparent;border:1px solid transparent;color:var(--color-text-primary)}.button-module_button--ghost__7k3yA:hover:not(.button-module_button--disabled__5X7It){background-color:var(--color-background-secondary)}.button-module_button--disabled__5X7It{cursor:not-allowed;opacity:.4;pointer-events:none}.tag-module_tag__DqU0X{align-items:center;border-radius:var(--spacing-4);display:inline-flex;font-family:var(--font-family-base);font-size:var(--font-size-100);font-weight:var(--font-weight-medium);line-height:var(--font-line-height-none);padding:var(--spacing-4) var(--spacing-8)}.tag-module_tag--default__s9pfU{background-color:var(--color-background-secondary);color:var(--color-text-primary)}.tag-module_tag--success__e8fMj{background-color:var(--color-success);color:var(--color-text-inverse)}.tag-module_tag--danger__9b-l4{background-color:var(--color-danger);color:var(--color-text-inverse)}.card-module_card__KEaH3{background-color:var(--color-background-secondary);border-radius:var(--spacing-8);color:var(--color-text-primary);display:block;padding:var(--spacing-24);width:100%}.card-module_card--raised__hBodH{box-shadow:0 2px 8px rgba(0,0,0,.12)}.card-module_card--flat__vLG1l{box-shadow:none}.theme-toggle-module_theme-toggle__pBmqG{align-items:center;background-color:transparent;border:none;border:1px solid var(--color-background-secondary);border-radius:var(--spacing-4);color:var(--color-text-primary);cursor:pointer;display:inline-flex;font-family:var(--font-family-base);font-size:var(--font-size-200);font-weight:var(--font-weight-medium);gap:var(--spacing-8);justify-content:center;line-height:var(--font-line-height-none);padding:var(--spacing-8) var(--spacing-12)}.theme-toggle-module_theme-toggle__pBmqG:hover{background-color:var(--color-background-secondary)}.theme-toggle-module_theme-toggle--dark__9yf3H{border-color:var(--color-primary);color:var(--color-primary)}

package/dist/css/button.module.css.js

@@ -0,0 +1,4 @@
+var styles = {"button":"button-module_button__-i1WR","button--sm":"button-module_button--sm__oyPIp","button--small":"button-module_button--small__seN6c","button--md":"button-module_button--md__KsJg5","button--medium":"button-module_button--medium__4vh1u","button--lg":"button-module_button--lg__kuuR5","button--large":"button-module_button--large__g15uD","button--primary":"button-module_button--primary__5NKaZ","button--disabled":"button-module_button--disabled__5X7It","button--secondary":"button-module_button--secondary__7CZqp","button--outline":"button-module_button--outline__inPG2","button--success":"button-module_button--success__Y-GUS","button--ghost":"button-module_button--ghost__7k3yA"};
+
+export { styles as default };
+//# sourceMappingURL=button.module.css.js.map

package/dist/css/button.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/css/card.module.css.js

@@ -0,0 +1,4 @@
+var styles = {"card":"card-module_card__KEaH3","card--raised":"card-module_card--raised__hBodH","card--flat":"card-module_card--flat__vLG1l"};
+
+export { styles as default };
+//# sourceMappingURL=card.module.css.js.map

package/dist/css/card.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"card.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/css/index.d.ts

@@ -0,0 +1,5 @@
+import './button.module.css';
+import './card.module.css';
+import './tag.module.css';
+import './theme-toggle.module.css';
+//# sourceMappingURL=index.d.ts.map

package/dist/css/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/css/index.ts"],"names":[],"mappings":"AAAA,OAAO,qBAAqB,CAAC;AAC7B,OAAO,mBAAmB,CAAC;AAC3B,OAAO,kBAAkB,CAAC;AAC1B,OAAO,2BAA2B,CAAC"}

package/dist/css/tag.module.css.js

@@ -0,0 +1,4 @@
+var styles = {"tag":"tag-module_tag__DqU0X","tag--default":"tag-module_tag--default__s9pfU","tag--success":"tag-module_tag--success__e8fMj","tag--danger":"tag-module_tag--danger__9b-l4"};
+
+export { styles as default };
+//# sourceMappingURL=tag.module.css.js.map

package/dist/css/tag.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tag.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/css/theme-toggle.module.css.js

@@ -0,0 +1,4 @@
+var styles = {"theme-toggle":"theme-toggle-module_theme-toggle__pBmqG","theme-toggle--dark":"theme-toggle-module_theme-toggle--dark__9yf3H"};
+
+export { styles as default };
+//# sourceMappingURL=theme-toggle.module.css.js.map

package/dist/css/theme-toggle.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme-toggle.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/node_modules/.pnpm/classnames@2.5.1/node_modules/classnames/index.js

@@ -0,0 +1,86 @@
+import { __module as classnames } from '../../../../../_virtual/index2.js';
+
+/*!
+	Copyright (c) 2018 Jed Watson.
+	Licensed under the MIT License (MIT), see
+	http://jedwatson.github.io/classnames
+*/
+
+var hasRequiredClassnames;
+
+function requireClassnames () {
+	if (hasRequiredClassnames) return classnames.exports;
+	hasRequiredClassnames = 1;
+	(function (module) {
+		/* global define */
+
+		(function () {
+
+			var hasOwn = {}.hasOwnProperty;
+
+			function classNames () {
+				var classes = '';
+
+				for (var i = 0; i < arguments.length; i++) {
+					var arg = arguments[i];
+					if (arg) {
+						classes = appendClass(classes, parseValue(arg));
+					}
+				}
+
+				return classes;
+			}
+
+			function parseValue (arg) {
+				if (typeof arg === 'string' || typeof arg === 'number') {
+					return arg;
+				}
+
+				if (typeof arg !== 'object') {
+					return '';
+				}
+
+				if (Array.isArray(arg)) {
+					return classNames.apply(null, arg);
+				}
+
+				if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {
+					return arg.toString();
+				}
+
+				var classes = '';
+
+				for (var key in arg) {
+					if (hasOwn.call(arg, key) && arg[key]) {
+						classes = appendClass(classes, key);
+					}
+				}
+
+				return classes;
+			}
+
+			function appendClass (value, newClass) {
+				if (!newClass) {
+					return value;
+				}
+			
+				if (value) {
+					return value + ' ' + newClass;
+				}
+			
+				return value + newClass;
+			}
+
+			if (module.exports) {
+				classNames.default = classNames;
+				module.exports = classNames;
+			} else {
+				window.classNames = classNames;
+			}
+		}()); 
+	} (classnames));
+	return classnames.exports;
+}
+
+export { requireClassnames as __require };
+//# sourceMappingURL=index.js.map

package/dist/node_modules/.pnpm/classnames@2.5.1/node_modules/classnames/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../../../../node_modules/.pnpm/classnames@2.5.1/node_modules/classnames/index.js"],"sourcesContent":["/*!\n\tCopyright (c) 2018 Jed Watson.\n\tLicensed under the MIT License (MIT), see\n\thttp://jedwatson.github.io/classnames\n*/\n/* global define */\n\n(function () {\n\t'use strict';\n\n\tvar hasOwn = {}.hasOwnProperty;\n\n\tfunction classNames () {\n\t\tvar classes = '';\n\n\t\tfor (var i = 0; i < arguments.length; i++) {\n\t\t\tvar arg = arguments[i];\n\t\t\tif (arg) {\n\t\t\t\tclasses = appendClass(classes, parseValue(arg));\n\t\t\t}\n\t\t}\n\n\t\treturn classes;\n\t}\n\n\tfunction parseValue (arg) {\n\t\tif (typeof arg === 'string' || typeof arg === 'number') {\n\t\t\treturn arg;\n\t\t}\n\n\t\tif (typeof arg !== 'object') {\n\t\t\treturn '';\n\t\t}\n\n\t\tif (Array.isArray(arg)) {\n\t\t\treturn classNames.apply(null, arg);\n\t\t}\n\n\t\tif (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {\n\t\t\treturn arg.toString();\n\t\t}\n\n\t\tvar classes = '';\n\n\t\tfor (var key in arg) {\n\t\t\tif (hasOwn.call(arg, key) && arg[key]) {\n\t\t\t\tclasses = appendClass(classes, key);\n\t\t\t}\n\t\t}\n\n\t\treturn classes;\n\t}\n\n\tfunction appendClass (value, newClass) {\n\t\tif (!newClass) {\n\t\t\treturn value;\n\t\t}\n\t\n\t\tif (value) {\n\t\t\treturn value + ' ' + newClass;\n\t\t}\n\t\n\t\treturn value + newClass;\n\t}\n\n\tif (typeof module !== 'undefined' && module.exports) {\n\t\tclassNames.default = classNames;\n\t\tmodule.exports = classNames;\n\t} else if (typeof define === 'function' && typeof define.amd === 'object' && define.amd) {\n\t\t// register as 'classnames', consistent with npm package name\n\t\tdefine('classnames', [], function () {\n\t\t\treturn classNames;\n\t\t});\n\t} else {\n\t\twindow.classNames = classNames;\n\t}\n}());\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAKA;;AAEA,EAAA,CAAC,YAAY;;AAGb,GAAC,IAAI,MAAM,GAAG,EAAE,CAAC,cAAc;;GAE9B,SAAS,UAAU,IAAI;IACtB,IAAI,OAAO,GAAG,EAAE;;AAElB,IAAE,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,SAAS,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;AAC7C,KAAG,IAAI,GAAG,GAAG,SAAS,CAAC,CAAC,CAAC;KACtB,IAAI,GAAG,EAAE;MACR,OAAO,GAAG,WAAW,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,CAAC,CAAC;AACnD,KAAA;AACA,IAAA;;AAEA,IAAE,OAAO,OAAO;AAChB,GAAA;;AAEA,GAAC,SAAS,UAAU,EAAE,GAAG,EAAE;IACzB,IAAI,OAAO,GAAG,KAAK,QAAQ,IAAI,OAAO,GAAG,KAAK,QAAQ,EAAE;AAC1D,KAAG,OAAO,GAAG;AACb,IAAA;;AAEA,IAAE,IAAI,OAAO,GAAG,KAAK,QAAQ,EAAE;AAC/B,KAAG,OAAO,EAAE;AACZ,IAAA;;AAEA,IAAE,IAAI,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE;KACvB,OAAO,UAAU,CAAC,KAAK,CAAC,IAAI,EAAE,GAAG,CAAC;AACrC,IAAA;;IAEE,IAAI,GAAG,CAAC,QAAQ,KAAK,MAAM,CAAC,SAAS,CAAC,QAAQ,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,QAAQ,EAAE,CAAC,QAAQ,CAAC,eAAe,CAAC,EAAE;AACxG,KAAG,OAAO,GAAG,CAAC,QAAQ,EAAE;AACxB,IAAA;;IAEE,IAAI,OAAO,GAAG,EAAE;;AAElB,IAAE,KAAK,IAAI,GAAG,IAAI,GAAG,EAAE;AACvB,KAAG,IAAI,MAAM,CAAC,IAAI,CAAC,GAAG,EAAE,GAAG,CAAC,IAAI,GAAG,CAAC,GAAG,CAAC,EAAE;AAC1C,MAAI,OAAO,GAAG,WAAW,CAAC,OAAO,EAAE,GAAG,CAAC;AACvC,KAAA;AACA,IAAA;;AAEA,IAAE,OAAO,OAAO;AAChB,GAAA;;AAEA,GAAC,SAAS,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE;IACtC,IAAI,CAAC,QAAQ,EAAE;AACjB,KAAG,OAAO,KAAK;AACf,IAAA;AACA;IACE,IAAI,KAAK,EAAE;AACb,KAAG,OAAO,KAAK,GAAG,GAAG,GAAG,QAAQ;AAChC,IAAA;AACA;IACE,OAAO,KAAK,GAAG,QAAQ;AACzB,GAAA;;GAEC,IAAqC,MAAM,CAAC,OAAO,EAAE;AACtD,IAAE,UAAU,CAAC,OAAO,GAAG,UAAU;AACjC,IAAE,iBAAiB,UAAU;AAC7B,GAAA,CAAE,MAKM;AACR,IAAE,MAAM,CAAC,UAAU,GAAG,UAAU;AAChC,GAAA;AACA,EAAA,CAAC,EAAE,EAAA;;;;;;;","x_google_ignoreList":[0]}

package/dist/react/Button/index.d.ts

@@ -0,0 +1,6 @@
+import type { ButtonHTMLAttributes } from 'react';
+import type { ButtonProps } from '../../shared/types/button';
+type Props = ButtonProps & ButtonHTMLAttributes<HTMLButtonElement>;
+export declare function Button({ variant, size, disabled, children, className, ...rest }: Props): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/react/Button/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/react/Button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAElD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAG7D,KAAK,KAAK,GAAG,WAAW,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,CAAC;AAEnE,wBAAgB,MAAM,CAAC,EACrB,OAAmB,EACnB,IAAW,EACX,QAAgB,EAChB,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACR,EAAE,KAAK,2CAgBP"}

package/dist/react/Button/index.js

@@ -0,0 +1,10 @@
+import { jsx } from 'react/jsx-runtime';
+import cx from '../../_virtual/index.js';
+import styles from '../../css/button.module.css.js';
+
+function Button({ variant = 'primary', size = 'md', disabled = false, children, className, ...rest }) {
+    return (jsx("button", { className: cx(styles.button, styles[`button--${variant}`], styles[`button--${size}`], disabled && styles['button--disabled'], className), disabled: disabled, ...rest, children: children }));
+}
+
+export { Button };
+//# sourceMappingURL=index.js.map

package/dist/react/Button/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/react/Button/index.tsx"],"sourcesContent":[null],"names":["_jsx"],"mappings":";;;;AAOM,SAAU,MAAM,CAAC,EACrB,OAAO,GAAG,SAAS,EACnB,IAAI,GAAG,IAAI,EACX,QAAQ,GAAG,KAAK,EAChB,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACD,EAAA;AACN,IAAA,QACEA,GAAA,CAAA,QAAA,EAAA,EACE,SAAS,EAAE,EAAE,CACX,MAAM,CAAC,MAAM,EACb,MAAM,CAAC,WAAW,OAAO,CAAA,CAAE,CAAC,EAC5B,MAAM,CAAC,CAAA,QAAA,EAAW,IAAI,EAAE,CAAC,EACzB,QAAQ,IAAI,MAAM,CAAC,kBAAkB,CAAC,EACtC,SAAS,CACV,EACD,QAAQ,EAAE,QAAQ,EAAA,GACd,IAAI,YAEP,QAAQ,EAAA,CACF;AAEb;;;;"}

package/dist/react/Card/index.d.ts

@@ -0,0 +1,6 @@
+import type { HTMLAttributes } from 'react';
+import type { CardProps } from '../../shared/types/card';
+type Props = CardProps & HTMLAttributes<HTMLDivElement>;
+export declare function Card({ elevation, children, className, ...rest }: Props): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/react/Card/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/react/Card/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAGzD,KAAK,KAAK,GAAG,SAAS,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAExD,wBAAgB,IAAI,CAAC,EAAE,SAAoB,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,KAAK,2CAMjF"}

package/dist/react/Card/index.js

@@ -0,0 +1,10 @@
+import { jsx } from 'react/jsx-runtime';
+import cx from '../../_virtual/index.js';
+import styles from '../../css/card.module.css.js';
+
+function Card({ elevation = 'raised', children, className, ...rest }) {
+    return (jsx("div", { className: cx(styles.card, styles[`card--${elevation}`], className), ...rest, children: children }));
+}
+
+export { Card };
+//# sourceMappingURL=index.js.map

package/dist/react/Card/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/react/Card/index.tsx"],"sourcesContent":[null],"names":["_jsx"],"mappings":";;;;AAOM,SAAU,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,IAAI,EAAS,EAAA;IAChF,QACEA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,SAAS,SAAS,CAAA,CAAE,CAAC,EAAE,SAAS,CAAC,EAAA,GAAM,IAAI,EAAA,QAAA,EAC/E,QAAQ,EAAA,CACL;AAEV;;;;"}

package/dist/react/Tag/index.d.ts

@@ -0,0 +1,6 @@
+import type { HTMLAttributes } from 'react';
+import type { TagProps } from '../../shared/types/tag';
+type Props = TagProps & HTMLAttributes<HTMLSpanElement>;
+export declare function Tag({ variant, children, className, ...rest }: Props): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/react/Tag/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/react/Tag/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAGvD,KAAK,KAAK,GAAG,QAAQ,GAAG,cAAc,CAAC,eAAe,CAAC,CAAC;AAExD,wBAAgB,GAAG,CAAC,EAAE,OAAmB,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,KAAK,2CAM/E"}

package/dist/react/Tag/index.js

@@ -0,0 +1,10 @@
+import { jsx } from 'react/jsx-runtime';
+import cx from '../../_virtual/index.js';
+import styles from '../../css/tag.module.css.js';
+
+function Tag({ variant = 'default', children, className, ...rest }) {
+    return (jsx("span", { className: cx(styles.tag, styles[`tag--${variant}`], className), ...rest, children: children }));
+}
+
+export { Tag };
+//# sourceMappingURL=index.js.map

package/dist/react/Tag/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/react/Tag/index.tsx"],"sourcesContent":[null],"names":["_jsx"],"mappings":";;;;AAOM,SAAU,GAAG,CAAC,EAAE,OAAO,GAAG,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,IAAI,EAAS,EAAA;IAC9E,QACEA,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,GAAG,EAAE,MAAM,CAAC,QAAQ,OAAO,CAAA,CAAE,CAAC,EAAE,SAAS,CAAC,EAAA,GAAM,IAAI,EAAA,QAAA,EAC5E,QAAQ,EAAA,CACJ;AAEX;;;;"}

package/dist/react/ThemeToggle/index.d.ts

@@ -0,0 +1,2 @@
+export declare function ThemeToggle(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/react/ThemeToggle/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/react/ThemeToggle/index.tsx"],"names":[],"mappings":"AAMA,wBAAgB,WAAW,4CA6B1B"}

package/dist/react/ThemeToggle/index.js

@@ -0,0 +1,25 @@
+import { jsx } from 'react/jsx-runtime';
+import { useState, useEffect } from 'react';
+import cx from '../../_virtual/index.js';
+import { getInitialTheme, applyTheme, persistTheme } from '../../shared/js/theme.js';
+import styles from '../../css/theme-toggle.module.css.js';
+
+function ThemeToggle() {
+    const [theme, setTheme] = useState('light');
+    useEffect(() => {
+        const initial = getInitialTheme();
+        setTheme(initial);
+        applyTheme(initial);
+    }, []);
+    function toggle() {
+        const next = theme === 'light' ? 'dark' : 'light';
+        setTheme(next);
+        applyTheme(next);
+        persistTheme(next);
+    }
+    const isDark = theme === 'dark';
+    return (jsx("button", { type: "button", className: cx(styles['theme-toggle'], isDark && styles['theme-toggle--dark']), onClick: toggle, "aria-label": isDark ? 'Switch to light mode' : 'Switch to dark mode', "aria-pressed": isDark, children: isDark ? 'Dark' : 'Light' }));
+}
+
+export { ThemeToggle };
+//# sourceMappingURL=index.js.map

package/dist/react/ThemeToggle/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/react/ThemeToggle/index.tsx"],"sourcesContent":[null],"names":["_jsx"],"mappings":";;;;;;SAMgB,WAAW,GAAA;IACzB,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAQ,OAAO,CAAC;IAElD,SAAS,CAAC,MAAK;AACb,QAAA,MAAM,OAAO,GAAG,eAAe,EAAE;QACjC,QAAQ,CAAC,OAAO,CAAC;QACjB,UAAU,CAAC,OAAO,CAAC;IACrB,CAAC,EAAE,EAAE,CAAC;AAEN,IAAA,SAAS,MAAM,GAAA;AACb,QAAA,MAAM,IAAI,GAAU,KAAK,KAAK,OAAO,GAAG,MAAM,GAAG,OAAO;QACxD,QAAQ,CAAC,IAAI,CAAC;QACd,UAAU,CAAC,IAAI,CAAC;QAChB,YAAY,CAAC,IAAI,CAAC;IACpB;AAEA,IAAA,MAAM,MAAM,GAAG,KAAK,KAAK,MAAM;IAE/B,QACEA,gBACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,cAAc,CAAC,EAAE,MAAM,IAAI,MAAM,CAAC,oBAAoB,CAAC,CAAC,EAC7E,OAAO,EAAE,MAAM,EAAA,YAAA,EACH,MAAM,GAAG,sBAAsB,GAAG,qBAAqB,EAAA,cAAA,EACrD,MAAM,YAEnB,MAAM,GAAG,MAAM,GAAG,OAAO,EAAA,CACnB;AAEb;;;;"}

package/dist/react/index.d.ts

@@ -0,0 +1,5 @@
+export { Button } from './Button/index';
+export { Tag } from './Tag/index';
+export { Card } from './Card/index';
+export { ThemeToggle } from './ThemeToggle/index';
+//# sourceMappingURL=index.d.ts.map

package/dist/react/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/react/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AACxC,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAClC,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AACpC,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC"}

package/dist/react/index.js

@@ -0,0 +1,5 @@
+export { Button } from './Button/index.js';
+export { Tag } from './Tag/index.js';
+export { Card } from './Card/index.js';
+export { ThemeToggle } from './ThemeToggle/index.js';
+//# sourceMappingURL=index.js.map

package/dist/react/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/shared/js/theme.d.ts

@@ -0,0 +1,5 @@
+import type { Theme } from '../types/theme-toggle';
+export declare function getInitialTheme(): Theme;
+export declare function applyTheme(theme: Theme): void;
+export declare function persistTheme(theme: Theme): void;
+//# sourceMappingURL=theme.d.ts.map

package/dist/shared/js/theme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/shared/js/theme.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAInD,wBAAgB,eAAe,IAAI,KAAK,CAOvC;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI,CAG7C;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI,CAG/C"}

package/dist/shared/js/theme.js

@@ -0,0 +1,22 @@
+const STORAGE_KEY = 'color-scheme';
+function getInitialTheme() {
+    if (typeof window === 'undefined')
+        return 'light';
+    const stored = localStorage.getItem(STORAGE_KEY);
+    if (stored === 'light' || stored === 'dark')
+        return stored;
+    return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+}
+function applyTheme(theme) {
+    if (typeof window === 'undefined')
+        return;
+    document.documentElement.setAttribute('color-scheme', theme);
+}
+function persistTheme(theme) {
+    if (typeof window === 'undefined')
+        return;
+    localStorage.setItem(STORAGE_KEY, theme);
+}
+
+export { applyTheme, getInitialTheme, persistTheme };
+//# sourceMappingURL=theme.js.map

package/dist/shared/js/theme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.js","sources":["../../../src/shared/js/theme.ts"],"sourcesContent":[null],"names":[],"mappings":"AAEA,MAAM,WAAW,GAAG,cAAc;SAElB,eAAe,GAAA;IAC7B,IAAI,OAAO,MAAM,KAAK,WAAW;AAAE,QAAA,OAAO,OAAO;IAEjD,MAAM,MAAM,GAAG,YAAY,CAAC,OAAO,CAAC,WAAW,CAAC;AAChD,IAAA,IAAI,MAAM,KAAK,OAAO,IAAI,MAAM,KAAK,MAAM;AAAE,QAAA,OAAO,MAAM;AAE1D,IAAA,OAAO,MAAM,CAAC,UAAU,CAAC,8BAA8B,CAAC,CAAC,OAAO,GAAG,MAAM,GAAG,OAAO;AACrF;AAEM,SAAU,UAAU,CAAC,KAAY,EAAA;IACrC,IAAI,OAAO,MAAM,KAAK,WAAW;QAAE;IACnC,QAAQ,CAAC,eAAe,CAAC,YAAY,CAAC,cAAc,EAAE,KAAK,CAAC;AAC9D;AAEM,SAAU,YAAY,CAAC,KAAY,EAAA;IACvC,IAAI,OAAO,MAAM,KAAK,WAAW;QAAE;AACnC,IAAA,YAAY,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,CAAC;AAC1C;;;;"}

package/dist/shared/types/button.d.ts

@@ -0,0 +1,8 @@
+export type ButtonVariant = 'primary' | 'secondary' | 'outline' | 'ghost' | 'success';
+export type ButtonSize = 'sm' | 'md' | 'lg' | 'small' | 'medium' | 'large';
+export interface ButtonProps {
+    variant?: ButtonVariant;
+    size?: ButtonSize;
+    disabled?: boolean;
+}
+//# sourceMappingURL=button.d.ts.map

package/dist/shared/types/button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/shared/types/button.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC;AACtF,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAE3E,MAAM,WAAW,WAAW;IAC1B,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB"}

package/dist/shared/types/card.d.ts

@@ -0,0 +1,5 @@
+export type CardElevation = 'flat' | 'raised';
+export interface CardProps {
+    elevation?: CardElevation;
+}
+//# sourceMappingURL=card.d.ts.map

package/dist/shared/types/card.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../../src/shared/types/card.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,QAAQ,CAAC;AAE9C,MAAM,WAAW,SAAS;IACxB,SAAS,CAAC,EAAE,aAAa,CAAC;CAC3B"}