@dataverse-kit/fluent-theme 0.2.0

package/README.md

@@ -0,0 +1,41 @@
+# @dataverse-kit/fluent-theme
+
+The Dynamics CE **Fluent UI v9** theme, declared once.
+
+```bash
+npm install @dataverse-kit/fluent-theme @fluentui/react-components
+```
+
+```tsx
+import { FluentProvider } from '@fluentui/react-components';
+import { createDynamicsV9Theme } from '@dataverse-kit/fluent-theme';
+
+<FluentProvider theme={createDynamicsV9Theme()}>{children}</FluentProvider>;
+```
+
+## Exports
+
+| Export | What |
+|---|---|
+| `dynamicsBrandRamp` | The 16-slot `BrandVariants` ramp. Slots 60/70/80 are pinned to `@dataverse-kit/design-tokens`' brand triad (`#005a9e` / `#106ebe` / `#0078d4`), so the v9 brand colours come from the same source as the v8 skins'. |
+| `createDynamicsV9Theme(brand?)` | Light theme. Pass your own `BrandVariants` to rebrand. |
+| `createDynamicsV9DarkTheme(brand?)` | Dark theme, same ramp. |
+| `dynamicsV9Theme` / `dynamicsV9DarkTheme` | Memoized module singletons. |
+
+## Why this is a package
+
+The ramp and the three builders were declared **twice** — `surface-kit/src/v9/theme.ts` and
+`grid-kit/src/v9/theme.ts`, byte-identical across all sixteen slots, each with a docstring
+asserting it was the canonical one. Both are now thin re-exports of this package.
+
+It is not part of `@dataverse-kit/design-tokens` because the builders need `createLightTheme`
+from `@fluentui/react-components`, and design-tokens is zero-dependency by rule. Moving only the
+ramp there would have de-duplicated one export of four and left the other three duplicated.
+
+`src/__tests__/singleDeclaration.test.ts` is the gate that keeps this true: a source scan over
+`packages/*/src` asserting the ramp is declared exactly once. It runs in CI.
+
+## Consumers
+
+`@dataverse-kit/grid-kit/v9` · `@dataverse-kit/surface-kit/v9` — both re-export all four symbols,
+so existing imports from those packages are unchanged.

package/dist/index.cjs

@@ -0,0 +1,74 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var src_exports = {};
+__export(src_exports, {
+  createDynamicsV9DarkTheme: () => createDynamicsV9DarkTheme,
+  createDynamicsV9Theme: () => createDynamicsV9Theme,
+  dynamicsBrandRamp: () => dynamicsBrandRamp,
+  dynamicsV9DarkTheme: () => dynamicsV9DarkTheme,
+  dynamicsV9Theme: () => dynamicsV9Theme
+});
+module.exports = __toCommonJS(src_exports);
+
+// src/brand.ts
+var import_design_tokens = require("@dataverse-kit/design-tokens");
+var dynamicsBrandRamp = {
+  10: "#061724",
+  20: "#082338",
+  30: "#0a2e4a",
+  40: "#0c3b5e",
+  50: "#0e4775",
+  60: import_design_tokens.colors.brandDark,
+  // #005a9e — colorBrandBackgroundPressed
+  70: import_design_tokens.colors.brandHover,
+  // #106ebe — colorBrandBackground(Hover/Selected)
+  80: import_design_tokens.colors.brand,
+  // #0078d4 — colorBrandBackground + colorBrandForeground1 (the Dynamics blue)
+  90: "#2886de",
+  100: "#479ef5",
+  110: "#62abf5",
+  120: "#77b7f7",
+  130: "#96c6fa",
+  140: "#b4d6fa",
+  150: "#cfe4fa",
+  160: "#ebf3fc"
+};
+
+// src/theme.ts
+var import_react_components = require("@fluentui/react-components");
+var defaultBrand = dynamicsBrandRamp;
+function createDynamicsV9Theme(brand = defaultBrand) {
+  return (0, import_react_components.createLightTheme)(brand);
+}
+function createDynamicsV9DarkTheme(brand = defaultBrand) {
+  return (0, import_react_components.createDarkTheme)(brand);
+}
+var dynamicsV9Theme = createDynamicsV9Theme();
+var dynamicsV9DarkTheme = createDynamicsV9DarkTheme();
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  createDynamicsV9DarkTheme,
+  createDynamicsV9Theme,
+  dynamicsBrandRamp,
+  dynamicsV9DarkTheme,
+  dynamicsV9Theme
+});
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts","../src/brand.ts","../src/theme.ts"],"sourcesContent":["// @dataverse-kit/fluent-theme — the Dynamics CE Fluent UI v9 theme, declared once.\n//\n// Consumed by grid-kit/v9, surface-kit/v9 and agent-kit. See ./brand for why this is a\n// package of its own rather than an addition to @dataverse-kit/design-tokens.\nexport { dynamicsBrandRamp } from './brand';\nexport {\n  createDynamicsV9Theme,\n  createDynamicsV9DarkTheme,\n  dynamicsV9Theme,\n  dynamicsV9DarkTheme,\n} from './theme';\n","// The Dynamics CE brand ramp for Fluent UI v9 — THE single declaration.\n//\n// ★ This package exists because this ramp, and the three builders beside it in ./theme,\n//   were declared TWICE: packages/surface-kit/src/v9/theme.ts and\n//   packages/grid-kit/src/v9/theme.ts, byte-identical across all 16 slots, each with a\n//   docstring asserting it was the canonical one. grid-kit's copy even explained itself\n//   (\"grid-kit does not depend on @dataverse-kit/design-tokens, so the triad is inlined\n//   here\") — which is exactly the shape .claude/rules/verification-lessons.md §4 warns\n//   about: a fix applied to one of N copies leaves the other N-1 actively defended by\n//   their own comments.\n//\n// ★ It is NOT in @dataverse-kit/design-tokens, which would otherwise be the obvious home,\n//   because the builders in ./theme need `createLightTheme` from @fluentui/react-components\n//   and design-tokens is zero-dependency by rule (its tsconfig pins `\"paths\": {}`). Moving\n//   the ramp alone would have de-duplicated one export of four and left the other three\n//   duplicated — so the ramp and its builders travel together, here.\nimport { colors } from '@dataverse-kit/design-tokens';\n\n/**\n * The Fluent web brand ramp (a blue family that already matches Dynamics CE), with the\n * three most-visible shades pinned to the canonical design-tokens brand triad so the v9\n * brand colours come from the same source as the v8 skins'.\n *\n * ★ `BrandVariants` is a structural `Record<Brands, string>` with sixteen required\n *   numeric-literal keys (10…160) — no nominal branding. It is typed here by inference\n *   rather than as `Record<number, string>`: an index signature does NOT satisfy those\n *   sixteen required properties, so that annotation would fail at every `createLightTheme`\n *   call site. `theme.ts` asserts the assignability for real.\n */\nexport const dynamicsBrandRamp = {\n  10: '#061724',\n  20: '#082338',\n  30: '#0a2e4a',\n  40: '#0c3b5e',\n  50: '#0e4775',\n  60: colors.brandDark, // #005a9e — colorBrandBackgroundPressed\n  70: colors.brandHover, // #106ebe — colorBrandBackground(Hover/Selected)\n  80: colors.brand, // #0078d4 — colorBrandBackground + colorBrandForeground1 (the Dynamics blue)\n  90: '#2886de',\n  100: '#479ef5',\n  110: '#62abf5',\n  120: '#77b7f7',\n  130: '#96c6fa',\n  140: '#b4d6fa',\n  150: '#cfe4fa',\n  160: '#ebf3fc',\n} as const;\n","// The Dynamics CE Fluent v9 theme builders — the v9 counterpart of surface-kit's v8\n// `createDynamicsTheme()`. Both feed the SAME brand triad (brand / brandHover / brandDark)\n// into their respective theme factories, so a Dynamics-blue button is #0078d4 whichever\n// skin renders it.\nimport {\n  createLightTheme,\n  createDarkTheme,\n  type BrandVariants,\n  type Theme,\n} from '@fluentui/react-components';\nimport { dynamicsBrandRamp } from './brand';\n\n// ★ The assignability check that makes ./brand's inferred type safe. If someone re-annotates\n//   the ramp as `Record<number, string>` (an index signature, which does not satisfy\n//   BrandVariants' sixteen required literal keys) this line fails to compile — at the\n//   declaration, not at some downstream consumer's call site.\nconst defaultBrand: BrandVariants = dynamicsBrandRamp;\n\n/**\n * Build a Fluent v9 `Theme` for the Dynamics surfaces. Defaults to the Dynamics-blue brand\n * ramp; pass a custom `BrandVariants` (e.g. from your org's brand) to override.\n * Wrap the app or subtree in `<FluentProvider theme={createDynamicsV9Theme()}>`.\n */\nexport function createDynamicsV9Theme(brand: BrandVariants = defaultBrand): Theme {\n  return createLightTheme(brand);\n}\n\n/** Dark-mode variant of the Dynamics v9 theme (same brand ramp). */\nexport function createDynamicsV9DarkTheme(brand: BrandVariants = defaultBrand): Theme {\n  return createDarkTheme(brand);\n}\n\n/** The default light Dynamics v9 theme (memoized module singleton). */\nexport const dynamicsV9Theme: Theme = createDynamicsV9Theme();\n\n/** The default dark Dynamics v9 theme (memoized module singleton). */\nexport const dynamicsV9DarkTheme: Theme = createDynamicsV9DarkTheme();\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACgBA,2BAAuB;AAahB,IAAM,oBAAoB;AAAA,EAC/B,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI,4BAAO;AAAA;AAAA,EACX,IAAI,4BAAO;AAAA;AAAA,EACX,IAAI,4BAAO;AAAA;AAAA,EACX,IAAI;AAAA,EACJ,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AACP;;;AC1CA,8BAKO;AAOP,IAAM,eAA8B;AAO7B,SAAS,sBAAsB,QAAuB,cAAqB;AAChF,aAAO,0CAAiB,KAAK;AAC/B;AAGO,SAAS,0BAA0B,QAAuB,cAAqB;AACpF,aAAO,yCAAgB,KAAK;AAC9B;AAGO,IAAM,kBAAyB,sBAAsB;AAGrD,IAAM,sBAA6B,0BAA0B;","names":[]}

package/dist/index.d.cts

@@ -0,0 +1,46 @@
+import { BrandVariants, Theme } from '@fluentui/react-components';
+
+/**
+ * The Fluent web brand ramp (a blue family that already matches Dynamics CE), with the
+ * three most-visible shades pinned to the canonical design-tokens brand triad so the v9
+ * brand colours come from the same source as the v8 skins'.
+ *
+ * ★ `BrandVariants` is a structural `Record<Brands, string>` with sixteen required
+ *   numeric-literal keys (10…160) — no nominal branding. It is typed here by inference
+ *   rather than as `Record<number, string>`: an index signature does NOT satisfy those
+ *   sixteen required properties, so that annotation would fail at every `createLightTheme`
+ *   call site. `theme.ts` asserts the assignability for real.
+ */
+declare const dynamicsBrandRamp: {
+    readonly 10: "#061724";
+    readonly 20: "#082338";
+    readonly 30: "#0a2e4a";
+    readonly 40: "#0c3b5e";
+    readonly 50: "#0e4775";
+    readonly 60: "#005a9e";
+    readonly 70: "#106ebe";
+    readonly 80: "#0078d4";
+    readonly 90: "#2886de";
+    readonly 100: "#479ef5";
+    readonly 110: "#62abf5";
+    readonly 120: "#77b7f7";
+    readonly 130: "#96c6fa";
+    readonly 140: "#b4d6fa";
+    readonly 150: "#cfe4fa";
+    readonly 160: "#ebf3fc";
+};
+
+/**
+ * Build a Fluent v9 `Theme` for the Dynamics surfaces. Defaults to the Dynamics-blue brand
+ * ramp; pass a custom `BrandVariants` (e.g. from your org's brand) to override.
+ * Wrap the app or subtree in `<FluentProvider theme={createDynamicsV9Theme()}>`.
+ */
+declare function createDynamicsV9Theme(brand?: BrandVariants): Theme;
+/** Dark-mode variant of the Dynamics v9 theme (same brand ramp). */
+declare function createDynamicsV9DarkTheme(brand?: BrandVariants): Theme;
+/** The default light Dynamics v9 theme (memoized module singleton). */
+declare const dynamicsV9Theme: Theme;
+/** The default dark Dynamics v9 theme (memoized module singleton). */
+declare const dynamicsV9DarkTheme: Theme;
+
+export { createDynamicsV9DarkTheme, createDynamicsV9Theme, dynamicsBrandRamp, dynamicsV9DarkTheme, dynamicsV9Theme };

package/dist/index.d.ts

@@ -0,0 +1,46 @@
+import { BrandVariants, Theme } from '@fluentui/react-components';
+
+/**
+ * The Fluent web brand ramp (a blue family that already matches Dynamics CE), with the
+ * three most-visible shades pinned to the canonical design-tokens brand triad so the v9
+ * brand colours come from the same source as the v8 skins'.
+ *
+ * ★ `BrandVariants` is a structural `Record<Brands, string>` with sixteen required
+ *   numeric-literal keys (10…160) — no nominal branding. It is typed here by inference
+ *   rather than as `Record<number, string>`: an index signature does NOT satisfy those
+ *   sixteen required properties, so that annotation would fail at every `createLightTheme`
+ *   call site. `theme.ts` asserts the assignability for real.
+ */
+declare const dynamicsBrandRamp: {
+    readonly 10: "#061724";
+    readonly 20: "#082338";
+    readonly 30: "#0a2e4a";
+    readonly 40: "#0c3b5e";
+    readonly 50: "#0e4775";
+    readonly 60: "#005a9e";
+    readonly 70: "#106ebe";
+    readonly 80: "#0078d4";
+    readonly 90: "#2886de";
+    readonly 100: "#479ef5";
+    readonly 110: "#62abf5";
+    readonly 120: "#77b7f7";
+    readonly 130: "#96c6fa";
+    readonly 140: "#b4d6fa";
+    readonly 150: "#cfe4fa";
+    readonly 160: "#ebf3fc";
+};
+
+/**
+ * Build a Fluent v9 `Theme` for the Dynamics surfaces. Defaults to the Dynamics-blue brand
+ * ramp; pass a custom `BrandVariants` (e.g. from your org's brand) to override.
+ * Wrap the app or subtree in `<FluentProvider theme={createDynamicsV9Theme()}>`.
+ */
+declare function createDynamicsV9Theme(brand?: BrandVariants): Theme;
+/** Dark-mode variant of the Dynamics v9 theme (same brand ramp). */
+declare function createDynamicsV9DarkTheme(brand?: BrandVariants): Theme;
+/** The default light Dynamics v9 theme (memoized module singleton). */
+declare const dynamicsV9Theme: Theme;
+/** The default dark Dynamics v9 theme (memoized module singleton). */
+declare const dynamicsV9DarkTheme: Theme;
+
+export { createDynamicsV9DarkTheme, createDynamicsV9Theme, dynamicsBrandRamp, dynamicsV9DarkTheme, dynamicsV9Theme };

package/dist/index.mjs

@@ -0,0 +1,46 @@
+// src/brand.ts
+import { colors } from "@dataverse-kit/design-tokens";
+var dynamicsBrandRamp = {
+  10: "#061724",
+  20: "#082338",
+  30: "#0a2e4a",
+  40: "#0c3b5e",
+  50: "#0e4775",
+  60: colors.brandDark,
+  // #005a9e — colorBrandBackgroundPressed
+  70: colors.brandHover,
+  // #106ebe — colorBrandBackground(Hover/Selected)
+  80: colors.brand,
+  // #0078d4 — colorBrandBackground + colorBrandForeground1 (the Dynamics blue)
+  90: "#2886de",
+  100: "#479ef5",
+  110: "#62abf5",
+  120: "#77b7f7",
+  130: "#96c6fa",
+  140: "#b4d6fa",
+  150: "#cfe4fa",
+  160: "#ebf3fc"
+};
+
+// src/theme.ts
+import {
+  createLightTheme,
+  createDarkTheme
+} from "@fluentui/react-components";
+var defaultBrand = dynamicsBrandRamp;
+function createDynamicsV9Theme(brand = defaultBrand) {
+  return createLightTheme(brand);
+}
+function createDynamicsV9DarkTheme(brand = defaultBrand) {
+  return createDarkTheme(brand);
+}
+var dynamicsV9Theme = createDynamicsV9Theme();
+var dynamicsV9DarkTheme = createDynamicsV9DarkTheme();
+export {
+  createDynamicsV9DarkTheme,
+  createDynamicsV9Theme,
+  dynamicsBrandRamp,
+  dynamicsV9DarkTheme,
+  dynamicsV9Theme
+};
+//# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/brand.ts","../src/theme.ts"],"sourcesContent":["// The Dynamics CE brand ramp for Fluent UI v9 — THE single declaration.\n//\n// ★ This package exists because this ramp, and the three builders beside it in ./theme,\n//   were declared TWICE: packages/surface-kit/src/v9/theme.ts and\n//   packages/grid-kit/src/v9/theme.ts, byte-identical across all 16 slots, each with a\n//   docstring asserting it was the canonical one. grid-kit's copy even explained itself\n//   (\"grid-kit does not depend on @dataverse-kit/design-tokens, so the triad is inlined\n//   here\") — which is exactly the shape .claude/rules/verification-lessons.md §4 warns\n//   about: a fix applied to one of N copies leaves the other N-1 actively defended by\n//   their own comments.\n//\n// ★ It is NOT in @dataverse-kit/design-tokens, which would otherwise be the obvious home,\n//   because the builders in ./theme need `createLightTheme` from @fluentui/react-components\n//   and design-tokens is zero-dependency by rule (its tsconfig pins `\"paths\": {}`). Moving\n//   the ramp alone would have de-duplicated one export of four and left the other three\n//   duplicated — so the ramp and its builders travel together, here.\nimport { colors } from '@dataverse-kit/design-tokens';\n\n/**\n * The Fluent web brand ramp (a blue family that already matches Dynamics CE), with the\n * three most-visible shades pinned to the canonical design-tokens brand triad so the v9\n * brand colours come from the same source as the v8 skins'.\n *\n * ★ `BrandVariants` is a structural `Record<Brands, string>` with sixteen required\n *   numeric-literal keys (10…160) — no nominal branding. It is typed here by inference\n *   rather than as `Record<number, string>`: an index signature does NOT satisfy those\n *   sixteen required properties, so that annotation would fail at every `createLightTheme`\n *   call site. `theme.ts` asserts the assignability for real.\n */\nexport const dynamicsBrandRamp = {\n  10: '#061724',\n  20: '#082338',\n  30: '#0a2e4a',\n  40: '#0c3b5e',\n  50: '#0e4775',\n  60: colors.brandDark, // #005a9e — colorBrandBackgroundPressed\n  70: colors.brandHover, // #106ebe — colorBrandBackground(Hover/Selected)\n  80: colors.brand, // #0078d4 — colorBrandBackground + colorBrandForeground1 (the Dynamics blue)\n  90: '#2886de',\n  100: '#479ef5',\n  110: '#62abf5',\n  120: '#77b7f7',\n  130: '#96c6fa',\n  140: '#b4d6fa',\n  150: '#cfe4fa',\n  160: '#ebf3fc',\n} as const;\n","// The Dynamics CE Fluent v9 theme builders — the v9 counterpart of surface-kit's v8\n// `createDynamicsTheme()`. Both feed the SAME brand triad (brand / brandHover / brandDark)\n// into their respective theme factories, so a Dynamics-blue button is #0078d4 whichever\n// skin renders it.\nimport {\n  createLightTheme,\n  createDarkTheme,\n  type BrandVariants,\n  type Theme,\n} from '@fluentui/react-components';\nimport { dynamicsBrandRamp } from './brand';\n\n// ★ The assignability check that makes ./brand's inferred type safe. If someone re-annotates\n//   the ramp as `Record<number, string>` (an index signature, which does not satisfy\n//   BrandVariants' sixteen required literal keys) this line fails to compile — at the\n//   declaration, not at some downstream consumer's call site.\nconst defaultBrand: BrandVariants = dynamicsBrandRamp;\n\n/**\n * Build a Fluent v9 `Theme` for the Dynamics surfaces. Defaults to the Dynamics-blue brand\n * ramp; pass a custom `BrandVariants` (e.g. from your org's brand) to override.\n * Wrap the app or subtree in `<FluentProvider theme={createDynamicsV9Theme()}>`.\n */\nexport function createDynamicsV9Theme(brand: BrandVariants = defaultBrand): Theme {\n  return createLightTheme(brand);\n}\n\n/** Dark-mode variant of the Dynamics v9 theme (same brand ramp). */\nexport function createDynamicsV9DarkTheme(brand: BrandVariants = defaultBrand): Theme {\n  return createDarkTheme(brand);\n}\n\n/** The default light Dynamics v9 theme (memoized module singleton). */\nexport const dynamicsV9Theme: Theme = createDynamicsV9Theme();\n\n/** The default dark Dynamics v9 theme (memoized module singleton). */\nexport const dynamicsV9DarkTheme: Theme = createDynamicsV9DarkTheme();\n"],"mappings":";AAgBA,SAAS,cAAc;AAahB,IAAM,oBAAoB;AAAA,EAC/B,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI,OAAO;AAAA;AAAA,EACX,IAAI,OAAO;AAAA;AAAA,EACX,IAAI,OAAO;AAAA;AAAA,EACX,IAAI;AAAA,EACJ,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AACP;;;AC1CA;AAAA,EACE;AAAA,EACA;AAAA,OAGK;AAOP,IAAM,eAA8B;AAO7B,SAAS,sBAAsB,QAAuB,cAAqB;AAChF,SAAO,iBAAiB,KAAK;AAC/B;AAGO,SAAS,0BAA0B,QAAuB,cAAqB;AACpF,SAAO,gBAAgB,KAAK;AAC9B;AAGO,IAAM,kBAAyB,sBAAsB;AAGrD,IAAM,sBAA6B,0BAA0B;","names":[]}

package/package.json

@@ -0,0 +1,48 @@
+{
+  "name": "@dataverse-kit/fluent-theme",
+  "version": "0.2.0",
+  "license": "MIT",
+  "description": "The Dynamics CE Fluent UI v9 theme, in one place: the `dynamicsBrandRamp` BrandVariants ramp (60/70/80 pinned to the canonical @dataverse-kit/design-tokens brand triad) plus the light/dark theme builders. Consumed by grid-kit/v9, surface-kit/v9 and agent-kit so a Dynamics-blue accent is #0078d4 from ONE declaration.",
+  "type": "module",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.cjs"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "sideEffects": false,
+  "scripts": {
+    "prepublishOnly": "npm run build",
+    "build": "tsup",
+    "dev": "tsup --watch",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "typecheck": "tsc --noEmit",
+    "lint": "eslint src --ext .ts,.tsx",
+    "lint:fix": "eslint src --ext .ts,.tsx --fix",
+    "clean": "rimraf dist coverage tsconfig.tsbuildinfo"
+  },
+  "dependencies": {
+    "@dataverse-kit/design-tokens": "^0.1.1"
+  },
+  "peerDependencies": {
+    "@fluentui/react-components": "^9.46.2"
+  },
+  "devDependencies": {
+    "@fluentui/react-components": "^9.46.2",
+    "rimraf": "^5.0.5",
+    "tsup": "^8.0.0",
+    "typescript": "^5.3.3",
+    "vitest": "^1.6.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}