@lerianstudio/sindarian-ui 2.0.0-beta.20 → 2.0.0-beta.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,6 @@
1
+ export type LerianWordmarkProps = {
2
+ className?: string;
3
+ title?: string;
4
+ };
5
+ export declare function LerianWordmark({ className, title }: LerianWordmarkProps): import("react").JSX.Element;
6
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/lerian-wordmark/index.tsx"],"names":[],"mappings":"AAAA,MAAM,MAAM,mBAAmB,GAAG;IAChC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAED,wBAAgB,cAAc,CAAC,EAC7B,SAAS,EACT,KAAgB,EACjB,EAAE,mBAAmB,+BAiBrB"}
@@ -0,0 +1,7 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.LerianWordmark = LerianWordmark;
4
+ const jsx_runtime_1 = require("react/jsx-runtime");
5
+ function LerianWordmark({ className, title = 'Lerian' }) {
6
+ return ((0, jsx_runtime_1.jsx)("svg", { "data-slot": "lerian-wordmark", viewBox: "0 0 1090.88 280", role: "img", "aria-label": title, fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", className: className, children: (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M619.42,29.69c0,15.43-10.87,27.93-27.93,27.93s-27.93-12.51-27.93-27.93,10.86-27.93,27.92-27.93,27.93,12.51,27.93,27.93h0ZM158.64,242.4v33.54H12.13v-33.55h48.36c3.16,0,5.73-2.57,5.73-5.73V87.77c0-3.16-2.57-5.73-5.73-5.73H7.85v-34.31h98.33v188.94c0,3.16,2.57,5.73,5.73,5.73h46.74ZM168.85,179.86c0,58.52,37.29,98.33,99.47,98.33,49.15,0,79.7-30.6,86.27-67.08h-40.69c-6.29,24.54-26.97,33.91-48.61,33.91-48.85,0-53.41-45.18-53.83-55-.04-1.02.77-1.87,1.79-1.87h143.61c.76-5.26,1.13-10.42,1.13-15.44,0-32.71-20.25-91.92-95.33-91.92-57.04,0-93.8,41.26-93.81,99.07ZM314.47,158.39l-99.49.02c-1.08,0-1.94-.96-1.78-2.02,4.49-31.28,30.98-42.82,50.98-42.82,33.88,0,48.71,21.59,52.08,42.79.17,1.08-.69,2.04-1.78,2.04h0ZM867.2,83.16h0s0,0,0,0h0ZM826.87,83.16h40.33v192.83h-40.32v-24.53c0-3.09-3.92-4.41-5.79-1.95-.18.23-.35.47-.53.71h0s0,.02,0,.02h0c-.11.16-.23.32-.35.47-7.92,10.56-20.68,27.53-56.24,27.53-60.83,0-91.19-46.33-91.19-98.7,0-61.42,40.37-98.72,91.17-98.72,36.73,0,48.44,15.73,56.64,26.75l.49.66c1.86,2.49,5.81,1.18,5.81-1.93v-23.14ZM770.75,115.48c34.78,0,56.14,27.81,56.14,64.8h0c0,42-26.32,63.68-56.14,63.68-34.83,0-56.14-27.43-56.14-64.43,0-42.07,26.11-64.05,56.14-64.05ZM1063.39,101.7c14.42,14.06,21.64,36.67,21.64,67.8v106.25h-41.06v-103.99c0-43.98-22.35-56.14-45.96-56.14-31.99,0-51.6,23.22-51.6,62.92v97.21h-40.68V83.15h39.93v25.07c0,3.11,3.95,4.4,5.82,1.92,8.55-11.4,26.72-29.52,55.98-29.52,37.55,0,55.75,20.88,55.93,21.08ZM657.42,275.94v-33.54h0s-37.37,0-37.37,0c-3.16,0-5.73-2.57-5.73-5.73V83.14h-81.34v34.31h37.54c3.16,0,5.73,2.57,5.73,5.73v113.48c0,3.16-2.57,5.73-5.73,5.73h-38.14v33.55h125.03ZM499.27,119.27c0,.13-.1.23-.23.23h0s-36.31,0-36.31,0c-28.68,0-28.65,24.99-28.64,43.62,0,.46,0,.92,0,1.37v111.24c0,.13-.1.23-.23.23h-41.01c-.13,0-.23-.1-.23-.23V83.27c0-.13.1-.23.23-.23h36.49c.13,0,.23.1.23.23v24.03c0,4.05,5.24,5.65,7.49,2.28.22-.32.43-.64.65-.97,8.18-12.25,18.71-28.02,52.51-28.02h9.05v38.68Z" }) }));
7
+ }
@@ -12,7 +12,7 @@ const sheet_1 = require("../sheet");
12
12
  *
13
13
  * They were `w-[72px]` and `w-[244px]`, which a consumer could only override by
14
14
  * winning a specificity argument with `cn`. `--sidebar-width` and
15
- * `--sidebar-width-collapsed` are declared in `globals.css`, so the default
15
+ * `--sidebar-width-collapsed` are declared in `tokens.css`, so the default
16
16
  * still ships with the stylesheet, and a consumer re-points either one with
17
17
  * `className="[--sidebar-width:280px]"` ON THE RAIL, which moves the rail and
18
18
  * the mobile drawer together (see `liftWidthOverrides` below), or with a rule
@@ -0,0 +1,6 @@
1
+ export type LerianWordmarkProps = {
2
+ className?: string;
3
+ title?: string;
4
+ };
5
+ export declare function LerianWordmark({ className, title }: LerianWordmarkProps): import("react").JSX.Element;
6
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/lerian-wordmark/index.tsx"],"names":[],"mappings":"AAAA,MAAM,MAAM,mBAAmB,GAAG;IAChC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAED,wBAAgB,cAAc,CAAC,EAC7B,SAAS,EACT,KAAgB,EACjB,EAAE,mBAAmB,+BAiBrB"}
@@ -0,0 +1,4 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ export function LerianWordmark({ className, title = 'Lerian' }) {
3
+ return (_jsx("svg", { "data-slot": "lerian-wordmark", viewBox: "0 0 1090.88 280", role: "img", "aria-label": title, fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", className: className, children: _jsx("path", { fillRule: "evenodd", d: "M619.42,29.69c0,15.43-10.87,27.93-27.93,27.93s-27.93-12.51-27.93-27.93,10.86-27.93,27.92-27.93,27.93,12.51,27.93,27.93h0ZM158.64,242.4v33.54H12.13v-33.55h48.36c3.16,0,5.73-2.57,5.73-5.73V87.77c0-3.16-2.57-5.73-5.73-5.73H7.85v-34.31h98.33v188.94c0,3.16,2.57,5.73,5.73,5.73h46.74ZM168.85,179.86c0,58.52,37.29,98.33,99.47,98.33,49.15,0,79.7-30.6,86.27-67.08h-40.69c-6.29,24.54-26.97,33.91-48.61,33.91-48.85,0-53.41-45.18-53.83-55-.04-1.02.77-1.87,1.79-1.87h143.61c.76-5.26,1.13-10.42,1.13-15.44,0-32.71-20.25-91.92-95.33-91.92-57.04,0-93.8,41.26-93.81,99.07ZM314.47,158.39l-99.49.02c-1.08,0-1.94-.96-1.78-2.02,4.49-31.28,30.98-42.82,50.98-42.82,33.88,0,48.71,21.59,52.08,42.79.17,1.08-.69,2.04-1.78,2.04h0ZM867.2,83.16h0s0,0,0,0h0ZM826.87,83.16h40.33v192.83h-40.32v-24.53c0-3.09-3.92-4.41-5.79-1.95-.18.23-.35.47-.53.71h0s0,.02,0,.02h0c-.11.16-.23.32-.35.47-7.92,10.56-20.68,27.53-56.24,27.53-60.83,0-91.19-46.33-91.19-98.7,0-61.42,40.37-98.72,91.17-98.72,36.73,0,48.44,15.73,56.64,26.75l.49.66c1.86,2.49,5.81,1.18,5.81-1.93v-23.14ZM770.75,115.48c34.78,0,56.14,27.81,56.14,64.8h0c0,42-26.32,63.68-56.14,63.68-34.83,0-56.14-27.43-56.14-64.43,0-42.07,26.11-64.05,56.14-64.05ZM1063.39,101.7c14.42,14.06,21.64,36.67,21.64,67.8v106.25h-41.06v-103.99c0-43.98-22.35-56.14-45.96-56.14-31.99,0-51.6,23.22-51.6,62.92v97.21h-40.68V83.15h39.93v25.07c0,3.11,3.95,4.4,5.82,1.92,8.55-11.4,26.72-29.52,55.98-29.52,37.55,0,55.75,20.88,55.93,21.08ZM657.42,275.94v-33.54h0s-37.37,0-37.37,0c-3.16,0-5.73-2.57-5.73-5.73V83.14h-81.34v34.31h37.54c3.16,0,5.73,2.57,5.73,5.73v113.48c0,3.16-2.57,5.73-5.73,5.73h-38.14v33.55h125.03ZM499.27,119.27c0,.13-.1.23-.23.23h0s-36.31,0-36.31,0c-28.68,0-28.65,24.99-28.64,43.62,0,.46,0,.92,0,1.37v111.24c0,.13-.1.23-.23.23h-41.01c-.13,0-.23-.1-.23-.23V83.27c0-.13.1-.23.23-.23h36.49c.13,0,.23.1.23.23v24.03c0,4.05,5.24,5.65,7.49,2.28.22-.32.43-.64.65-.97,8.18-12.25,18.71-28.02,52.51-28.02h9.05v38.68Z" }) }));
4
+ }
@@ -9,7 +9,7 @@ import { Sheet, SheetContent, SheetTitle } from '../sheet/index.js';
9
9
  *
10
10
  * They were `w-[72px]` and `w-[244px]`, which a consumer could only override by
11
11
  * winning a specificity argument with `cn`. `--sidebar-width` and
12
- * `--sidebar-width-collapsed` are declared in `globals.css`, so the default
12
+ * `--sidebar-width-collapsed` are declared in `tokens.css`, so the default
13
13
  * still ships with the stylesheet, and a consumer re-points either one with
14
14
  * `className="[--sidebar-width:280px]"` ON THE RAIL, which moves the rail and
15
15
  * the mobile drawer together (see `liftWidthOverrides` below), or with a rule
@@ -18,6 +18,7 @@ export * from './components/ui/dropdown-menu/index.js';
18
18
  export * from './components/ui/input/index.js';
19
19
  export * from './components/ui/otp-input/index.js';
20
20
  export * from './components/ui/label/index.js';
21
+ export * from './components/ui/lerian-wordmark/index.js';
21
22
  export * from './components/ui/loading-button/index.js';
22
23
  export * from './components/ui/multiple-select/index.js';
23
24
  export * from './components/ui/paper/index.js';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":"AAGA,cAAc,uBAAuB,CAAA;AACrC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,wBAAwB,CAAA;AACtC,cAAc,mCAAmC,CAAA;AACjD,cAAc,wBAAwB,CAAA;AACtC,cAAc,uBAAuB,CAAA;AACrC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,wBAAwB,CAAA;AACtC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,0BAA0B,CAAA;AACxC,cAAc,sBAAsB,CAAA;AACpC,cAAc,0BAA0B,CAAA;AACxC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,yBAAyB,CAAA;AACvC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,wBAAwB,CAAA;AACtC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,uBAAuB,CAAA;AACrC,cAAc,2BAA2B,CAAA;AACzC,cAAc,uBAAuB,CAAA;AACrC,cAAc,gCAAgC,CAAA;AAC9C,cAAc,iCAAiC,CAAA;AAC/C,cAAc,uBAAuB,CAAA;AACrC,cAAc,mCAAmC,CAAA;AACjD,cAAc,yBAAyB,CAAA;AACvC,cAAc,0BAA0B,CAAA;AACxC,cAAc,yBAAyB,CAAA;AACvC,cAAc,wBAAwB,CAAA;AACtC,cAAc,2BAA2B,CAAA;AACzC,cAAc,uBAAuB,CAAA;AACrC,cAAc,yBAAyB,CAAA;AACvC,cAAc,0BAA0B,CAAA;AACxC,cAAc,yBAAyB,CAAA;AACvC,cAAc,qBAAqB,CAAA;AACnC,cAAc,wBAAwB,CAAA;AACtC,cAAc,uBAAuB,CAAA;AACrC,cAAc,sBAAsB,CAAA;AACpC,cAAc,0BAA0B,CAAA;AACxC,cAAc,uBAAuB,CAAA;AACrC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,mBAAmB,CAAA;AACjC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,kBAAkB,CAAA;AAChC,cAAc,yBAAyB,CAAA;AACvC,cAAc,sBAAsB,CAAA;AAGpC,OAAO,EAAE,UAAU,IAAI,qBAAqB,EAAE,MAAM,yBAAyB,CAAA;AAC7E,cAAc,8CAA8C,CAAA;AAC5D,cAAc,mBAAmB,CAAA;AACjC,cAAc,qBAAqB,CAAA;AACnC,cAAc,yBAAyB,CAAA;AACvC,cAAc,gCAAgC,CAAA;AAC9C,cAAc,mBAAmB,CAAA;AACjC,cAAc,mBAAmB,CAAA;AACjC,cAAc,0BAA0B,CAAA;AACxC,cAAc,yBAAyB,CAAA;AACvC,cAAc,oBAAoB,CAAA;AAGlC,cAAc,cAAc,CAAA;AAC5B,cAAc,SAAS,CAAA;AACvB,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,UAAU,CAAA;AAGxB,cAAc,2BAA2B,CAAA;AACzC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,4BAA4B,CAAA;AAC1C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,8BAA8B,CAAA;AAG5C,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAA;AAChC,cAAc,kBAAkB,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":"AAGA,cAAc,uBAAuB,CAAA;AACrC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,wBAAwB,CAAA;AACtC,cAAc,mCAAmC,CAAA;AACjD,cAAc,wBAAwB,CAAA;AACtC,cAAc,uBAAuB,CAAA;AACrC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,wBAAwB,CAAA;AACtC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,0BAA0B,CAAA;AACxC,cAAc,sBAAsB,CAAA;AACpC,cAAc,0BAA0B,CAAA;AACxC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,yBAAyB,CAAA;AACvC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,wBAAwB,CAAA;AACtC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,uBAAuB,CAAA;AACrC,cAAc,2BAA2B,CAAA;AACzC,cAAc,uBAAuB,CAAA;AACrC,cAAc,iCAAiC,CAAA;AAC/C,cAAc,gCAAgC,CAAA;AAC9C,cAAc,iCAAiC,CAAA;AAC/C,cAAc,uBAAuB,CAAA;AACrC,cAAc,mCAAmC,CAAA;AACjD,cAAc,yBAAyB,CAAA;AACvC,cAAc,0BAA0B,CAAA;AACxC,cAAc,yBAAyB,CAAA;AACvC,cAAc,wBAAwB,CAAA;AACtC,cAAc,2BAA2B,CAAA;AACzC,cAAc,uBAAuB,CAAA;AACrC,cAAc,yBAAyB,CAAA;AACvC,cAAc,0BAA0B,CAAA;AACxC,cAAc,yBAAyB,CAAA;AACvC,cAAc,qBAAqB,CAAA;AACnC,cAAc,wBAAwB,CAAA;AACtC,cAAc,uBAAuB,CAAA;AACrC,cAAc,sBAAsB,CAAA;AACpC,cAAc,0BAA0B,CAAA;AACxC,cAAc,uBAAuB,CAAA;AACrC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,mBAAmB,CAAA;AACjC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,kBAAkB,CAAA;AAChC,cAAc,yBAAyB,CAAA;AACvC,cAAc,sBAAsB,CAAA;AAGpC,OAAO,EAAE,UAAU,IAAI,qBAAqB,EAAE,MAAM,yBAAyB,CAAA;AAC7E,cAAc,8CAA8C,CAAA;AAC5D,cAAc,mBAAmB,CAAA;AACjC,cAAc,qBAAqB,CAAA;AACnC,cAAc,yBAAyB,CAAA;AACvC,cAAc,gCAAgC,CAAA;AAC9C,cAAc,mBAAmB,CAAA;AACjC,cAAc,mBAAmB,CAAA;AACjC,cAAc,0BAA0B,CAAA;AACxC,cAAc,yBAAyB,CAAA;AACvC,cAAc,oBAAoB,CAAA;AAGlC,cAAc,cAAc,CAAA;AAC5B,cAAc,SAAS,CAAA;AACvB,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,UAAU,CAAA;AAGxB,cAAc,2BAA2B,CAAA;AACzC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,4BAA4B,CAAA;AAC1C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,8BAA8B,CAAA;AAG5C,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAA;AAChC,cAAc,kBAAkB,CAAA"}
package/dist/esm/index.js CHANGED
@@ -20,6 +20,7 @@ export * from './components/ui/dropdown-menu/index.js';
20
20
  export * from './components/ui/input/index.js';
21
21
  export * from './components/ui/otp-input/index.js';
22
22
  export * from './components/ui/label/index.js';
23
+ export * from './components/ui/lerian-wordmark/index.js';
23
24
  export * from './components/ui/loading-button/index.js';
24
25
  export * from './components/ui/multiple-select/index.js';
25
26
  export * from './components/ui/paper/index.js';
@@ -0,0 +1,96 @@
1
+ IBM Plex Sans: Copyright 2019 IBM Corp. All rights reserved. With Reserved Font Name "Plex".
2
+ IBM Plex Serif: Copyright 2020 IBM Corp. All rights reserved. With Reserved Font Name "Plex".
3
+ IBM Plex Mono: Copyright 2017 IBM Corp. All rights reserved. With Reserved Font Name "Plex".
4
+ Inter: Copyright 2020 The Inter Project Authors (https://github.com/rsms/inter).
5
+
6
+ This Font Software is licensed under the SIL Open Font License, Version 1.1.
7
+ This license is copied below, and is also available with a FAQ at:
8
+ http://scripts.sil.org/OFL
9
+
10
+
11
+ -----------------------------------------------------------
12
+ SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
13
+ -----------------------------------------------------------
14
+
15
+ PREAMBLE
16
+ The goals of the Open Font License (OFL) are to stimulate worldwide
17
+ development of collaborative font projects, to support the font creation
18
+ efforts of academic and linguistic communities, and to provide a free and
19
+ open framework in which fonts may be shared and improved in partnership
20
+ with others.
21
+
22
+ The OFL allows the licensed fonts to be used, studied, modified and
23
+ redistributed freely as long as they are not sold by themselves. The
24
+ fonts, including any derivative works, can be bundled, embedded,
25
+ redistributed and/or sold with any software provided that any reserved
26
+ names are not used by derivative works. The fonts and derivatives,
27
+ however, cannot be released under any other type of license. The
28
+ requirement for fonts to remain under this license does not apply
29
+ to any document created using the fonts or their derivatives.
30
+
31
+ DEFINITIONS
32
+ "Font Software" refers to the set of files released by the Copyright
33
+ Holder(s) under this license and clearly marked as such. This may
34
+ include source files, build scripts and documentation.
35
+
36
+ "Reserved Font Name" refers to any names specified as such after the
37
+ copyright statement(s).
38
+
39
+ "Original Version" refers to the collection of Font Software components as
40
+ distributed by the Copyright Holder(s).
41
+
42
+ "Modified Version" refers to any derivative made by adding to, deleting,
43
+ or substituting -- in part or in whole -- any of the components of the
44
+ Original Version, by changing formats or by porting the Font Software to a
45
+ new environment.
46
+
47
+ "Author" refers to any designer, engineer, programmer, technical
48
+ writer or other person who contributed to the Font Software.
49
+
50
+ PERMISSION & CONDITIONS
51
+ Permission is hereby granted, free of charge, to any person obtaining
52
+ a copy of the Font Software, to use, study, copy, merge, embed, modify,
53
+ redistribute, and sell modified and unmodified copies of the Font
54
+ Software, subject to the following conditions:
55
+
56
+ 1) Neither the Font Software nor any of its individual components,
57
+ in Original or Modified Versions, may be sold by itself.
58
+
59
+ 2) Original or Modified Versions of the Font Software may be bundled,
60
+ redistributed and/or sold with any software, provided that each copy
61
+ contains the above copyright notice and this license. These can be
62
+ included either as stand-alone text files, human-readable headers or
63
+ in the appropriate machine-readable metadata fields within text or
64
+ binary files as long as those fields can be easily viewed by the user.
65
+
66
+ 3) No Modified Version of the Font Software may use the Reserved Font
67
+ Name(s) unless explicit written permission is granted by the corresponding
68
+ Copyright Holder. This restriction only applies to the primary font name as
69
+ presented to the users.
70
+
71
+ 4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
72
+ Software shall not be used to promote, endorse or advertise any
73
+ Modified Version, except to acknowledge the contribution(s) of the
74
+ Copyright Holder(s) and the Author(s) or with their explicit written
75
+ permission.
76
+
77
+ 5) The Font Software, modified or unmodified, in part or in whole,
78
+ must be distributed entirely under this license, and must not be
79
+ distributed under any other license. The requirement for fonts to
80
+ remain under this license does not apply to any document created
81
+ using the Font Software.
82
+
83
+ TERMINATION
84
+ This license becomes null and void if any of the above conditions are
85
+ not met.
86
+
87
+ DISCLAIMER
88
+ THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
89
+ EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
90
+ MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
91
+ OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
92
+ COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
93
+ INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
94
+ DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
95
+ FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
96
+ OTHER DEALINGS IN THE FONT SOFTWARE.
Binary file
package/dist/fonts.css ADDED
@@ -0,0 +1,46 @@
1
+ /* Inter latin, fetched from https://fonts.googleapis.com/css2?family=Inter:wght@100..900 */
2
+ @font-face {
3
+ font-family: 'Lerian Inter';
4
+ font-style: normal;
5
+ font-weight: 100 900;
6
+ font-display: swap;
7
+ src: url('./fonts/inter-latin.woff2') format('woff2');
8
+ }
9
+
10
+ @font-face {
11
+ font-family: 'Lerian Plex Serif';
12
+ font-style: normal;
13
+ font-weight: 400;
14
+ font-display: swap;
15
+ src: url('./fonts/ibm-plex-serif-latin-400.woff2') format('woff2');
16
+ }
17
+
18
+ @font-face {
19
+ font-family: 'Lerian Plex Serif';
20
+ font-style: normal;
21
+ font-weight: 500;
22
+ font-display: swap;
23
+ src: url('./fonts/ibm-plex-serif-latin-500.woff2') format('woff2');
24
+ }
25
+
26
+ @font-face {
27
+ font-family: 'Lerian Plex Mono';
28
+ font-style: normal;
29
+ font-weight: 400;
30
+ font-display: swap;
31
+ src: url('./fonts/ibm-plex-mono-latin-400.woff2') format('woff2');
32
+ }
33
+
34
+ @font-face {
35
+ font-family: 'Lerian Plex Mono';
36
+ font-style: normal;
37
+ font-weight: 500;
38
+ font-display: swap;
39
+ src: url('./fonts/ibm-plex-mono-latin-500.woff2') format('woff2');
40
+ }
41
+
42
+ :root {
43
+ --font-inter: 'Lerian Inter';
44
+ --font-plex-serif: 'Lerian Plex Serif';
45
+ --font-plex-mono: 'Lerian Plex Mono';
46
+ }
package/dist/globals.css CHANGED
@@ -10,11 +10,18 @@
10
10
  @import './components/ui/stepper/styles.css';
11
11
  @import './components/ui/tabs/styles.css';
12
12
  @import './components/ui/dialog/styles.css';
13
+ @import './tokens.css';
13
14
  @custom-variant dark (&:is(.dark *));
14
15
 
15
16
  @theme inline {
16
17
  --font-sans:
17
18
  var(--font-inter, 'Inter'), 'Inter', ui-sans-serif, system-ui, sans-serif;
19
+ --font-serif:
20
+ var(--font-plex-serif, ui-serif), ui-serif, Georgia, Cambria,
21
+ 'Times New Roman', Times, serif;
22
+ --font-mono:
23
+ var(--font-plex-mono, ui-monospace), ui-monospace, SFMono-Regular, Menlo,
24
+ Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
18
25
 
19
26
  --shadow-sidebar: 5px 0px 15px -3px hsl(var(--shadow-color) / 0.05);
20
27
  --shadow-data-table:
@@ -210,363 +217,6 @@
210
217
  }
211
218
  }
212
219
 
213
- @layer base {
214
- :root {
215
- color-scheme: light; /* native widgets (form controls, scrollbars) follow the theme */
216
-
217
- /*
218
- Sidebar geometry. These were literals inside SidebarRoot's cva
219
- (`w-[244px]` / `w-[72px]`), which a consumer could only override by
220
- winning a specificity argument with `cn`. As custom properties the
221
- default still ships with this sheet.
222
-
223
- TWO places to re-point them, and only these two:
224
- - on the rail, via `className="[--sidebar-width:280px]"`. SidebarRoot
225
- copies exactly these two arbitrary-property classes onto the mobile
226
- drawer's own element, so one class moves the rail AND the drawer.
227
- - on `:root` or `html`, which every layout inherits from.
228
-
229
- NOT on a React-tree wrapper above the rail: that reaches the rail, but
230
- the mobile drawer is portalled into document.body, and custom properties
231
- inherit down the DOM tree. A wrapper is not an ancestor of the portal;
232
- `:root` is.
233
-
234
- They are theme-independent on purpose: a rail is not wider in the dark.
235
- */
236
- --sidebar-width: 244px;
237
- --sidebar-width-collapsed: 72px;
238
-
239
- /* Application tokens (from Figma ring-tokens) */
240
- --body-surface: 240 5% 96%; /* base/100 = #F4F4F5 */
241
- /*
242
- --body-text and --container-text below both step one notch off base/500.
243
- base/500 clears AA on white (4.86:1) but not on --body-surface, the
244
- recessed page ground, where it read 4.43:1. That ground is exactly where
245
- the components carrying these two tokens sit: the resting tabs trigger
246
- (text-sm font-medium, and its hover fill is --card precisely because the
247
- resting ground is not white), the breadcrumb page and separator, the
248
- stepper item text and description. An axe crawl of the br-sfn cockpit
249
- flagged .text-body-text on 2026-09-06; the ratio it printed does not
250
- reproduce here, and the measured pair on this token's own ground is
251
- 4.40:1 at 8-bit precision (4.43:1 in float).
252
-
253
- 45% is the smallest step that clears it: 4.59:1 on --body-surface, up
254
- from 4.43:1, and 5.04:1 on white. Both stay eleven notches clear of
255
- --container-title (base/600), so the text-versus-title step holds.
256
-
257
- Deliberately not stepped far enough to clear --muted (#E4E4E7), which
258
- would take base/500 minus five notches and visibly darken tabs,
259
- breadcrumbs and steppers. No component in THIS kit paints either token on
260
- that fill. A consumer that does is a call-site fix on its side, not a
261
- clean bill from here: product-console's extract-table pairs bg-muted with
262
- text-body-text and reads 3.98:1 in light.
263
- */
264
- --body-text: 240 4% 45%; /* one notch off base/500: #6E6E77, AA on body-surface */
265
- --body-title: 240 5% 26%; /* base/700 = #3F3F46 */
266
- --container-surface: 0 0% 100%; /* base/white = #FFFFFF */
267
- --container-text: 240 4% 45%; /* one notch off base/500: #6E6E77, AA on body-surface */
268
- --container-title: 240 5% 34%; /* base/600 = #52525B */
269
- --container-border: 0 0% 100%; /* #FFFFFF */
270
- --link: 240 4% 16%; /* base/800 = #27272A */
271
- --link-hover: 240 4% 16%; /* #27272A with 80% opacity via /80 */
272
- --link-mute: 240 4% 16%; /* #27272A with 40% opacity via /40 */
273
- --button-primary-surface: 240 4% 16%; /* base/800 = #27272A */
274
- --button-primary-text: 0 0% 100%; /* base/white */
275
-
276
- /* Shadcn semantic tokens (aligned with Figma) */
277
- --background: 0 0% 100%; /* base/white = #FFFFFF */
278
- --foreground: 240 5% 26%; /* base/700 = #3F3F46 */
279
- --card: 0 0% 100%; /* = container-surface (white) */
280
- /* Held at base/500, the step --container-text just moved off: this token's
281
- own ground is --card (white), where base/500 clears AA at 4.86:1. It
282
- measures 3.84:1 over --muted, but no component in this kit renders it
283
- there: the data table pins its own inks rather than inheriting this one
284
- (`ui/table/index.tsx`: cells take text-foreground, heads take
285
- text-muted-foreground), so the hovered-row ground never sits under this
286
- token. */
287
- --card-foreground: 240 4% 46%; /* base/500 = #71717A */
288
- --popover: 0 0% 100%; /* base/white */
289
- --popover-foreground: 240 5% 34%; /* base/600 = #52525B */
290
- --primary: 240 4% 16%; /* base/800 = #27272A */
291
- --primary-foreground: 0 0% 100%; /* base/white */
292
- --secondary: 0 0% 100%; /* base/white */
293
- --secondary-foreground: 240 5% 34%; /* base/600 = #52525B */
294
- --muted: 240 5% 90%; /* base/200 = #E4E4E7 */
295
- --muted-foreground: 240 5% 34%; /* base/600 = #52525B */
296
- --accent: 56 99% 50%; /* #FEED02 (sunglow) */
297
- --accent-foreground: 240 10% 4%; /* base/800 for contrast on yellow */
298
- /*
299
- Shadcn — Destructive. Darkened one step to red/600. red/500 under white
300
- was 3.78:1, under AA, for both roles this token plays: the fill beneath
301
- `--destructive-foreground` (the Critical badge, every destructive
302
- button) and the plain body ink of a field/form error message on white.
303
- red/600 lifts both to 4.80:1. The hue is unchanged; only the step moved.
304
- */
305
- --destructive: 0 72% 51%; /* red/600 = #DC2626 */
306
- --destructive-foreground: 0 0% 100%; /* white */
307
- --border: 240 5% 90%; /* base/200 = #E4E4E7 */
308
- --input: 0 0% 100%; /* base/white */
309
- /* Lighter than --muted-foreground, which is also the label colour: a
310
- placeholder that matches its own label has no hierarchy left to give.
311
- Stepped off base/500 with --body-text, and for the same reason. The
312
- field paints no fill of its own (`input/styles.css`: .input-wrapper is
313
- border-only, .input-base is bg-transparent), so the hint sits on
314
- whatever ground contains the form, and on --body-surface base/500 read
315
- 4.40:1. 45% brings that to 4.59:1 and 5.04:1 on white. The retired note
316
- here claimed 4.4:1 was acceptable "on the shadcn-100 field", which named
317
- a fill the component never paints. */
318
- --input-placeholder: 240 4% 45%; /* one notch off base/500: #6E6E77, AA on body-surface */
319
- /* Field boundary, held to the 3:1 non-text floor (SC 1.4.11) on every ground a
320
- field sits on. base/400 read 2.56:1 on white and 2.34:1 on --body-surface. */
321
- --input-border: 240 4% 46%; /* base/500 = #71717A, 4.86:1 on white, 4.43:1 on body-surface */
322
- /*
323
- Focus ring. base/400 read 2.55:1 on white and 2.33:1 on --body-surface,
324
- under the 3:1 floor a focus indicator answers to (SC 1.4.11), and this is
325
- the ring every input, button and trigger in the kit paints: the wrapper
326
- border on :focus-within, and the ring itself at ring-offset-0, both of
327
- which touch the page ground directly. base/500 clears it on every light
328
- ground: 4.84:1 on white (which is also --card and --popover here) and
329
- 4.40:1 on --body-surface.
330
-
331
- It does NOT serve both themes. On the dark container surface base/500
332
- measures 2.16:1, so .dark keeps the old channel as its own declaration,
333
- where it reads 5.81:1 on --background and 4.08:1 on --card.
334
-
335
- No single value clears both themes with margin, and none is a palette
336
- step: the best one channel does is an off-scale 240 5% 57%, which clears
337
- 3:1 on all four grounds but by 0.04 on two of them. The per-theme pair
338
- sits at 4.4+ light and 4.0+ dark, each half gated in
339
- `__tests__/tokens-contract.test.ts`.
340
- */
341
- --ring: 240 4% 46%; /* base/500 = #71717A */
342
- --radius: 0.5rem;
343
-
344
- /* Accent variants */
345
- --accent-hover: 56 99% 50%; /* #FEED02 - opacity handled via /70 */
346
- --accent-mute: 56 99% 50%; /* #FEED02 - opacity handled via /50 */
347
-
348
- /* System tokens (light mode — dark overrides in .dark) */
349
- --system-error: 0 84% 60%; /* red/500 = #EF4444 */
350
- --system-error-surface: 0 86% 97%; /* red/50 = #FEF2F2 */
351
- --system-error-h1a: 0 74% 35%; /* red/800 = #991B1B */
352
- --system-error-border: 0 84% 60% / 0.5; /* #EF4444 50% */
353
- --system-error-text: 0 74% 35%; /* #991B1B */
354
- --system-success: 142 76% 36%; /* green/600 = #16A34A */
355
- --system-success-surface: 139 76% 97%; /* green/50 = #F0FDF4 */
356
- --system-success-h1a: 143 64% 24%; /* green/800 = #166534 */
357
- --system-success-border: 142 76% 36% / 0.5; /* #16A34A 50% */
358
- --system-success-text: 143 64% 24%; /* #166534 */
359
- --system-info: 221 83% 53%; /* blue/600 = #2563EB */
360
- --system-info-surface: 214 100% 97%; /* blue/50 = #EFF6FF */
361
- --system-info-h1a: 224 76% 40%; /* blue/800 = #1E40AF */
362
- --system-info-border: 221 83% 53% / 0.5; /* #2563EB 50% */
363
- --system-info-text: 224 76% 40%; /* #1E40AF */
364
- --system-alert: 48 96% 47%; /* yellow/500 = #EAB308 */
365
- --system-alert-surface: 55 92% 95%; /* yellow/50 = #FEFCE8 */
366
- --system-alert-h1a: 36 92% 29%; /* yellow/800 = #854D0E */
367
- --system-alert-border: 48 96% 47% / 0.5; /* #EAB308 50% */
368
- --system-alert-text: 36 92% 29%; /* #854D0E */
369
- --system-purple: 271 81% 56%; /* purple/600 = #9333EA */
370
- --system-purple-surface: 270 100% 98%; /* purple/50 = #FAF5FF */
371
- --system-purple-h1a: 273 67% 39%; /* purple/800 = #6B21A8 */
372
- --system-purple-border: 271 81% 56% / 0.5; /* #9333EA 50% */
373
- --system-purple-text: 273 67% 39%; /* #6B21A8 */
374
-
375
- /* Shadow color token for dark mode adaptation */
376
- --shadow-color: 0 0% 0%;
377
-
378
- /*
379
- Ledger credit semantic — deliberately DISTINCT from --destructive, not an
380
- alias: --destructive is an error/alarm, --credit is the accounting reading
381
- of a credit amount. Deeper than --destructive (red/700 vs red/500) so the
382
- two never read as the same signal. --credit-foreground mirrors --credit:
383
- the red itself carries the role as text.
384
- */
385
- --credit: 0 74% 42%; /* red/700 = #B91C1C */
386
- --credit-foreground: 0 74% 42%; /* mirrors --credit */
387
-
388
- /*
389
- Reconciliation matte fills — the recessed track behind a balance bar, one
390
- neutral step apart. Deliberately hue-neutral: the matched/unmatched signal
391
- is carried by the bar's leading edge, so a tinted wall would double-encode.
392
- */
393
- --matched-surface: 240 5% 96%; /* base/100 = #F4F4F5 */
394
- --unmatched-surface: 240 5% 90%; /* base/200 = #E4E4E7 */
395
-
396
- /*
397
- Chart series palette — 8 categorical slots drawn from the brand scales
398
- (de-york, sunglow, cod-gray) plus the system hues, ordered so no adjacent
399
- pair shares a hue neighbourhood.
400
- */
401
- --chart-1: 143 59% 36%; /* de-york-600 = #26934F */
402
- --chart-2: 0 72% 51%; /* red/600 = #DC2626 */
403
- --chart-3: 39 98% 40%; /* sunglow-600 = #CC8402 */
404
- --chart-4: 221 83% 53%; /* blue/600 = #2563EB */
405
- --chart-5: 333 71% 51%; /* pink/600 = #DB2777 */
406
- --chart-6: 193 82% 31%; /* cyan/700 = #0E7490 */
407
- --chart-7: 272 72% 47%; /* purple/700 = #7E22CE */
408
- --chart-8: 351 9% 43%; /* cod-gray-500 = #776366 */
409
- }
410
-
411
- .dark {
412
- color-scheme: dark; /* native widgets (form controls, scrollbars) follow the theme */
413
-
414
- /* Custom — Layout */
415
- --link-hover: 240 5% 96%; /* #F4F4F5 80% (opacity via /80) */
416
- --link-mute: 240 5% 96%; /* #F4F4F5 40% (opacity via /40) */
417
- --container-surface: 240 5% 26%; /* base/700 = #3F3F46 */
418
- --container-text: 240 5% 96%; /* base/100 = #F4F4F5 */
419
- --container-title: 0 0% 100%; /* base/white */
420
- --body-surface: 240 4% 16%; /* base/800 = #27272A */
421
- --body-text: 240 5% 84%; /* base/300 = #D4D4D8 */
422
- --body-title: 0 0% 100%; /* base/white */
423
- --link: 240 5% 96%; /* base/100 = #F4F4F5 */
424
- --button-primary-surface: 240 5% 96%; /* base/100 = #F4F4F5 */
425
- --button-primary-text: 240 4% 16%; /* base/800 = #27272A */
426
- --container-border: var(--border); /* shadcn/--border */
427
-
428
- /* Shadcn — Core */
429
- --background: 240 4% 16%; /* base/800 = #27272A */
430
- --foreground: 240 5% 96%; /* base/100 = #F4F4F5 */
431
- --muted: 240 5% 34%; /* base/600 = #52525B */
432
- /*
433
- Lifted off the base scale. base/400 read 4.09:1 on --container-surface
434
- (which --card aliases) and 3.01:1 on --muted, both under the 4.5 AA floor
435
- for normal text, and this is the kit's universal secondary ink: every
436
- TableHead column label (text-sm font-medium inside a text-sm Table),
437
- every empty-state line, every form label through LABEL_VOICE_CLASS, every
438
- MoneyText caption. An axe crawl of the br-sfn cockpit measured both pairs
439
- on 2026-09-06; every console on this library inherited them.
440
-
441
- 80% is the smallest round step that clears both: 6.36:1 on
442
- --container-surface and 4.68:1 on --muted. base/300 is the nearest scale
443
- step that would also clear, but it is byte-identical to this theme's
444
- --body-text, so adopting it would collapse the muted-versus-body step the
445
- two tokens exist to express. Staying on the scale is worth less than
446
- keeping that step, so the value leaves the scale instead.
447
-
448
- That step is now thin, and the trade was made with eyes open: 80% sits at
449
- L* 81 against --body-text at L* 85, so the two inks are 1.12:1 apart and
450
- barely separable side by side. Legibility won because the weight is all
451
- on one side: this token has 86 call sites and is read as prose on every
452
- surface, while --body-text has one (an uppercase sidebar group label) plus
453
- two derived theme keys. A reader who needs the step to be visible should
454
- move --body-text, which is cheap to reposition, rather than push this one
455
- back under the AA floor.
456
-
457
- Repairs a fourth pair on the way: the disabled chip in autocomplete and
458
- multiple-select paints text-muted on bg-muted-foreground, 3.01:1 before
459
- and 4.68:1 now.
460
- */
461
- --muted-foreground: 240 5% 80%; /* between base/400 and base/300: #C9C9CF, AA on container-surface and muted */
462
- --card: var(--container-surface);
463
- --card-foreground: var(--container-text);
464
- --popover: 240 4% 16%; /* base/800 = #27272A */
465
- --popover-foreground: 240 5% 96%; /* base/100 = #F4F4F5 */
466
- --border: 240 5% 34%; /* base/600 = #52525B */
467
- --input: 240 4% 16%; /* base/800 = #27272A */
468
- /* Held at base/400 rather than stepped down with the light theme: on the
469
- dark field that is already only 5.8:1, and going lighter here means
470
- darker, which would push the hint under the AA floor. */
471
- --input-placeholder: 240 5% 80%; /* between base/400 and base/300: #C9C9CF, AA on card (6.3:1); base/400 read 4.07:1 there */
472
- --input-border: 240 5% 65%; /* base/400 = #A1A1AA, 4.09:1 on card; light's base/500 reads 2.15:1 there */
473
- /* Held at base/400, which light had to leave: on this ground the two
474
- directions disagree. base/400 reads 5.81:1 on --background and 4.08:1 on
475
- --card here, while light's base/500 would read 2.16:1 on --card. */
476
- --ring: 240 5% 65%; /* base/400 = #A1A1AA */
477
- --primary: 240 5% 96%; /* base/100 = #F4F4F5 */
478
- --primary-foreground: 240 4% 16%; /* base/800 = #27272A */
479
- --secondary: 240 4% 16%; /* base/800 = #27272A */
480
- --secondary-foreground: 240 5% 96%; /* base/100 = #F4F4F5 */
481
-
482
- /* Shadcn — Accent (Brand Lerian) */
483
- --accent: 46 98% 57%; /* sunglow/400 = #FDCB28 */
484
- --accent-hover: 46 98% 57%; /* sunglow/400 = #FDCB28 - opacity via /70 */
485
- --accent-mute: 46 98% 57%; /* sunglow/400 = #FDCB28 - opacity via /50 */
486
-
487
- /*
488
- Shadcn — Destructive. Lifted to red/400 like every other red in this
489
- block (--system-error, --credit, --chart-2): the light red/500 inherited
490
- here before, which left `text-destructive` at 2.76:1 on a --card surface
491
- and `bg-destructive`/`text-destructive-foreground` at 3.78:1. The
492
- foreground inverts to red/950 — the deep end this theme already uses as
493
- --system-error-surface — so the pair reads 5.94:1.
494
- */
495
- --destructive: 0 91% 71%; /* red/400 = #F87171 */
496
- --destructive-foreground: 0 75% 15%; /* red/950 = #450A0A */
497
-
498
- /* Shadcn — System Error */
499
- --system-error: 0 91% 71%; /* red/400 = #F87171 */
500
- --system-error-surface: 0 75% 15%; /* red/950 = #450A0A */
501
- --system-error-text: 0 94% 82%; /* red/300 = #FCA5A5 */
502
- --system-error-h1a: 0 96% 89%; /* red/200 = #FECACA */
503
- --system-error-border: 0 94% 82% / 0.3; /* #FCA5A5 30% */
504
-
505
- /* Shadcn — System Success */
506
- --system-success: 142 69% 58%; /* green/400 = #4ADE80 */
507
- --system-success-surface: 145 80% 10%; /* green/950 = #052E16 */
508
- --system-success-text: 142 77% 73%; /* green/300 = #86EFAC */
509
- --system-success-h1a: 141 79% 85%; /* green/200 = #BBF7D0 */
510
- --system-success-border: 142 69% 58% / 0.3; /* #4ADE80 30% */
511
-
512
- /* Shadcn — System Info */
513
- --system-info: 213 94% 68%; /* blue/400 = #60A5FA */
514
- --system-info-surface: 226 57% 21%; /* blue/950 = #172554 */
515
- --system-info-text: 212 96% 78%; /* blue/300 = #93C5FD */
516
- --system-info-h1a: 213 97% 87%; /* blue/200 = #BFDBFE */
517
- --system-info-border: 213 94% 68% / 0.3; /* #60A5FA 30% */
518
-
519
- /* Shadcn — System Alert */
520
- --system-alert: 48 96% 53%; /* yellow/400 = #FACC15 */
521
- --system-alert-surface: 26 83% 14%; /* yellow/950 = #422006 */
522
- --system-alert-text: 48 97% 77%; /* yellow/300 = #FDE68A */
523
- --system-alert-h1a: 53 98% 77%; /* yellow/200 = #FEF08A */
524
- --system-alert-border: 48 96% 53% / 0.3; /* #FACC15 30% */
525
-
526
- /* Shadcn — System Purple */
527
- --system-purple: 270 95% 75%; /* purple/400 = #C084FC */
528
- --system-purple-surface: 266 86% 13%; /* purple/950 = #3B0764 */
529
- --system-purple-text: 269 97% 85%; /* purple/300 = #D8B4FE */
530
- --system-purple-h1a: 269 100% 92%; /* purple/200 = #E9D5FF */
531
- --system-purple-border: 270 95% 75% / 0.3; /* #C084FC 30% */
532
-
533
- /* Shadow color for dark mode */
534
- --shadow-color: 0 0% 100%;
535
-
536
- /*
537
- Ledger credit semantic — lifted for the dark canvas; foreground mirrors.
538
- Sized by the composite the mirror actually produces, not by the plain
539
- pair: components write `bg-credit/10` + `text-credit`, so the real
540
- measurement is credit-as-text over a 10% credit tint composited on
541
- --card. red/400 read only 3.34:1 there. red/300 — the channel this block
542
- already uses for --system-error-text — reaches 4.59:1, and 5.54:1 as
543
- plain text on --card.
544
-
545
- Credit stays one step further from the canvas than --destructive
546
- (red/400 here), the way light keeps credit at red/700 against a red/500
547
- destructive: on a dark ground "further from the canvas" means lighter,
548
- so the direction inverts but the separation holds and the two never read
549
- as the same signal.
550
- */
551
- --credit: 0 94% 82%; /* red/300 = #FCA5A5 */
552
- --credit-foreground: 0 94% 82%; /* mirrors --credit */
553
-
554
- /* Reconciliation matte fills — raised surfaces over base/800, one step apart. */
555
- --matched-surface: 240 5% 26%; /* base/700 = #3F3F46 */
556
- --unmatched-surface: 240 5% 34%; /* base/600 = #52525B */
557
-
558
- /* Chart series palette — same families, lifted for the dark canvas. */
559
- --chart-1: 143 53% 58%; /* de-york-400 = #5BCD86 */
560
- --chart-2: 0 91% 71%; /* red/400 = #F87171 */
561
- --chart-3: 46 98% 57%; /* sunglow-400 = #FDCB28 */
562
- --chart-4: 213 94% 68%; /* blue/400 = #60A5FA */
563
- --chart-5: 329 86% 70%; /* pink/400 = #F472B6 */
564
- --chart-6: 188 86% 53%; /* cyan/400 = #22D3EE */
565
- --chart-7: 270 95% 75%; /* purple/400 = #C084FC */
566
- --chart-8: 351 9% 69%; /* cod-gray-300 = #B7A9AB */
567
- }
568
- }
569
-
570
220
  /* Sonner toast overrides — tinted surfaces from the system token families */
571
221
  [data-sonner-toaster] {
572
222
  --width: 420px;
package/dist/index.d.ts CHANGED
@@ -18,6 +18,7 @@ export * from './components/ui/dropdown-menu';
18
18
  export * from './components/ui/input';
19
19
  export * from './components/ui/otp-input';
20
20
  export * from './components/ui/label';
21
+ export * from './components/ui/lerian-wordmark';
21
22
  export * from './components/ui/loading-button';
22
23
  export * from './components/ui/multiple-select';
23
24
  export * from './components/ui/paper';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAGA,cAAc,uBAAuB,CAAA;AACrC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,wBAAwB,CAAA;AACtC,cAAc,mCAAmC,CAAA;AACjD,cAAc,wBAAwB,CAAA;AACtC,cAAc,uBAAuB,CAAA;AACrC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,wBAAwB,CAAA;AACtC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,0BAA0B,CAAA;AACxC,cAAc,sBAAsB,CAAA;AACpC,cAAc,0BAA0B,CAAA;AACxC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,yBAAyB,CAAA;AACvC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,wBAAwB,CAAA;AACtC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,uBAAuB,CAAA;AACrC,cAAc,2BAA2B,CAAA;AACzC,cAAc,uBAAuB,CAAA;AACrC,cAAc,gCAAgC,CAAA;AAC9C,cAAc,iCAAiC,CAAA;AAC/C,cAAc,uBAAuB,CAAA;AACrC,cAAc,mCAAmC,CAAA;AACjD,cAAc,yBAAyB,CAAA;AACvC,cAAc,0BAA0B,CAAA;AACxC,cAAc,yBAAyB,CAAA;AACvC,cAAc,wBAAwB,CAAA;AACtC,cAAc,2BAA2B,CAAA;AACzC,cAAc,uBAAuB,CAAA;AACrC,cAAc,yBAAyB,CAAA;AACvC,cAAc,0BAA0B,CAAA;AACxC,cAAc,yBAAyB,CAAA;AACvC,cAAc,qBAAqB,CAAA;AACnC,cAAc,wBAAwB,CAAA;AACtC,cAAc,uBAAuB,CAAA;AACrC,cAAc,sBAAsB,CAAA;AACpC,cAAc,0BAA0B,CAAA;AACxC,cAAc,uBAAuB,CAAA;AACrC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,mBAAmB,CAAA;AACjC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,kBAAkB,CAAA;AAChC,cAAc,yBAAyB,CAAA;AACvC,cAAc,sBAAsB,CAAA;AAGpC,OAAO,EAAE,UAAU,IAAI,qBAAqB,EAAE,MAAM,yBAAyB,CAAA;AAC7E,cAAc,8CAA8C,CAAA;AAC5D,cAAc,mBAAmB,CAAA;AACjC,cAAc,qBAAqB,CAAA;AACnC,cAAc,yBAAyB,CAAA;AACvC,cAAc,gCAAgC,CAAA;AAC9C,cAAc,mBAAmB,CAAA;AACjC,cAAc,mBAAmB,CAAA;AACjC,cAAc,0BAA0B,CAAA;AACxC,cAAc,yBAAyB,CAAA;AACvC,cAAc,oBAAoB,CAAA;AAGlC,cAAc,cAAc,CAAA;AAC5B,cAAc,SAAS,CAAA;AACvB,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,UAAU,CAAA;AAGxB,cAAc,2BAA2B,CAAA;AACzC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,4BAA4B,CAAA;AAC1C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,8BAA8B,CAAA;AAG5C,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAA;AAChC,cAAc,kBAAkB,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAGA,cAAc,uBAAuB,CAAA;AACrC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,wBAAwB,CAAA;AACtC,cAAc,mCAAmC,CAAA;AACjD,cAAc,wBAAwB,CAAA;AACtC,cAAc,uBAAuB,CAAA;AACrC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,wBAAwB,CAAA;AACtC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,0BAA0B,CAAA;AACxC,cAAc,sBAAsB,CAAA;AACpC,cAAc,0BAA0B,CAAA;AACxC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,yBAAyB,CAAA;AACvC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,wBAAwB,CAAA;AACtC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,uBAAuB,CAAA;AACrC,cAAc,2BAA2B,CAAA;AACzC,cAAc,uBAAuB,CAAA;AACrC,cAAc,iCAAiC,CAAA;AAC/C,cAAc,gCAAgC,CAAA;AAC9C,cAAc,iCAAiC,CAAA;AAC/C,cAAc,uBAAuB,CAAA;AACrC,cAAc,mCAAmC,CAAA;AACjD,cAAc,yBAAyB,CAAA;AACvC,cAAc,0BAA0B,CAAA;AACxC,cAAc,yBAAyB,CAAA;AACvC,cAAc,wBAAwB,CAAA;AACtC,cAAc,2BAA2B,CAAA;AACzC,cAAc,uBAAuB,CAAA;AACrC,cAAc,yBAAyB,CAAA;AACvC,cAAc,0BAA0B,CAAA;AACxC,cAAc,yBAAyB,CAAA;AACvC,cAAc,qBAAqB,CAAA;AACnC,cAAc,wBAAwB,CAAA;AACtC,cAAc,uBAAuB,CAAA;AACrC,cAAc,sBAAsB,CAAA;AACpC,cAAc,0BAA0B,CAAA;AACxC,cAAc,uBAAuB,CAAA;AACrC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,mBAAmB,CAAA;AACjC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,kBAAkB,CAAA;AAChC,cAAc,yBAAyB,CAAA;AACvC,cAAc,sBAAsB,CAAA;AAGpC,OAAO,EAAE,UAAU,IAAI,qBAAqB,EAAE,MAAM,yBAAyB,CAAA;AAC7E,cAAc,8CAA8C,CAAA;AAC5D,cAAc,mBAAmB,CAAA;AACjC,cAAc,qBAAqB,CAAA;AACnC,cAAc,yBAAyB,CAAA;AACvC,cAAc,gCAAgC,CAAA;AAC9C,cAAc,mBAAmB,CAAA;AACjC,cAAc,mBAAmB,CAAA;AACjC,cAAc,0BAA0B,CAAA;AACxC,cAAc,yBAAyB,CAAA;AACvC,cAAc,oBAAoB,CAAA;AAGlC,cAAc,cAAc,CAAA;AAC5B,cAAc,SAAS,CAAA;AACvB,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,UAAU,CAAA;AAGxB,cAAc,2BAA2B,CAAA;AACzC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,4BAA4B,CAAA;AAC1C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,8BAA8B,CAAA;AAG5C,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAA;AAChC,cAAc,kBAAkB,CAAA"}
package/dist/index.js CHANGED
@@ -37,6 +37,7 @@ __exportStar(require("./components/ui/dropdown-menu"), exports);
37
37
  __exportStar(require("./components/ui/input"), exports);
38
38
  __exportStar(require("./components/ui/otp-input"), exports);
39
39
  __exportStar(require("./components/ui/label"), exports);
40
+ __exportStar(require("./components/ui/lerian-wordmark"), exports);
40
41
  __exportStar(require("./components/ui/loading-button"), exports);
41
42
  __exportStar(require("./components/ui/multiple-select"), exports);
42
43
  __exportStar(require("./components/ui/paper"), exports);
@@ -0,0 +1 @@
1
+ <svg viewBox="0 0 1090.88 280" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M619.42,29.69c0,15.43-10.87,27.93-27.93,27.93s-27.93-12.51-27.93-27.93,10.86-27.93,27.92-27.93,27.93,12.51,27.93,27.93h0ZM158.64,242.4v33.54H12.13v-33.55h48.36c3.16,0,5.73-2.57,5.73-5.73V87.77c0-3.16-2.57-5.73-5.73-5.73H7.85v-34.31h98.33v188.94c0,3.16,2.57,5.73,5.73,5.73h46.74ZM168.85,179.86c0,58.52,37.29,98.33,99.47,98.33,49.15,0,79.7-30.6,86.27-67.08h-40.69c-6.29,24.54-26.97,33.91-48.61,33.91-48.85,0-53.41-45.18-53.83-55-.04-1.02.77-1.87,1.79-1.87h143.61c.76-5.26,1.13-10.42,1.13-15.44,0-32.71-20.25-91.92-95.33-91.92-57.04,0-93.8,41.26-93.81,99.07ZM314.47,158.39l-99.49.02c-1.08,0-1.94-.96-1.78-2.02,4.49-31.28,30.98-42.82,50.98-42.82,33.88,0,48.71,21.59,52.08,42.79.17,1.08-.69,2.04-1.78,2.04h0ZM867.2,83.16h0s0,0,0,0h0ZM826.87,83.16h40.33v192.83h-40.32v-24.53c0-3.09-3.92-4.41-5.79-1.95-.18.23-.35.47-.53.71h0s0,.02,0,.02h0c-.11.16-.23.32-.35.47-7.92,10.56-20.68,27.53-56.24,27.53-60.83,0-91.19-46.33-91.19-98.7,0-61.42,40.37-98.72,91.17-98.72,36.73,0,48.44,15.73,56.64,26.75l.49.66c1.86,2.49,5.81,1.18,5.81-1.93v-23.14ZM770.75,115.48c34.78,0,56.14,27.81,56.14,64.8h0c0,42-26.32,63.68-56.14,63.68-34.83,0-56.14-27.43-56.14-64.43,0-42.07,26.11-64.05,56.14-64.05ZM1063.39,101.7c14.42,14.06,21.64,36.67,21.64,67.8v106.25h-41.06v-103.99c0-43.98-22.35-56.14-45.96-56.14-31.99,0-51.6,23.22-51.6,62.92v97.21h-40.68V83.15h39.93v25.07c0,3.11,3.95,4.4,5.82,1.92,8.55-11.4,26.72-29.52,55.98-29.52,37.55,0,55.75,20.88,55.93,21.08ZM657.42,275.94v-33.54h0s-37.37,0-37.37,0c-3.16,0-5.73-2.57-5.73-5.73V83.14h-81.34v34.31h37.54c3.16,0,5.73,2.57,5.73,5.73v113.48c0,3.16-2.57,5.73-5.73,5.73h-38.14v33.55h125.03ZM499.27,119.27c0,.13-.1.23-.23.23h0s-36.31,0-36.31,0c-28.68,0-28.65,24.99-28.64,43.62,0,.46,0,.92,0,1.37v111.24c0,.13-.1.23-.23.23h-41.01c-.13,0-.23-.1-.23-.23V83.27c0-.13.1-.23.23-.23h36.49c.13,0,.23.1.23.23v24.03c0,4.05,5.24,5.65,7.49,2.28.22-.32.43-.64.65-.97,8.18-12.25,18.71-28.02,52.51-28.02h9.05v38.68Z"/></svg>
@@ -0,0 +1,10 @@
1
+ /* One-link entry for pages without React or Tailwind. Light is :root; dark is
2
+ class="dark" on <html>, set by the page. No element reset. */
3
+ @import './fonts.css';
4
+ @import './tokens.css';
5
+
6
+ html {
7
+ font-family: var(--font-stack-sans);
8
+ color: hsl(var(--foreground));
9
+ background: hsl(var(--background));
10
+ }
@@ -0,0 +1,367 @@
1
+ @layer base {
2
+ :root {
3
+ color-scheme: light; /* native widgets (form controls, scrollbars) follow the theme */
4
+
5
+ /*
6
+ Sidebar geometry. These were literals inside SidebarRoot's cva
7
+ (`w-[244px]` / `w-[72px]`), which a consumer could only override by
8
+ winning a specificity argument with `cn`. As custom properties the
9
+ default still ships with this sheet.
10
+
11
+ TWO places to re-point them, and only these two:
12
+ - on the rail, via `className="[--sidebar-width:280px]"`. SidebarRoot
13
+ copies exactly these two arbitrary-property classes onto the mobile
14
+ drawer's own element, so one class moves the rail AND the drawer.
15
+ - on `:root` or `html`, which every layout inherits from.
16
+
17
+ NOT on a React-tree wrapper above the rail: that reaches the rail, but
18
+ the mobile drawer is portalled into document.body, and custom properties
19
+ inherit down the DOM tree. A wrapper is not an ancestor of the portal;
20
+ `:root` is.
21
+
22
+ They are theme-independent on purpose: a rail is not wider in the dark.
23
+ */
24
+ --sidebar-width: 244px;
25
+ --sidebar-width-collapsed: 72px;
26
+
27
+ /* Application tokens (from Figma ring-tokens) */
28
+ --body-surface: 240 5% 96%; /* base/100 = #F4F4F5 */
29
+ /*
30
+ --body-text and --container-text below both step one notch off base/500.
31
+ base/500 clears AA on white (4.86:1) but not on --body-surface, the
32
+ recessed page ground, where it read 4.43:1. That ground is exactly where
33
+ the components carrying these two tokens sit: the resting tabs trigger
34
+ (text-sm font-medium, and its hover fill is --card precisely because the
35
+ resting ground is not white), the breadcrumb page and separator, the
36
+ stepper item text and description. An axe crawl of the br-sfn cockpit
37
+ flagged .text-body-text on 2026-09-06; the ratio it printed does not
38
+ reproduce here, and the measured pair on this token's own ground is
39
+ 4.40:1 at 8-bit precision (4.43:1 in float).
40
+
41
+ 45% is the smallest step that clears it: 4.59:1 on --body-surface, up
42
+ from 4.43:1, and 5.04:1 on white. Both stay eleven notches clear of
43
+ --container-title (base/600), so the text-versus-title step holds.
44
+
45
+ Deliberately not stepped far enough to clear --muted (#E4E4E7), which
46
+ would take base/500 minus five notches and visibly darken tabs,
47
+ breadcrumbs and steppers. No component in THIS kit paints either token on
48
+ that fill. A consumer that does is a call-site fix on its side, not a
49
+ clean bill from here: product-console's extract-table pairs bg-muted with
50
+ text-body-text and reads 3.98:1 in light.
51
+ */
52
+ --body-text: 240 4% 45%; /* one notch off base/500: #6E6E77, AA on body-surface */
53
+ --body-title: 240 5% 26%; /* base/700 = #3F3F46 */
54
+ --container-surface: 0 0% 100%; /* base/white = #FFFFFF */
55
+ --container-text: 240 4% 45%; /* one notch off base/500: #6E6E77, AA on body-surface */
56
+ --container-title: 240 5% 34%; /* base/600 = #52525B */
57
+ --container-border: 0 0% 100%; /* #FFFFFF */
58
+ --link: 240 4% 16%; /* base/800 = #27272A */
59
+ --link-hover: 240 4% 16%; /* #27272A with 80% opacity via /80 */
60
+ --link-mute: 240 4% 16%; /* #27272A with 40% opacity via /40 */
61
+ --button-primary-surface: 240 4% 16%; /* base/800 = #27272A */
62
+ --button-primary-text: 0 0% 100%; /* base/white */
63
+
64
+ /* Shadcn semantic tokens (aligned with Figma) */
65
+ --background: 0 0% 100%; /* base/white = #FFFFFF */
66
+ --foreground: 240 5% 26%; /* base/700 = #3F3F46 */
67
+ --card: 0 0% 100%; /* = container-surface (white) */
68
+ /* Held at base/500, the step --container-text just moved off: this token's
69
+ own ground is --card (white), where base/500 clears AA at 4.86:1. It
70
+ measures 3.84:1 over --muted, but no component in this kit renders it
71
+ there: the data table pins its own inks rather than inheriting this one
72
+ (`ui/table/index.tsx`: cells take text-foreground, heads take
73
+ text-muted-foreground), so the hovered-row ground never sits under this
74
+ token. */
75
+ --card-foreground: 240 4% 46%; /* base/500 = #71717A */
76
+ --popover: 0 0% 100%; /* base/white */
77
+ --popover-foreground: 240 5% 34%; /* base/600 = #52525B */
78
+ --primary: 240 4% 16%; /* base/800 = #27272A */
79
+ --primary-foreground: 0 0% 100%; /* base/white */
80
+ --secondary: 0 0% 100%; /* base/white */
81
+ --secondary-foreground: 240 5% 34%; /* base/600 = #52525B */
82
+ --muted: 240 5% 90%; /* base/200 = #E4E4E7 */
83
+ --muted-foreground: 240 5% 34%; /* base/600 = #52525B */
84
+ --accent: 56 99% 50%; /* #FEED02 (sunglow) */
85
+ --accent-foreground: 240 10% 4%; /* base/800 for contrast on yellow */
86
+ /*
87
+ Shadcn — Destructive. Darkened one step to red/600. red/500 under white
88
+ was 3.78:1, under AA, for both roles this token plays: the fill beneath
89
+ `--destructive-foreground` (the Critical badge, every destructive
90
+ button) and the plain body ink of a field/form error message on white.
91
+ red/600 lifts both to 4.80:1. The hue is unchanged; only the step moved.
92
+ */
93
+ --destructive: 0 72% 51%; /* red/600 = #DC2626 */
94
+ --destructive-foreground: 0 0% 100%; /* white */
95
+ --border: 240 5% 90%; /* base/200 = #E4E4E7 */
96
+ --input: 0 0% 100%; /* base/white */
97
+ /* Lighter than --muted-foreground, which is also the label colour: a
98
+ placeholder that matches its own label has no hierarchy left to give.
99
+ Stepped off base/500 with --body-text, and for the same reason. The
100
+ field paints no fill of its own (`input/styles.css`: .input-wrapper is
101
+ border-only, .input-base is bg-transparent), so the hint sits on
102
+ whatever ground contains the form, and on --body-surface base/500 read
103
+ 4.40:1. 45% brings that to 4.59:1 and 5.04:1 on white. The retired note
104
+ here claimed 4.4:1 was acceptable "on the shadcn-100 field", which named
105
+ a fill the component never paints. */
106
+ --input-placeholder: 240 4% 45%; /* one notch off base/500: #6E6E77, AA on body-surface */
107
+ /* Field boundary, held to the 3:1 non-text floor (SC 1.4.11) on every ground a
108
+ field sits on. base/400 read 2.56:1 on white and 2.34:1 on --body-surface. */
109
+ --input-border: 240 4% 46%; /* base/500 = #71717A, 4.86:1 on white, 4.43:1 on body-surface */
110
+ /*
111
+ Focus ring. base/400 read 2.55:1 on white and 2.33:1 on --body-surface,
112
+ under the 3:1 floor a focus indicator answers to (SC 1.4.11), and this is
113
+ the ring every input, button and trigger in the kit paints: the wrapper
114
+ border on :focus-within, and the ring itself at ring-offset-0, both of
115
+ which touch the page ground directly. base/500 clears it on every light
116
+ ground: 4.84:1 on white (which is also --card and --popover here) and
117
+ 4.40:1 on --body-surface.
118
+
119
+ It does NOT serve both themes. On the dark container surface base/500
120
+ measures 2.16:1, so .dark keeps the old channel as its own declaration,
121
+ where it reads 5.81:1 on --background and 4.08:1 on --card.
122
+
123
+ No single value clears both themes with margin, and none is a palette
124
+ step: the best one channel does is an off-scale 240 5% 57%, which clears
125
+ 3:1 on all four grounds but by 0.04 on two of them. The per-theme pair
126
+ sits at 4.4+ light and 4.0+ dark, each half gated in
127
+ `__tests__/tokens-contract.test.ts`.
128
+ */
129
+ --ring: 240 4% 46%; /* base/500 = #71717A */
130
+ --radius: 0.5rem;
131
+
132
+ /* Accent variants */
133
+ --accent-hover: 56 99% 50%; /* #FEED02 - opacity handled via /70 */
134
+ --accent-mute: 56 99% 50%; /* #FEED02 - opacity handled via /50 */
135
+
136
+ /* System tokens (light mode — dark overrides in .dark) */
137
+ --system-error: 0 84% 60%; /* red/500 = #EF4444 */
138
+ --system-error-surface: 0 86% 97%; /* red/50 = #FEF2F2 */
139
+ --system-error-h1a: 0 74% 35%; /* red/800 = #991B1B */
140
+ --system-error-border: 0 84% 60% / 0.5; /* #EF4444 50% */
141
+ --system-error-text: 0 74% 35%; /* #991B1B */
142
+ --system-success: 142 76% 36%; /* green/600 = #16A34A */
143
+ --system-success-surface: 139 76% 97%; /* green/50 = #F0FDF4 */
144
+ --system-success-h1a: 143 64% 24%; /* green/800 = #166534 */
145
+ --system-success-border: 142 76% 36% / 0.5; /* #16A34A 50% */
146
+ --system-success-text: 143 64% 24%; /* #166534 */
147
+ --system-info: 221 83% 53%; /* blue/600 = #2563EB */
148
+ --system-info-surface: 214 100% 97%; /* blue/50 = #EFF6FF */
149
+ --system-info-h1a: 224 76% 40%; /* blue/800 = #1E40AF */
150
+ --system-info-border: 221 83% 53% / 0.5; /* #2563EB 50% */
151
+ --system-info-text: 224 76% 40%; /* #1E40AF */
152
+ --system-alert: 48 96% 47%; /* yellow/500 = #EAB308 */
153
+ --system-alert-surface: 55 92% 95%; /* yellow/50 = #FEFCE8 */
154
+ --system-alert-h1a: 36 92% 29%; /* yellow/800 = #854D0E */
155
+ --system-alert-border: 48 96% 47% / 0.5; /* #EAB308 50% */
156
+ --system-alert-text: 36 92% 29%; /* #854D0E */
157
+ --system-purple: 271 81% 56%; /* purple/600 = #9333EA */
158
+ --system-purple-surface: 270 100% 98%; /* purple/50 = #FAF5FF */
159
+ --system-purple-h1a: 273 67% 39%; /* purple/800 = #6B21A8 */
160
+ --system-purple-border: 271 81% 56% / 0.5; /* #9333EA 50% */
161
+ --system-purple-text: 273 67% 39%; /* #6B21A8 */
162
+
163
+ /* Shadow color token for dark mode adaptation */
164
+ --shadow-color: 0 0% 0%;
165
+
166
+ /*
167
+ Ledger credit semantic — deliberately DISTINCT from --destructive, not an
168
+ alias: --destructive is an error/alarm, --credit is the accounting reading
169
+ of a credit amount. Deeper than --destructive (red/700 vs red/500) so the
170
+ two never read as the same signal. --credit-foreground mirrors --credit:
171
+ the red itself carries the role as text.
172
+ */
173
+ --credit: 0 74% 42%; /* red/700 = #B91C1C */
174
+ --credit-foreground: 0 74% 42%; /* mirrors --credit */
175
+
176
+ /*
177
+ Reconciliation matte fills — the recessed track behind a balance bar, one
178
+ neutral step apart. Deliberately hue-neutral: the matched/unmatched signal
179
+ is carried by the bar's leading edge, so a tinted wall would double-encode.
180
+ */
181
+ --matched-surface: 240 5% 96%; /* base/100 = #F4F4F5 */
182
+ --unmatched-surface: 240 5% 90%; /* base/200 = #E4E4E7 */
183
+
184
+ /*
185
+ Chart series palette — 8 categorical slots drawn from the brand scales
186
+ (de-york, sunglow, cod-gray) plus the system hues, ordered so no adjacent
187
+ pair shares a hue neighbourhood.
188
+ */
189
+ --chart-1: 143 59% 36%; /* de-york-600 = #26934F */
190
+ --chart-2: 0 72% 51%; /* red/600 = #DC2626 */
191
+ --chart-3: 39 98% 40%; /* sunglow-600 = #CC8402 */
192
+ --chart-4: 221 83% 53%; /* blue/600 = #2563EB */
193
+ --chart-5: 333 71% 51%; /* pink/600 = #DB2777 */
194
+ --chart-6: 193 82% 31%; /* cyan/700 = #0E7490 */
195
+ --chart-7: 272 72% 47%; /* purple/700 = #7E22CE */
196
+ --chart-8: 351 9% 43%; /* cod-gray-500 = #776366 */
197
+
198
+ /* Plain-CSS twins of the @theme font slots in globals.css, for pages without
199
+ Tailwind; each must equal its --font-* value there. */
200
+ --font-stack-sans:
201
+ var(--font-inter, 'Inter'), 'Inter', ui-sans-serif, system-ui, sans-serif;
202
+ --font-stack-serif:
203
+ var(--font-plex-serif, ui-serif), ui-serif, Georgia, Cambria,
204
+ 'Times New Roman', Times, serif;
205
+ --font-stack-mono:
206
+ var(--font-plex-mono, ui-monospace), ui-monospace, SFMono-Regular, Menlo,
207
+ Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
208
+ }
209
+
210
+ .dark {
211
+ color-scheme: dark; /* native widgets (form controls, scrollbars) follow the theme */
212
+
213
+ /* Custom — Layout */
214
+ --link-hover: 240 5% 96%; /* #F4F4F5 80% (opacity via /80) */
215
+ --link-mute: 240 5% 96%; /* #F4F4F5 40% (opacity via /40) */
216
+ --container-surface: 240 5% 26%; /* base/700 = #3F3F46 */
217
+ --container-text: 240 5% 96%; /* base/100 = #F4F4F5 */
218
+ --container-title: 0 0% 100%; /* base/white */
219
+ --body-surface: 240 4% 16%; /* base/800 = #27272A */
220
+ --body-text: 240 5% 84%; /* base/300 = #D4D4D8 */
221
+ --body-title: 0 0% 100%; /* base/white */
222
+ --link: 240 5% 96%; /* base/100 = #F4F4F5 */
223
+ --button-primary-surface: 240 5% 96%; /* base/100 = #F4F4F5 */
224
+ --button-primary-text: 240 4% 16%; /* base/800 = #27272A */
225
+ --container-border: var(--border); /* shadcn/--border */
226
+
227
+ /* Shadcn — Core */
228
+ --background: 240 4% 16%; /* base/800 = #27272A */
229
+ --foreground: 240 5% 96%; /* base/100 = #F4F4F5 */
230
+ --muted: 240 5% 34%; /* base/600 = #52525B */
231
+ /*
232
+ Lifted off the base scale. base/400 read 4.09:1 on --container-surface
233
+ (which --card aliases) and 3.01:1 on --muted, both under the 4.5 AA floor
234
+ for normal text, and this is the kit's universal secondary ink: every
235
+ TableHead column label (text-sm font-medium inside a text-sm Table),
236
+ every empty-state line, every form label through LABEL_VOICE_CLASS, every
237
+ MoneyText caption. An axe crawl of the br-sfn cockpit measured both pairs
238
+ on 2026-09-06; every console on this library inherited them.
239
+
240
+ 80% is the smallest round step that clears both: 6.36:1 on
241
+ --container-surface and 4.68:1 on --muted. base/300 is the nearest scale
242
+ step that would also clear, but it is byte-identical to this theme's
243
+ --body-text, so adopting it would collapse the muted-versus-body step the
244
+ two tokens exist to express. Staying on the scale is worth less than
245
+ keeping that step, so the value leaves the scale instead.
246
+
247
+ That step is now thin, and the trade was made with eyes open: 80% sits at
248
+ L* 81 against --body-text at L* 85, so the two inks are 1.12:1 apart and
249
+ barely separable side by side. Legibility won because the weight is all
250
+ on one side: this token has 86 call sites and is read as prose on every
251
+ surface, while --body-text has one (an uppercase sidebar group label) plus
252
+ two derived theme keys. A reader who needs the step to be visible should
253
+ move --body-text, which is cheap to reposition, rather than push this one
254
+ back under the AA floor.
255
+
256
+ Repairs a fourth pair on the way: the disabled chip in autocomplete and
257
+ multiple-select paints text-muted on bg-muted-foreground, 3.01:1 before
258
+ and 4.68:1 now.
259
+ */
260
+ --muted-foreground: 240 5% 80%; /* between base/400 and base/300: #C9C9CF, AA on container-surface and muted */
261
+ --card: var(--container-surface);
262
+ --card-foreground: var(--container-text);
263
+ --popover: 240 4% 16%; /* base/800 = #27272A */
264
+ --popover-foreground: 240 5% 96%; /* base/100 = #F4F4F5 */
265
+ --border: 240 5% 34%; /* base/600 = #52525B */
266
+ --input: 240 4% 16%; /* base/800 = #27272A */
267
+ /* Held at base/400 rather than stepped down with the light theme: on the
268
+ dark field that is already only 5.8:1, and going lighter here means
269
+ darker, which would push the hint under the AA floor. */
270
+ --input-placeholder: 240 5% 80%; /* between base/400 and base/300: #C9C9CF, AA on card (6.3:1); base/400 read 4.07:1 there */
271
+ --input-border: 240 5% 65%; /* base/400 = #A1A1AA, 4.09:1 on card; light's base/500 reads 2.15:1 there */
272
+ /* Held at base/400, which light had to leave: on this ground the two
273
+ directions disagree. base/400 reads 5.81:1 on --background and 4.08:1 on
274
+ --card here, while light's base/500 would read 2.16:1 on --card. */
275
+ --ring: 240 5% 65%; /* base/400 = #A1A1AA */
276
+ --primary: 240 5% 96%; /* base/100 = #F4F4F5 */
277
+ --primary-foreground: 240 4% 16%; /* base/800 = #27272A */
278
+ --secondary: 240 4% 16%; /* base/800 = #27272A */
279
+ --secondary-foreground: 240 5% 96%; /* base/100 = #F4F4F5 */
280
+
281
+ /* Shadcn — Accent (Brand Lerian) */
282
+ --accent: 46 98% 57%; /* sunglow/400 = #FDCB28 */
283
+ --accent-hover: 46 98% 57%; /* sunglow/400 = #FDCB28 - opacity via /70 */
284
+ --accent-mute: 46 98% 57%; /* sunglow/400 = #FDCB28 - opacity via /50 */
285
+
286
+ /*
287
+ Shadcn — Destructive. Lifted to red/400 like every other red in this
288
+ block (--system-error, --credit, --chart-2): the light red/500 inherited
289
+ here before, which left `text-destructive` at 2.76:1 on a --card surface
290
+ and `bg-destructive`/`text-destructive-foreground` at 3.78:1. The
291
+ foreground inverts to red/950 — the deep end this theme already uses as
292
+ --system-error-surface — so the pair reads 5.94:1.
293
+ */
294
+ --destructive: 0 91% 71%; /* red/400 = #F87171 */
295
+ --destructive-foreground: 0 75% 15%; /* red/950 = #450A0A */
296
+
297
+ /* Shadcn — System Error */
298
+ --system-error: 0 91% 71%; /* red/400 = #F87171 */
299
+ --system-error-surface: 0 75% 15%; /* red/950 = #450A0A */
300
+ --system-error-text: 0 94% 82%; /* red/300 = #FCA5A5 */
301
+ --system-error-h1a: 0 96% 89%; /* red/200 = #FECACA */
302
+ --system-error-border: 0 94% 82% / 0.3; /* #FCA5A5 30% */
303
+
304
+ /* Shadcn — System Success */
305
+ --system-success: 142 69% 58%; /* green/400 = #4ADE80 */
306
+ --system-success-surface: 145 80% 10%; /* green/950 = #052E16 */
307
+ --system-success-text: 142 77% 73%; /* green/300 = #86EFAC */
308
+ --system-success-h1a: 141 79% 85%; /* green/200 = #BBF7D0 */
309
+ --system-success-border: 142 69% 58% / 0.3; /* #4ADE80 30% */
310
+
311
+ /* Shadcn — System Info */
312
+ --system-info: 213 94% 68%; /* blue/400 = #60A5FA */
313
+ --system-info-surface: 226 57% 21%; /* blue/950 = #172554 */
314
+ --system-info-text: 212 96% 78%; /* blue/300 = #93C5FD */
315
+ --system-info-h1a: 213 97% 87%; /* blue/200 = #BFDBFE */
316
+ --system-info-border: 213 94% 68% / 0.3; /* #60A5FA 30% */
317
+
318
+ /* Shadcn — System Alert */
319
+ --system-alert: 48 96% 53%; /* yellow/400 = #FACC15 */
320
+ --system-alert-surface: 26 83% 14%; /* yellow/950 = #422006 */
321
+ --system-alert-text: 48 97% 77%; /* yellow/300 = #FDE68A */
322
+ --system-alert-h1a: 53 98% 77%; /* yellow/200 = #FEF08A */
323
+ --system-alert-border: 48 96% 53% / 0.3; /* #FACC15 30% */
324
+
325
+ /* Shadcn — System Purple */
326
+ --system-purple: 270 95% 75%; /* purple/400 = #C084FC */
327
+ --system-purple-surface: 266 86% 13%; /* purple/950 = #3B0764 */
328
+ --system-purple-text: 269 97% 85%; /* purple/300 = #D8B4FE */
329
+ --system-purple-h1a: 269 100% 92%; /* purple/200 = #E9D5FF */
330
+ --system-purple-border: 270 95% 75% / 0.3; /* #C084FC 30% */
331
+
332
+ /* Shadow color for dark mode */
333
+ --shadow-color: 0 0% 100%;
334
+
335
+ /*
336
+ Ledger credit semantic — lifted for the dark canvas; foreground mirrors.
337
+ Sized by the composite the mirror actually produces, not by the plain
338
+ pair: components write `bg-credit/10` + `text-credit`, so the real
339
+ measurement is credit-as-text over a 10% credit tint composited on
340
+ --card. red/400 read only 3.34:1 there. red/300 — the channel this block
341
+ already uses for --system-error-text — reaches 4.59:1, and 5.54:1 as
342
+ plain text on --card.
343
+
344
+ Credit stays one step further from the canvas than --destructive
345
+ (red/400 here), the way light keeps credit at red/700 against a red/500
346
+ destructive: on a dark ground "further from the canvas" means lighter,
347
+ so the direction inverts but the separation holds and the two never read
348
+ as the same signal.
349
+ */
350
+ --credit: 0 94% 82%; /* red/300 = #FCA5A5 */
351
+ --credit-foreground: 0 94% 82%; /* mirrors --credit */
352
+
353
+ /* Reconciliation matte fills — raised surfaces over base/800, one step apart. */
354
+ --matched-surface: 240 5% 26%; /* base/700 = #3F3F46 */
355
+ --unmatched-surface: 240 5% 34%; /* base/600 = #52525B */
356
+
357
+ /* Chart series palette — same families, lifted for the dark canvas. */
358
+ --chart-1: 143 53% 58%; /* de-york-400 = #5BCD86 */
359
+ --chart-2: 0 91% 71%; /* red/400 = #F87171 */
360
+ --chart-3: 46 98% 57%; /* sunglow-400 = #FDCB28 */
361
+ --chart-4: 213 94% 68%; /* blue/400 = #60A5FA */
362
+ --chart-5: 329 86% 70%; /* pink/400 = #F472B6 */
363
+ --chart-6: 188 86% 53%; /* cyan/400 = #22D3EE */
364
+ --chart-7: 270 95% 75%; /* purple/400 = #C084FC */
365
+ --chart-8: 351 9% 69%; /* cod-gray-300 = #B7A9AB */
366
+ }
367
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lerianstudio/sindarian-ui",
3
- "version": "2.0.0-beta.20",
3
+ "version": "2.0.0-beta.21",
4
4
  "description": "Sindarian UI - A UI library for Midaz Console",
5
5
  "license": "Elastic-2.0",
6
6
  "author": {
@@ -41,8 +41,8 @@
41
41
  "build": "npm run build:cjs && npm run build:esm && npm run copy:assets && npm run copy:styles",
42
42
  "build:cjs": "tsc && tsc-alias -p tsconfig.json && copyfiles -u 1 \"src/**/*.cjs\" \"src/**/*.d.cts\" \"src/**/*.json\" dist",
43
43
  "build:esm": "tsc -p tsconfig.esm.json && tsc-alias -p tsconfig.esm.json --resolve-full-paths && copyfiles -u 1 \"src/**/*.cjs\" \"src/**/*.d.cts\" \"src/**/*.json\" dist/esm && node -e \"require('fs').writeFileSync('dist/esm/package.json',JSON.stringify({type:'module'}))\" && node scripts/check-esm-output.mjs",
44
- "copy:assets": "copyfiles -f src/public/**/* dist/public",
45
- "copy:styles": "copyfiles -u 1 src/**/*.css dist",
44
+ "copy:assets": "copyfiles -f \"src/public/**/*\" dist/public && copyfiles -u 1 \"src/fonts/*\" dist",
45
+ "copy:styles": "copyfiles -u 1 \"src/**/*.css\" dist",
46
46
  "lint": "eslint .",
47
47
  "lint:fix": "eslint . --fix",
48
48
  "storybook": "storybook dev -p 6007",