@fastyshop/ui 0.1.0

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.
Files changed (18) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/LICENSE +21 -0
  3. package/README.md +60 -0
  4. package/THIRD_PARTY_NOTICES.md +14 -0
  5. package/dist/button.d.ts +44 -0
  6. package/dist/button.d.ts.map +1 -0
  7. package/dist/button.js +39 -0
  8. package/dist/button.js.map +1 -0
  9. package/dist/fonts/InterVariable.woff2 +0 -0
  10. package/dist/fonts/LICENSE.txt +92 -0
  11. package/dist/fonts/PROVENANCE.md +23 -0
  12. package/dist/index.d.ts +11 -0
  13. package/dist/index.d.ts.map +1 -0
  14. package/dist/index.js +11 -0
  15. package/dist/index.js.map +1 -0
  16. package/dist/styles.css +518 -0
  17. package/dist/tailwind-theme.css +122 -0
  18. package/package.json +60 -0
package/CHANGELOG.md ADDED
@@ -0,0 +1,12 @@
1
+ # Changelog
2
+
3
+ All notable changes to `@fastyshop/ui` are recorded here. Released versions and Git tags are immutable.
4
+
5
+ ## 0.1.0
6
+
7
+ - Added the first public package contract for ESM, TypeScript declarations, runtime CSS, and the Tailwind CSS v4 bridge.
8
+ - Added the FastyShop Button with Base UI behavior and controlled loading, icon, size, and variant states.
9
+ - Added the generated Light/Dark product-token surface and bundled Inter variable font.
10
+ - Added MIT licensing and the Inter third-party notice, license, and provenance files.
11
+
12
+ This release does not include a Cabinet or Platform migration. Applications adopt the package in their own version-pinned changes.
package/LICENSE ADDED
@@ -0,0 +1,21 @@
1
+ MIT License
2
+
3
+ Copyright (c) 2026 FastyShop contributors
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/README.md ADDED
@@ -0,0 +1,60 @@
1
+ # @fastyshop/ui
2
+
3
+ `@fastyshop/ui` contains the shared FastyShop product tokens and React components. The package ships ESM, TypeScript declarations, Tailwind CSS v4 integration, the Inter variable font, and the FastyShop Button.
4
+
5
+ ## Install
6
+
7
+ Install an exact version from the public npm registry. No npm login or read token is required.
8
+
9
+ ```bash
10
+ pnpm add @fastyshop/ui@0.1.0
11
+ ```
12
+
13
+ React and React DOM are peer dependencies. Supported versions are `>=19.2.0 <20`. The package requires Node.js `>=24.18.0 <25` for build and server-side use.
14
+
15
+ ## CSS and themes
16
+
17
+ Import the runtime stylesheet once near the root of the application:
18
+
19
+ ```css
20
+ @import "@fastyshop/ui/styles.css";
21
+ ```
22
+
23
+ Light is the default theme. Set `data-fs-theme="dark"` on the document root or on a bounded subtree to use the dark semantic values:
24
+
25
+ ```html
26
+ <html data-fs-theme="dark"></html>
27
+ ```
28
+
29
+ The runtime stylesheet includes the bundled Inter variable font and the package component styles. If your application already loads Inter, keep one authoritative font declaration and verify that its family and weights match the package contract.
30
+
31
+ Tailwind CSS v4 consumers can additionally import the semantic utility bridge:
32
+
33
+ ```css
34
+ @import "tailwindcss";
35
+ @import "@fastyshop/ui/tailwind-theme.css";
36
+ ```
37
+
38
+ The bridge maps `fs`-prefixed utilities to the runtime CSS variables. It does not copy token values into the consuming application.
39
+
40
+ ## Button
41
+
42
+ ```tsx
43
+ import { Button } from "@fastyshop/ui";
44
+
45
+ export function SaveAction() {
46
+ return <Button>Save</Button>;
47
+ }
48
+ ```
49
+
50
+ `Button` is a client component backed by Base UI. The package owns that runtime dependency; consumers do not install Base UI, Radix, or shadcn directly. Use a link for navigation, keep `loading` controlled, and provide a non-empty `aria-label` for icon-only buttons.
51
+
52
+ ## Package boundary
53
+
54
+ The public exports are:
55
+
56
+ - `@fastyshop/ui`
57
+ - `@fastyshop/ui/styles.css`
58
+ - `@fastyshop/ui/tailwind-theme.css`
59
+
60
+ Source files, tests, Storybook, registry tooling, and private design evidence are not part of the npm tarball. The package is MIT licensed; bundled Inter files retain the SIL Open Font License 1.1 described in `THIRD_PARTY_NOTICES.md`.
package/THIRD_PARTY_NOTICES.md ADDED
@@ -0,0 +1,14 @@
1
+ # Third-Party Notices
2
+
3
+ The FastyShop MIT license applies only to FastyShop-authored material. This
4
+ distribution includes the following third-party material under its own terms.
5
+
6
+ ## Inter variable font v4.1
7
+
8
+ - Copyright: The Inter Project Authors
9
+ - Upstream: `rsms/inter`, release `v4.1`
10
+ - License: SIL Open Font License 1.1
11
+ - Distributed asset: `dist/fonts/InterVariable.woff2`
12
+ - Full license: `dist/fonts/LICENSE.txt`
13
+ - Provenance: `dist/fonts/PROVENANCE.md`
14
+ - Modification status: copied without modification
package/dist/button.d.ts ADDED
@@ -0,0 +1,44 @@
1
+ import { type ButtonHTMLAttributes, type ComponentType, type ReactNode, type SVGProps } from "react";
2
+ /** @inline */
3
+ type ButtonVariant = "primary" | "secondary" | "ghost" | "destructive";
4
+ /** @inline */
5
+ type ButtonSize = "sm" | "md" | "lg";
6
+ /** @inline */
7
+ type ButtonIcon = ComponentType<SVGProps<SVGSVGElement>>;
8
+ /** @inline */
9
+ type ButtonOwnProps = {
10
+ /** Visual and semantic emphasis of the action. */
11
+ variant?: ButtonVariant;
12
+ /** Visible face size. Medium resolves to 44px on mobile and 40px at tablet widths. */
13
+ size?: ButtonSize;
14
+ /** Controlled pending state. It preserves the label and blocks native activation. */
15
+ loading?: boolean;
16
+ /** Consumer-provided Lucide-compatible SVG component. */
17
+ icon?: ButtonIcon;
18
+ /** Placement of a decorative icon next to a visible label. */
19
+ iconPosition?: "start" | "end";
20
+ };
21
+ /** @inline */
22
+ type NativeButtonProps = Omit<ButtonHTMLAttributes<HTMLButtonElement>, keyof ButtonOwnProps | "children">;
23
+ /** @inline */
24
+ type TextButtonProps = ButtonOwnProps & NativeButtonProps & {
25
+ children: Exclude<ReactNode, boolean | null | undefined>;
26
+ };
27
+ /** @inline */
28
+ type IconOnlyButtonProps = Omit<ButtonOwnProps, "iconPosition"> & NativeButtonProps & {
29
+ "aria-label": string;
30
+ children?: never;
31
+ icon: ButtonIcon;
32
+ iconPosition?: never;
33
+ };
34
+ /** Public props for the FastyShop action Button. */
35
+ export type ButtonProps = TextButtonProps | IconOnlyButtonProps;
36
+ /**
37
+ * Production action primitive backed by Base UI.
38
+ *
39
+ * Use a link for navigation. `loading` is controlled by the consumer and does
40
+ * not own an async lifecycle, success state or error copy.
41
+ */
42
+ export declare const Button: import("react").ForwardRefExoticComponent<ButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
43
+ export {};
44
+ //# sourceMappingURL=button.d.ts.map
package/dist/button.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../src/button.tsx"],"names":[],"mappings":"AAGA,OAAO,EAKL,KAAK,oBAAoB,EACzB,KAAK,aAAa,EAClB,KAAK,SAAS,EACd,KAAK,QAAQ,EACd,MAAM,OAAO,CAAC;AAEf,cAAc;AACd,KAAK,aAAa,GAAG,SAAS,GAAG,WAAW,GAAG,OAAO,GAAG,aAAa,CAAC;AACvE,cAAc;AACd,KAAK,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AACrC,cAAc;AACd,KAAK,UAAU,GAAG,aAAa,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC;AAEzD,cAAc;AACd,KAAK,cAAc,GAAG;IACpB,kDAAkD;IAClD,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,sFAAsF;IACtF,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,qFAAqF;IACrF,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,yDAAyD;IACzD,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,8DAA8D;IAC9D,YAAY,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC;CAChC,CAAC;AAEF,cAAc;AACd,KAAK,iBAAiB,GAAG,IAAI,CAC3B,oBAAoB,CAAC,iBAAiB,CAAC,EACvC,MAAM,cAAc,GAAG,UAAU,CAClC,CAAC;AAEF,cAAc;AACd,KAAK,eAAe,GAAG,cAAc,GACnC,iBAAiB,GAAG;IAClB,QAAQ,EAAE,OAAO,CAAC,SAAS,EAAE,OAAO,GAAG,IAAI,GAAG,SAAS,CAAC,CAAC;CAC1D,CAAC;AAEJ,cAAc;AACd,KAAK,mBAAmB,GAAG,IAAI,CAAC,cAAc,EAAE,cAAc,CAAC,GAC7D,iBAAiB,GAAG;IAClB,YAAY,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,IAAI,EAAE,UAAU,CAAC;IACjB,YAAY,CAAC,EAAE,KAAK,CAAC;CACtB,CAAC;AAEJ,oDAAoD;AACpD,MAAM,MAAM,WAAW,GAAG,eAAe,GAAG,mBAAmB,CAAC;AAwBhE;;;;;GAKG;AACH,eAAO,MAAM,MAAM,2GAkEjB,CAAC"}
package/dist/button.js ADDED
@@ -0,0 +1,39 @@
1
+ "use client";
2
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
+ import { Button as BaseUIButton } from "@base-ui/react/button";
4
+ import { Children, forwardRef, Fragment, isValidElement, } from "react";
5
+ function hasVisibleLabel(children) {
6
+ return Children.toArray(children).some((child) => {
7
+ if (typeof child === "string")
8
+ return child.trim().length > 0;
9
+ if (typeof child === "number" || typeof child === "bigint")
10
+ return true;
11
+ if (!isValidElement(child))
12
+ return false;
13
+ if (child.type === Fragment || typeof child.type === "string") {
14
+ return hasVisibleLabel(child.props.children);
15
+ }
16
+ return true;
17
+ });
18
+ }
19
+ function Spinner() {
20
+ return (_jsx("svg", { "aria-hidden": "true", className: "fs-button__spinner", focusable: "false", viewBox: "0 0 24 24", children: _jsx("path", { d: "M21 12a9 9 0 1 1-6.22-8.56" }) }));
21
+ }
22
+ /**
23
+ * Production action primitive backed by Base UI.
24
+ *
25
+ * Use a link for navigation. `loading` is controlled by the consumer and does
26
+ * not own an async lifecycle, success state or error copy.
27
+ */
28
+ export const Button = forwardRef(function Button({ "aria-busy": ariaBusy, "aria-label": ariaLabel, children, className, disabled = false, icon: Icon, iconPosition = "start", loading = false, size = "md", type = "button", variant = "primary", ...nativeProps }, ref) {
29
+ const iconOnly = !hasVisibleLabel(children);
30
+ if (iconOnly && (!Icon || !ariaLabel?.trim())) {
31
+ throw new Error("FastyShop Button requires visible children, or an icon with a non-empty aria-label.");
32
+ }
33
+ const blocked = disabled || loading;
34
+ const loadingWithoutIcon = loading && !Icon;
35
+ const visual = loading && Icon ? (_jsx(Spinner, {})) : Icon ? (_jsx(Icon, { "aria-hidden": "true", className: "fs-button__icon", focusable: "false" })) : null;
36
+ const classes = ["fs-button", className].filter(Boolean).join(" ");
37
+ return (_jsxs(BaseUIButton, { ...nativeProps, "aria-busy": loading ? true : ariaBusy, "aria-label": ariaLabel, className: classes, "data-fs-icon-only": iconOnly ? "true" : undefined, "data-fs-loading": loading ? "true" : undefined, "data-fs-size": size, "data-fs-variant": variant, disabled: blocked, nativeButton: true, ref: ref, type: type, children: [loadingWithoutIcon ? (_jsx("span", { "aria-hidden": "true", className: "fs-button__loading-indicator", children: _jsx(Spinner, {}) })) : null, iconOnly ? (visual) : (_jsxs("span", { className: "fs-button__content", children: [iconPosition === "start" ? visual : null, _jsx("span", { className: "fs-button__label", children: children }), iconPosition === "end" ? visual : null] }))] }));
38
+ });
39
+ //# sourceMappingURL=button.js.map
package/dist/button.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"button.js","sourceRoot":"","sources":["../src/button.tsx"],"names":[],"mappings":"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"}
package/dist/fonts/InterVariable.woff2 ADDED
Binary file
package/dist/fonts/LICENSE.txt ADDED
@@ -0,0 +1,92 @@
1
+ Copyright (c) 2016 The Inter Project Authors (https://github.com/rsms/inter)
2
+
3
+ This Font Software is licensed under the SIL Open Font License, Version 1.1.
4
+ This license is copied below, and is also available with a FAQ at:
5
+ http://scripts.sil.org/OFL
6
+
7
+ -----------------------------------------------------------
8
+ SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
9
+ -----------------------------------------------------------
10
+
11
+ PREAMBLE
12
+ The goals of the Open Font License (OFL) are to stimulate worldwide
13
+ development of collaborative font projects, to support the font creation
14
+ efforts of academic and linguistic communities, and to provide a free and
15
+ open framework in which fonts may be shared and improved in partnership
16
+ with others.
17
+
18
+ The OFL allows the licensed fonts to be used, studied, modified and
19
+ redistributed freely as long as they are not sold by themselves. The
20
+ fonts, including any derivative works, can be bundled, embedded,
21
+ redistributed and/or sold with any software provided that any reserved
22
+ names are not used by derivative works. The fonts and derivatives,
23
+ however, cannot be released under any other type of license. The
24
+ requirement for fonts to remain under this license does not apply
25
+ to any document created using the fonts or their derivatives.
26
+
27
+ DEFINITIONS
28
+ "Font Software" refers to the set of files released by the Copyright
29
+ Holder(s) under this license and clearly marked as such. This may
30
+ include source files, build scripts and documentation.
31
+
32
+ "Reserved Font Name" refers to any names specified as such after the
33
+ copyright statement(s).
34
+
35
+ "Original Version" refers to the collection of Font Software components as
36
+ distributed by the Copyright Holder(s).
37
+
38
+ "Modified Version" refers to any derivative made by adding to, deleting,
39
+ or substituting -- in part or in whole -- any of the components of the
40
+ Original Version, by changing formats or by porting the Font Software to a
41
+ new environment.
42
+
43
+ "Author" refers to any designer, engineer, programmer, technical
44
+ writer or other person who contributed to the Font Software.
45
+
46
+ PERMISSION AND CONDITIONS
47
+ Permission is hereby granted, free of charge, to any person obtaining
48
+ a copy of the Font Software, to use, study, copy, merge, embed, modify,
49
+ redistribute, and sell modified and unmodified copies of the Font
50
+ Software, subject to the following conditions:
51
+
52
+ 1) Neither the Font Software nor any of its individual components,
53
+ in Original or Modified Versions, may be sold by itself.
54
+
55
+ 2) Original or Modified Versions of the Font Software may be bundled,
56
+ redistributed and/or sold with any software, provided that each copy
57
+ contains the above copyright notice and this license. These can be
58
+ included either as stand-alone text files, human-readable headers or
59
+ in the appropriate machine-readable metadata fields within text or
60
+ binary files as long as those fields can be easily viewed by the user.
61
+
62
+ 3) No Modified Version of the Font Software may use the Reserved Font
63
+ Name(s) unless explicit written permission is granted by the corresponding
64
+ Copyright Holder. This restriction only applies to the primary font name as
65
+ presented to the users.
66
+
67
+ 4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
68
+ Software shall not be used to promote, endorse or advertise any
69
+ Modified Version, except to acknowledge the contribution(s) of the
70
+ Copyright Holder(s) and the Author(s) or with their explicit written
71
+ permission.
72
+
73
+ 5) The Font Software, modified or unmodified, in part or in whole,
74
+ must be distributed entirely under this license, and must not be
75
+ distributed under any other license. The requirement for fonts to
76
+ remain under this license does not apply to any document created
77
+ using the Font Software.
78
+
79
+ TERMINATION
80
+ This license becomes null and void if any of the above conditions are
81
+ not met.
82
+
83
+ DISCLAIMER
84
+ THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
85
+ EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
86
+ MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
87
+ OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
88
+ COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
89
+ INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
90
+ DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
91
+ FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
92
+ OTHER DEALINGS IN THE FONT SOFTWARE.
package/dist/fonts/PROVENANCE.md ADDED
@@ -0,0 +1,23 @@
1
+ # Inter v4.1 provenance
2
+
3
+ - Upstream: `rsms/inter`
4
+ - Release tag: `v4.1`
5
+ - Release: `https://github.com/rsms/inter/releases/tag/v4.1`
6
+ - Release asset: `Inter-4.1.zip`
7
+ - Archive: `https://github.com/rsms/inter/releases/download/v4.1/Inter-4.1.zip`
8
+ - Recorded archive SHA-256: `9883fdd4a49d4fb66bd8177ba6625ef9a64aa45899767dde3d36aa425756b11e`
9
+ - Included archive path: `web/InterVariable.woff2`
10
+ - Included file SHA-256: `693b77d4f32ee9b8bfc995589b5fad5e99adf2832738661f5402f9978429a8e3`
11
+ - License origin: official `v4.1` archive member
12
+ - License path: `LICENSE.txt`
13
+ - License SHA-256: `262481e844521b326f5ecd053e59b98c8b2da78c8ee1bdbb6e8174305e54935a`
14
+ - Last official release audit: `2026-09-01`
15
+
16
+ The archive checksum is retained provenance, not a claim that routine offline
17
+ builds download the release. The conditional official-release audit downloads
18
+ the exact asset and reconciles the archive, font member, license and local
19
+ source whenever an identity surface changes.
20
+
21
+ The font and license are copied without modification. Italic, static and
22
+ InterDisplay files are not packaged. Product roles use weights 400, 500 and 600
23
+ only.
package/dist/index.d.ts ADDED
@@ -0,0 +1,11 @@
1
+ /**
2
+ * Server-safe public entrypoint for the FastyShop UI package.
3
+ *
4
+ * Interactive modules add their own leaf-level `"use client"` directive and
5
+ * explicit package export in the task that owns them. This root entrypoint
6
+ * remains safe to resolve from server code.
7
+ *
8
+ * @packageDocumentation
9
+ */
10
+ export { Button, type ButtonProps } from "./button.js";
11
+ //# sourceMappingURL=index.d.ts.map
package/dist/index.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,aAAa,CAAC"}
package/dist/index.js ADDED
@@ -0,0 +1,11 @@
1
+ /**
2
+ * Server-safe public entrypoint for the FastyShop UI package.
3
+ *
4
+ * Interactive modules add their own leaf-level `"use client"` directive and
5
+ * explicit package export in the task that owns them. This root entrypoint
6
+ * remains safe to resolve from server code.
7
+ *
8
+ * @packageDocumentation
9
+ */
10
+ export { Button } from "./button.js";
11
+ //# sourceMappingURL=index.js.map
package/dist/index.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,EAAE,MAAM,EAAoB,MAAM,aAAa,CAAC"}
package/dist/styles.css ADDED
@@ -0,0 +1,518 @@
1
+ /* @generated by scripts/tokens/build.mjs; dataset 1.0.1; source-sha256 15d6333e284ffa92b707f3bc034208848c9e35409b5f8179552ab48814ad6002 */
2
+ @font-face {
3
+ font-family: "InterVariable";
4
+ src: url("./fonts/InterVariable.woff2") format("woff2");
5
+ font-display: swap;
6
+ font-style: normal;
7
+ font-weight: 100 900;
8
+ }
9
+
10
+ :root {
11
+ --fs-color-canvas: oklch(100% 0 none);
12
+ --fs-color-surface: oklch(100% 0 none);
13
+ --fs-color-surface-subtle: oklch(98.5% 0 none);
14
+ --fs-color-surface-raised: oklch(100% 0 none);
15
+ --fs-color-surface-inverse: oklch(20.5% 0 none);
16
+ --fs-color-surface-scrim: oklch(0% 0 none / 0.56);
17
+ --fs-color-content-primary: oklch(14.5% 0 none);
18
+ --fs-color-content-secondary: oklch(37.1% 0 none);
19
+ --fs-color-content-tertiary: oklch(43.9% 0 none);
20
+ --fs-color-content-disabled: oklch(55.6% 0 none);
21
+ --fs-color-content-inverse: oklch(100% 0 none);
22
+ --fs-color-content-link: oklch(45.7% 0.24 277.023);
23
+ --fs-color-border-subtle: oklch(92.2% 0 none);
24
+ --fs-color-border: oklch(87% 0 none);
25
+ --fs-color-border-strong: oklch(55.6% 0 none);
26
+ --fs-color-border-interactive: oklch(51.1% 0.262 276.966);
27
+ --fs-color-focus-ring: oklch(58.5% 0.233 277.117);
28
+ --fs-color-action-primary: oklch(51.1% 0.262 276.966);
29
+ --fs-color-action-primary-hover: oklch(45.7% 0.24 277.023);
30
+ --fs-color-action-primary-pressed: oklch(39.8% 0.195 277.366);
31
+ --fs-color-action-primary-content: oklch(100% 0 none);
32
+ --fs-color-action-secondary: oklch(100% 0 none);
33
+ --fs-color-action-secondary-hover: oklch(98.5% 0 none);
34
+ --fs-color-action-secondary-pressed: oklch(97% 0 none);
35
+ --fs-color-action-secondary-content: oklch(20.5% 0 none);
36
+ --fs-color-action-secondary-border: oklch(55.6% 0 none);
37
+ --fs-color-action-ghost-hover: oklch(97% 0 none);
38
+ --fs-color-action-ghost-pressed: oklch(92.2% 0 none);
39
+ --fs-color-action-ghost-content: oklch(20.5% 0 none);
40
+ --fs-color-action-destructive: oklch(50.5% 0.213 27.518);
41
+ --fs-color-action-destructive-hover: oklch(44.4% 0.177 26.899);
42
+ --fs-color-action-destructive-pressed: oklch(39.6% 0.141 25.723);
43
+ --fs-color-action-destructive-content: oklch(100% 0 none);
44
+ --fs-color-disabled-surface: oklch(97% 0 none);
45
+ --fs-color-disabled-content: oklch(55.6% 0 none);
46
+ --fs-color-disabled-border: oklch(92.2% 0 none);
47
+ --fs-color-status-success-solid: oklch(43.2% 0.095 166.913);
48
+ --fs-color-status-success-on-solid: oklch(100% 0 none);
49
+ --fs-color-status-success-soft: oklch(97.9% 0.021 166.113);
50
+ --fs-color-status-success-content: oklch(37.8% 0.077 168.94);
51
+ --fs-color-status-success-border: oklch(43.2% 0.095 166.913);
52
+ --fs-color-status-warning-solid: oklch(47.3% 0.137 46.201);
53
+ --fs-color-status-warning-on-solid: oklch(100% 0 none);
54
+ --fs-color-status-warning-soft: oklch(98.7% 0.022 95.277);
55
+ --fs-color-status-warning-content: oklch(41.4% 0.112 45.904);
56
+ --fs-color-status-warning-border: oklch(47.3% 0.137 46.201);
57
+ --fs-color-status-error-solid: oklch(50.5% 0.213 27.518);
58
+ --fs-color-status-error-on-solid: oklch(100% 0 none);
59
+ --fs-color-status-error-soft: oklch(97.1% 0.013 17.38);
60
+ --fs-color-status-error-content: oklch(39.6% 0.141 25.723);
61
+ --fs-color-status-error-border: oklch(50.5% 0.213 27.518);
62
+ --fs-color-status-info-solid: oklch(48.8% 0.243 264.376);
63
+ --fs-color-status-info-on-solid: oklch(100% 0 none);
64
+ --fs-color-status-info-soft: oklch(97% 0.014 254.604);
65
+ --fs-color-status-info-content: oklch(37.9% 0.146 265.522);
66
+ --fs-color-status-info-border: oklch(48.8% 0.243 264.376);
67
+ --fs-color-brand-solid: oklch(51.1% 0.262 276.966);
68
+ --fs-color-brand-on-solid: oklch(100% 0 none);
69
+ --fs-color-brand-soft: oklch(87% 0.065 274.039);
70
+ --fs-color-brand-on-soft: oklch(14.5% 0 none);
71
+ --fs-color-brand-border: oklch(58.5% 0.233 277.117);
72
+ --fs-type-display-lg-font-family: "InterVariable", "Inter", ui-sans-serif, system-ui, sans-serif;
73
+ --fs-type-display-lg-font-weight: 600;
74
+ --fs-type-display-lg-font-size: 2.25rem;
75
+ --fs-type-display-lg-line-height: 2.75rem;
76
+ --fs-type-display-lg-letter-spacing: -0.025em;
77
+ --fs-type-display-md-font-family: "InterVariable", "Inter", ui-sans-serif, system-ui, sans-serif;
78
+ --fs-type-display-md-font-weight: 600;
79
+ --fs-type-display-md-font-size: 1.875rem;
80
+ --fs-type-display-md-line-height: 2.25rem;
81
+ --fs-type-display-md-letter-spacing: -0.02em;
82
+ --fs-type-heading-lg-font-family: "InterVariable", "Inter", ui-sans-serif, system-ui, sans-serif;
83
+ --fs-type-heading-lg-font-weight: 600;
84
+ --fs-type-heading-lg-font-size: 1.5rem;
85
+ --fs-type-heading-lg-line-height: 2rem;
86
+ --fs-type-heading-lg-letter-spacing: -0.02em;
87
+ --fs-type-heading-md-font-family: "InterVariable", "Inter", ui-sans-serif, system-ui, sans-serif;
88
+ --fs-type-heading-md-font-weight: 600;
89
+ --fs-type-heading-md-font-size: 1.25rem;
90
+ --fs-type-heading-md-line-height: 1.75rem;
91
+ --fs-type-heading-md-letter-spacing: -0.015em;
92
+ --fs-type-heading-sm-font-family: "InterVariable", "Inter", ui-sans-serif, system-ui, sans-serif;
93
+ --fs-type-heading-sm-font-weight: 600;
94
+ --fs-type-heading-sm-font-size: 1.125rem;
95
+ --fs-type-heading-sm-line-height: 1.5rem;
96
+ --fs-type-heading-sm-letter-spacing: -0.01em;
97
+ --fs-type-body-lg-font-family: "InterVariable", "Inter", ui-sans-serif, system-ui, sans-serif;
98
+ --fs-type-body-lg-font-weight: 400;
99
+ --fs-type-body-lg-font-size: 1.125rem;
100
+ --fs-type-body-lg-line-height: 1.75rem;
101
+ --fs-type-body-lg-letter-spacing: 0em;
102
+ --fs-type-body-md-font-family: "InterVariable", "Inter", ui-sans-serif, system-ui, sans-serif;
103
+ --fs-type-body-md-font-weight: 400;
104
+ --fs-type-body-md-font-size: 1rem;
105
+ --fs-type-body-md-line-height: 1.5rem;
106
+ --fs-type-body-md-letter-spacing: 0em;
107
+ --fs-type-body-sm-font-family: "InterVariable", "Inter", ui-sans-serif, system-ui, sans-serif;
108
+ --fs-type-body-sm-font-weight: 400;
109
+ --fs-type-body-sm-font-size: 0.875rem;
110
+ --fs-type-body-sm-line-height: 1.25rem;
111
+ --fs-type-body-sm-letter-spacing: 0em;
112
+ --fs-type-label-md-font-family: "InterVariable", "Inter", ui-sans-serif, system-ui, sans-serif;
113
+ --fs-type-label-md-font-weight: 500;
114
+ --fs-type-label-md-font-size: 0.875rem;
115
+ --fs-type-label-md-line-height: 1.25rem;
116
+ --fs-type-label-md-letter-spacing: 0em;
117
+ --fs-type-label-sm-font-family: "InterVariable", "Inter", ui-sans-serif, system-ui, sans-serif;
118
+ --fs-type-label-sm-font-weight: 500;
119
+ --fs-type-label-sm-font-size: 0.75rem;
120
+ --fs-type-label-sm-line-height: 1rem;
121
+ --fs-type-label-sm-letter-spacing: 0.01em;
122
+ --fs-type-caption-font-family: "InterVariable", "Inter", ui-sans-serif, system-ui, sans-serif;
123
+ --fs-type-caption-font-weight: 400;
124
+ --fs-type-caption-font-size: 0.75rem;
125
+ --fs-type-caption-line-height: 1rem;
126
+ --fs-type-caption-letter-spacing: 0em;
127
+ --fs-layout-page-gutter: 1rem;
128
+ --fs-layout-panel-padding: 1rem;
129
+ --fs-layout-section-gap: 2rem;
130
+ --fs-layout-marketing-gap: 3rem;
131
+ --fs-control-visible-dense: 2rem;
132
+ --fs-control-visible-default: 2.75rem;
133
+ --fs-control-visible-touch: 2.75rem;
134
+ --fs-control-visible-prominent: 3rem;
135
+ --fs-control-target-pointer: 2rem;
136
+ --fs-control-target-touch: 2.75rem;
137
+ --fs-focus-width: 2px;
138
+ --fs-focus-offset: 2px;
139
+ --fs-font-family-sans: "InterVariable", "Inter", ui-sans-serif, system-ui, sans-serif;
140
+ --fs-radius-sm: 0.25rem;
141
+ --fs-radius-md: 0.5rem;
142
+ --fs-radius-lg: 0.75rem;
143
+ --fs-radius-xl: 1rem;
144
+ --fs-radius-full: 9999px;
145
+ --fs-border-width: 1px;
146
+ --fs-shadow-subtle: 0px 1px 2px 0px oklch(0% 0 none / 0.08);
147
+ --fs-shadow-raised: 0px 4px 12px -2px oklch(0% 0 none / 0.1), 0px 2px 4px -1px oklch(0% 0 none / 0.06);
148
+ --fs-opacity-disabled: 0.48;
149
+ --fs-icon-size-sm: 1rem;
150
+ --fs-icon-size-md: 1.25rem;
151
+ --fs-icon-size-lg: 1.5rem;
152
+ --fs-icon-stroke-optical: 1.75;
153
+ --fs-icon-stroke-default: 2;
154
+ --fs-motion-duration-fast: 120ms;
155
+ --fs-motion-duration-normal: 180ms;
156
+ --fs-motion-duration-slow: 240ms;
157
+ --fs-motion-easing-standard: cubic-bezier(0.2, 0, 0, 1);
158
+ --fs-motion-easing-exit: cubic-bezier(0.4, 0, 1, 1);
159
+ }
160
+
161
+ [data-fs-theme="light"] {
162
+ --fs-color-canvas: oklch(100% 0 none);
163
+ --fs-color-surface: oklch(100% 0 none);
164
+ --fs-color-surface-subtle: oklch(98.5% 0 none);
165
+ --fs-color-surface-raised: oklch(100% 0 none);
166
+ --fs-color-surface-inverse: oklch(20.5% 0 none);
167
+ --fs-color-surface-scrim: oklch(0% 0 none / 0.56);
168
+ --fs-color-content-primary: oklch(14.5% 0 none);
169
+ --fs-color-content-secondary: oklch(37.1% 0 none);
170
+ --fs-color-content-tertiary: oklch(43.9% 0 none);
171
+ --fs-color-content-disabled: oklch(55.6% 0 none);
172
+ --fs-color-content-inverse: oklch(100% 0 none);
173
+ --fs-color-content-link: oklch(45.7% 0.24 277.023);
174
+ --fs-color-border-subtle: oklch(92.2% 0 none);
175
+ --fs-color-border: oklch(87% 0 none);
176
+ --fs-color-border-strong: oklch(55.6% 0 none);
177
+ --fs-color-border-interactive: oklch(51.1% 0.262 276.966);
178
+ --fs-color-focus-ring: oklch(58.5% 0.233 277.117);
179
+ --fs-color-action-primary: oklch(51.1% 0.262 276.966);
180
+ --fs-color-action-primary-hover: oklch(45.7% 0.24 277.023);
181
+ --fs-color-action-primary-pressed: oklch(39.8% 0.195 277.366);
182
+ --fs-color-action-primary-content: oklch(100% 0 none);
183
+ --fs-color-action-secondary: oklch(100% 0 none);
184
+ --fs-color-action-secondary-hover: oklch(98.5% 0 none);
185
+ --fs-color-action-secondary-pressed: oklch(97% 0 none);
186
+ --fs-color-action-secondary-content: oklch(20.5% 0 none);
187
+ --fs-color-action-secondary-border: oklch(55.6% 0 none);
188
+ --fs-color-action-ghost-hover: oklch(97% 0 none);
189
+ --fs-color-action-ghost-pressed: oklch(92.2% 0 none);
190
+ --fs-color-action-ghost-content: oklch(20.5% 0 none);
191
+ --fs-color-action-destructive: oklch(50.5% 0.213 27.518);
192
+ --fs-color-action-destructive-hover: oklch(44.4% 0.177 26.899);
193
+ --fs-color-action-destructive-pressed: oklch(39.6% 0.141 25.723);
194
+ --fs-color-action-destructive-content: oklch(100% 0 none);
195
+ --fs-color-disabled-surface: oklch(97% 0 none);
196
+ --fs-color-disabled-content: oklch(55.6% 0 none);
197
+ --fs-color-disabled-border: oklch(92.2% 0 none);
198
+ --fs-color-status-success-solid: oklch(43.2% 0.095 166.913);
199
+ --fs-color-status-success-on-solid: oklch(100% 0 none);
200
+ --fs-color-status-success-soft: oklch(97.9% 0.021 166.113);
201
+ --fs-color-status-success-content: oklch(37.8% 0.077 168.94);
202
+ --fs-color-status-success-border: oklch(43.2% 0.095 166.913);
203
+ --fs-color-status-warning-solid: oklch(47.3% 0.137 46.201);
204
+ --fs-color-status-warning-on-solid: oklch(100% 0 none);
205
+ --fs-color-status-warning-soft: oklch(98.7% 0.022 95.277);
206
+ --fs-color-status-warning-content: oklch(41.4% 0.112 45.904);
207
+ --fs-color-status-warning-border: oklch(47.3% 0.137 46.201);
208
+ --fs-color-status-error-solid: oklch(50.5% 0.213 27.518);
209
+ --fs-color-status-error-on-solid: oklch(100% 0 none);
210
+ --fs-color-status-error-soft: oklch(97.1% 0.013 17.38);
211
+ --fs-color-status-error-content: oklch(39.6% 0.141 25.723);
212
+ --fs-color-status-error-border: oklch(50.5% 0.213 27.518);
213
+ --fs-color-status-info-solid: oklch(48.8% 0.243 264.376);
214
+ --fs-color-status-info-on-solid: oklch(100% 0 none);
215
+ --fs-color-status-info-soft: oklch(97% 0.014 254.604);
216
+ --fs-color-status-info-content: oklch(37.9% 0.146 265.522);
217
+ --fs-color-status-info-border: oklch(48.8% 0.243 264.376);
218
+ --fs-color-brand-solid: oklch(51.1% 0.262 276.966);
219
+ --fs-color-brand-on-solid: oklch(100% 0 none);
220
+ --fs-color-brand-soft: oklch(87% 0.065 274.039);
221
+ --fs-color-brand-on-soft: oklch(14.5% 0 none);
222
+ --fs-color-brand-border: oklch(58.5% 0.233 277.117);
223
+ }
224
+
225
+ [data-fs-theme="dark"] {
226
+ --fs-color-canvas: oklch(14.5% 0 none);
227
+ --fs-color-surface: oklch(20.5% 0 none);
228
+ --fs-color-surface-subtle: oklch(14.5% 0 none);
229
+ --fs-color-surface-raised: oklch(26.9% 0 none);
230
+ --fs-color-surface-inverse: oklch(97% 0 none);
231
+ --fs-color-surface-scrim: oklch(0% 0 none / 0.56);
232
+ --fs-color-content-primary: oklch(98.5% 0 none);
233
+ --fs-color-content-secondary: oklch(87% 0 none);
234
+ --fs-color-content-tertiary: oklch(70.8% 0 none);
235
+ --fs-color-content-disabled: oklch(70.8% 0 none);
236
+ --fs-color-content-inverse: oklch(14.5% 0 none);
237
+ --fs-color-content-link: oklch(78.5% 0.115 274.713);
238
+ --fs-color-border-subtle: oklch(26.9% 0 none);
239
+ --fs-color-border: oklch(37.1% 0 none);
240
+ --fs-color-border-strong: oklch(55.6% 0 none);
241
+ --fs-color-border-interactive: oklch(67.3% 0.182 276.935);
242
+ --fs-color-focus-ring: oklch(67.3% 0.182 276.935);
243
+ --fs-color-action-primary: oklch(67.3% 0.182 276.935);
244
+ --fs-color-action-primary-hover: oklch(78.5% 0.115 274.713);
245
+ --fs-color-action-primary-pressed: oklch(87% 0.065 274.039);
246
+ --fs-color-action-primary-content: oklch(14.5% 0 none);
247
+ --fs-color-action-secondary: oklch(20.5% 0 none);
248
+ --fs-color-action-secondary-hover: oklch(26.9% 0 none);
249
+ --fs-color-action-secondary-pressed: oklch(37.1% 0 none);
250
+ --fs-color-action-secondary-content: oklch(98.5% 0 none);
251
+ --fs-color-action-secondary-border: oklch(70.8% 0 none);
252
+ --fs-color-action-ghost-hover: oklch(26.9% 0 none);
253
+ --fs-color-action-ghost-pressed: oklch(37.1% 0 none);
254
+ --fs-color-action-ghost-content: oklch(98.5% 0 none);
255
+ --fs-color-action-destructive: oklch(70.4% 0.191 22.216);
256
+ --fs-color-action-destructive-hover: oklch(80.8% 0.114 19.571);
257
+ --fs-color-action-destructive-pressed: oklch(88.5% 0.062 18.334);
258
+ --fs-color-action-destructive-content: oklch(14.5% 0 none);
259
+ --fs-color-disabled-surface: oklch(26.9% 0 none);
260
+ --fs-color-disabled-content: oklch(55.6% 0 none);
261
+ --fs-color-disabled-border: oklch(37.1% 0 none);
262
+ --fs-color-status-success-solid: oklch(76.5% 0.177 163.223);
263
+ --fs-color-status-success-on-solid: oklch(14.5% 0 none);
264
+ --fs-color-status-success-soft: oklch(26.2% 0.051 172.552);
265
+ --fs-color-status-success-content: oklch(90.5% 0.093 164.15);
266
+ --fs-color-status-success-border: oklch(76.5% 0.177 163.223);
267
+ --fs-color-status-warning-solid: oklch(87.9% 0.169 91.605);
268
+ --fs-color-status-warning-on-solid: oklch(14.5% 0 none);
269
+ --fs-color-status-warning-soft: oklch(27.9% 0.077 45.635);
270
+ --fs-color-status-warning-content: oklch(92.4% 0.12 95.746);
271
+ --fs-color-status-warning-border: oklch(87.9% 0.169 91.605);
272
+ --fs-color-status-error-solid: oklch(70.4% 0.191 22.216);
273
+ --fs-color-status-error-on-solid: oklch(14.5% 0 none);
274
+ --fs-color-status-error-soft: oklch(25.8% 0.092 26.042);
275
+ --fs-color-status-error-content: oklch(88.5% 0.062 18.334);
276
+ --fs-color-status-error-border: oklch(70.4% 0.191 22.216);
277
+ --fs-color-status-info-solid: oklch(70.7% 0.165 254.624);
278
+ --fs-color-status-info-on-solid: oklch(14.5% 0 none);
279
+ --fs-color-status-info-soft: oklch(28.2% 0.091 267.935);
280
+ --fs-color-status-info-content: oklch(88.2% 0.059 254.128);
281
+ --fs-color-status-info-border: oklch(70.7% 0.165 254.624);
282
+ --fs-color-brand-solid: oklch(67.3% 0.182 276.935);
283
+ --fs-color-brand-on-solid: oklch(14.5% 0 none);
284
+ --fs-color-brand-soft: oklch(39.8% 0.195 277.366);
285
+ --fs-color-brand-on-soft: oklch(98.5% 0 none);
286
+ --fs-color-brand-border: oklch(67.3% 0.182 276.935);
287
+ }
288
+
289
+ @media (min-width: 48rem) {
290
+ :root {
291
+ --fs-type-display-lg-font-size: 3rem;
292
+ --fs-type-display-lg-line-height: 3.5rem;
293
+ --fs-type-display-md-font-size: 2.25rem;
294
+ --fs-type-display-md-line-height: 2.75rem;
295
+ --fs-type-heading-lg-font-size: 1.875rem;
296
+ --fs-type-heading-lg-line-height: 2.25rem;
297
+ --fs-type-heading-md-font-size: 1.5rem;
298
+ --fs-type-heading-md-line-height: 2rem;
299
+ --fs-layout-page-gutter: 1.5rem;
300
+ --fs-layout-panel-padding: 1.25rem;
301
+ --fs-layout-section-gap: 3rem;
302
+ --fs-layout-marketing-gap: 4rem;
303
+ --fs-control-visible-default: 2.5rem;
304
+ }
305
+ }
306
+
307
+ @media (min-width: 64rem) {
308
+ :root {
309
+ --fs-layout-page-gutter: 2rem;
310
+ --fs-layout-panel-padding: 1.5rem;
311
+ --fs-layout-section-gap: 4rem;
312
+ --fs-layout-marketing-gap: 5rem;
313
+ }
314
+ }
315
+
316
+ @media (prefers-reduced-motion: reduce) {
317
+ :root {
318
+ --fs-motion-duration-fast: 0ms;
319
+ --fs-motion-duration-normal: 0ms;
320
+ --fs-motion-duration-slow: 0ms;
321
+ }
322
+ }
323
+
324
+ .fs-button {
325
+ --fs-button-background: var(--fs-color-action-primary);
326
+ --fs-button-background-hover: var(--fs-color-action-primary-hover);
327
+ --fs-button-background-pressed: var(--fs-color-action-primary-pressed);
328
+ --fs-button-border: transparent;
329
+ --fs-button-content: var(--fs-color-action-primary-content);
330
+ --fs-button-gap: 0.5rem;
331
+ --fs-button-height: var(--fs-control-visible-default);
332
+ --fs-button-icon-size: var(--fs-icon-size-md);
333
+ --fs-button-padding-inline: 1rem;
334
+
335
+ position: relative;
336
+ display: inline-flex;
337
+ min-inline-size: 0;
338
+ max-inline-size: 100%;
339
+ min-block-size: var(--fs-button-height);
340
+ box-sizing: border-box;
341
+ flex: 0 1 auto;
342
+ align-items: center;
343
+ justify-content: center;
344
+ gap: var(--fs-button-gap);
345
+ padding: 0 var(--fs-button-padding-inline);
346
+ border: var(--fs-border-width) solid var(--fs-button-border);
347
+ border-radius: var(--fs-radius-md);
348
+ color: var(--fs-button-content);
349
+ background: var(--fs-button-background);
350
+ box-shadow: var(--fs-shadow-subtle);
351
+ font-family: var(--fs-type-label-md-font-family);
352
+ font-size: var(--fs-type-label-md-font-size);
353
+ font-weight: var(--fs-type-label-md-font-weight);
354
+ letter-spacing: var(--fs-type-label-md-letter-spacing);
355
+ line-height: var(--fs-type-label-md-line-height);
356
+ text-align: center;
357
+ text-decoration: none;
358
+ white-space: normal;
359
+ appearance: none;
360
+ cursor: pointer;
361
+ touch-action: manipulation;
362
+ user-select: none;
363
+ transition:
364
+ color var(--fs-motion-duration-fast) var(--fs-motion-easing-standard),
365
+ background-color var(--fs-motion-duration-fast) var(--fs-motion-easing-standard),
366
+ border-color var(--fs-motion-duration-fast) var(--fs-motion-easing-standard),
367
+ box-shadow var(--fs-motion-duration-fast) var(--fs-motion-easing-standard),
368
+ transform var(--fs-motion-duration-fast) var(--fs-motion-easing-standard);
369
+ }
370
+
371
+ .fs-button:hover:not(:disabled) {
372
+ background: var(--fs-button-background-hover);
373
+ }
374
+
375
+ .fs-button:active:not(:disabled) {
376
+ background: var(--fs-button-background-pressed);
377
+ box-shadow: none;
378
+ transform: translateY(1px);
379
+ }
380
+
381
+ .fs-button:focus-visible {
382
+ outline: var(--fs-focus-width) solid var(--fs-color-focus-ring);
383
+ outline-offset: var(--fs-focus-offset);
384
+ }
385
+
386
+ .fs-button:disabled {
387
+ border-color: var(--fs-color-disabled-border);
388
+ color: var(--fs-color-disabled-content);
389
+ background: var(--fs-color-disabled-surface);
390
+ box-shadow: none;
391
+ cursor: not-allowed;
392
+ }
393
+
394
+ .fs-button[data-fs-variant="secondary"] {
395
+ --fs-button-background: var(--fs-color-action-secondary);
396
+ --fs-button-background-hover: var(--fs-color-action-secondary-hover);
397
+ --fs-button-background-pressed: var(--fs-color-action-secondary-pressed);
398
+ --fs-button-border: var(--fs-color-action-secondary-border);
399
+ --fs-button-content: var(--fs-color-action-secondary-content);
400
+ }
401
+
402
+ .fs-button[data-fs-variant="ghost"] {
403
+ --fs-button-background: transparent;
404
+ --fs-button-background-hover: var(--fs-color-action-ghost-hover);
405
+ --fs-button-background-pressed: var(--fs-color-action-ghost-pressed);
406
+ --fs-button-content: var(--fs-color-action-ghost-content);
407
+
408
+ box-shadow: none;
409
+ }
410
+
411
+ .fs-button[data-fs-variant="destructive"] {
412
+ --fs-button-background: var(--fs-color-action-destructive);
413
+ --fs-button-background-hover: var(--fs-color-action-destructive-hover);
414
+ --fs-button-background-pressed: var(--fs-color-action-destructive-pressed);
415
+ --fs-button-content: var(--fs-color-action-destructive-content);
416
+ }
417
+
418
+ .fs-button[data-fs-size="sm"] {
419
+ --fs-button-gap: 0.375rem;
420
+ --fs-button-height: var(--fs-control-visible-dense);
421
+ --fs-button-icon-size: var(--fs-icon-size-sm);
422
+ --fs-button-padding-inline: 0.75rem;
423
+
424
+ font-family: var(--fs-type-label-sm-font-family);
425
+ font-size: var(--fs-type-label-sm-font-size);
426
+ font-weight: var(--fs-type-label-sm-font-weight);
427
+ letter-spacing: var(--fs-type-label-sm-letter-spacing);
428
+ line-height: var(--fs-type-label-sm-line-height);
429
+ }
430
+
431
+ .fs-button[data-fs-size="lg"] {
432
+ --fs-button-height: var(--fs-control-visible-prominent);
433
+ --fs-button-icon-size: var(--fs-icon-size-lg);
434
+ --fs-button-padding-inline: 1.25rem;
435
+ }
436
+
437
+ .fs-button[data-fs-icon-only="true"] {
438
+ inline-size: var(--fs-button-height);
439
+ flex: 0 0 auto;
440
+ padding: 0;
441
+ }
442
+
443
+ .fs-button[data-fs-icon-only="true"]::after {
444
+ position: absolute;
445
+ content: "";
446
+ }
447
+
448
+ .fs-button__content {
449
+ display: inline-flex;
450
+ min-inline-size: 0;
451
+ align-items: center;
452
+ justify-content: center;
453
+ gap: var(--fs-button-gap);
454
+ }
455
+
456
+ .fs-button__label {
457
+ min-inline-size: 0;
458
+ overflow-wrap: anywhere;
459
+ }
460
+
461
+ .fs-button__loading-indicator {
462
+ position: absolute;
463
+ inset-block: 0;
464
+ inset-inline-start: 0;
465
+ display: inline-flex;
466
+ inline-size: var(--fs-button-padding-inline);
467
+ align-items: center;
468
+ justify-content: center;
469
+ pointer-events: none;
470
+ }
471
+
472
+ .fs-button__loading-indicator .fs-button__spinner {
473
+ inline-size: min(var(--fs-button-icon-size), var(--fs-button-padding-inline));
474
+ block-size: min(var(--fs-button-icon-size), var(--fs-button-padding-inline));
475
+ }
476
+
477
+ .fs-button__icon,
478
+ .fs-button__spinner {
479
+ inline-size: var(--fs-button-icon-size);
480
+ block-size: var(--fs-button-icon-size);
481
+ flex: 0 0 var(--fs-button-icon-size);
482
+ stroke-width: var(--fs-icon-stroke-default);
483
+ }
484
+
485
+ .fs-button__spinner {
486
+ fill: none;
487
+ stroke: currentColor;
488
+ stroke-linecap: round;
489
+ animation: fs-button-spin var(--fs-motion-duration-slow) linear infinite;
490
+ }
491
+
492
+ @keyframes fs-button-spin {
493
+ to {
494
+ transform: rotate(360deg);
495
+ }
496
+ }
497
+
498
+ @media (min-width: 48rem) {
499
+ .fs-button[data-fs-size="md"] {
500
+ --fs-button-height: var(--fs-control-visible-default);
501
+ }
502
+ }
503
+
504
+ @media (pointer: coarse) {
505
+ .fs-button[data-fs-icon-only="true"][data-fs-size="sm"]::after {
506
+ inset-block-start: 50%;
507
+ inset-inline-start: 50%;
508
+ inline-size: var(--fs-control-target-touch);
509
+ block-size: var(--fs-control-target-touch);
510
+ transform: translate(-50%, -50%);
511
+ }
512
+ }
513
+
514
+ @media (prefers-reduced-motion: reduce) {
515
+ .fs-button__spinner {
516
+ animation-duration: var(--fs-motion-duration-slow);
517
+ }
518
+ }
package/dist/tailwind-theme.css ADDED
@@ -0,0 +1,122 @@
1
+ /* @generated by scripts/tokens/build.mjs; dataset 1.0.1; source-sha256 15d6333e284ffa92b707f3bc034208848c9e35409b5f8179552ab48814ad6002 */
2
+ @theme inline {
3
+ --color-fs-canvas: var(--fs-color-canvas);
4
+ --color-fs-surface: var(--fs-color-surface);
5
+ --color-fs-surface-subtle: var(--fs-color-surface-subtle);
6
+ --color-fs-surface-raised: var(--fs-color-surface-raised);
7
+ --color-fs-surface-inverse: var(--fs-color-surface-inverse);
8
+ --color-fs-surface-scrim: var(--fs-color-surface-scrim);
9
+ --color-fs-content-primary: var(--fs-color-content-primary);
10
+ --color-fs-content-secondary: var(--fs-color-content-secondary);
11
+ --color-fs-content-tertiary: var(--fs-color-content-tertiary);
12
+ --color-fs-content-disabled: var(--fs-color-content-disabled);
13
+ --color-fs-content-inverse: var(--fs-color-content-inverse);
14
+ --color-fs-content-link: var(--fs-color-content-link);
15
+ --color-fs-border-subtle: var(--fs-color-border-subtle);
16
+ --color-fs-border: var(--fs-color-border);
17
+ --color-fs-border-strong: var(--fs-color-border-strong);
18
+ --color-fs-border-interactive: var(--fs-color-border-interactive);
19
+ --color-fs-focus-ring: var(--fs-color-focus-ring);
20
+ --color-fs-action-primary: var(--fs-color-action-primary);
21
+ --color-fs-action-primary-hover: var(--fs-color-action-primary-hover);
22
+ --color-fs-action-primary-pressed: var(--fs-color-action-primary-pressed);
23
+ --color-fs-action-primary-content: var(--fs-color-action-primary-content);
24
+ --color-fs-action-secondary: var(--fs-color-action-secondary);
25
+ --color-fs-action-secondary-hover: var(--fs-color-action-secondary-hover);
26
+ --color-fs-action-secondary-pressed: var(--fs-color-action-secondary-pressed);
27
+ --color-fs-action-secondary-content: var(--fs-color-action-secondary-content);
28
+ --color-fs-action-secondary-border: var(--fs-color-action-secondary-border);
29
+ --color-fs-action-ghost-hover: var(--fs-color-action-ghost-hover);
30
+ --color-fs-action-ghost-pressed: var(--fs-color-action-ghost-pressed);
31
+ --color-fs-action-ghost-content: var(--fs-color-action-ghost-content);
32
+ --color-fs-action-destructive: var(--fs-color-action-destructive);
33
+ --color-fs-action-destructive-hover: var(--fs-color-action-destructive-hover);
34
+ --color-fs-action-destructive-pressed: var(--fs-color-action-destructive-pressed);
35
+ --color-fs-action-destructive-content: var(--fs-color-action-destructive-content);
36
+ --color-fs-disabled-surface: var(--fs-color-disabled-surface);
37
+ --color-fs-disabled-content: var(--fs-color-disabled-content);
38
+ --color-fs-disabled-border: var(--fs-color-disabled-border);
39
+ --color-fs-status-success-solid: var(--fs-color-status-success-solid);
40
+ --color-fs-status-success-on-solid: var(--fs-color-status-success-on-solid);
41
+ --color-fs-status-success-soft: var(--fs-color-status-success-soft);
42
+ --color-fs-status-success-content: var(--fs-color-status-success-content);
43
+ --color-fs-status-success-border: var(--fs-color-status-success-border);
44
+ --color-fs-status-warning-solid: var(--fs-color-status-warning-solid);
45
+ --color-fs-status-warning-on-solid: var(--fs-color-status-warning-on-solid);
46
+ --color-fs-status-warning-soft: var(--fs-color-status-warning-soft);
47
+ --color-fs-status-warning-content: var(--fs-color-status-warning-content);
48
+ --color-fs-status-warning-border: var(--fs-color-status-warning-border);
49
+ --color-fs-status-error-solid: var(--fs-color-status-error-solid);
50
+ --color-fs-status-error-on-solid: var(--fs-color-status-error-on-solid);
51
+ --color-fs-status-error-soft: var(--fs-color-status-error-soft);
52
+ --color-fs-status-error-content: var(--fs-color-status-error-content);
53
+ --color-fs-status-error-border: var(--fs-color-status-error-border);
54
+ --color-fs-status-info-solid: var(--fs-color-status-info-solid);
55
+ --color-fs-status-info-on-solid: var(--fs-color-status-info-on-solid);
56
+ --color-fs-status-info-soft: var(--fs-color-status-info-soft);
57
+ --color-fs-status-info-content: var(--fs-color-status-info-content);
58
+ --color-fs-status-info-border: var(--fs-color-status-info-border);
59
+ --color-fs-brand-solid: var(--fs-color-brand-solid);
60
+ --color-fs-brand-on-solid: var(--fs-color-brand-on-solid);
61
+ --color-fs-brand-soft: var(--fs-color-brand-soft);
62
+ --color-fs-brand-on-soft: var(--fs-color-brand-on-soft);
63
+ --color-fs-brand-border: var(--fs-color-brand-border);
64
+ --font-fs-sans: var(--fs-font-family-sans);
65
+ --text-fs-display-lg: var(--fs-type-display-lg-font-size);
66
+ --text-fs-display-lg--line-height: var(--fs-type-display-lg-line-height);
67
+ --text-fs-display-lg--letter-spacing: var(--fs-type-display-lg-letter-spacing);
68
+ --text-fs-display-lg--font-weight: var(--fs-type-display-lg-font-weight);
69
+ --text-fs-display-md: var(--fs-type-display-md-font-size);
70
+ --text-fs-display-md--line-height: var(--fs-type-display-md-line-height);
71
+ --text-fs-display-md--letter-spacing: var(--fs-type-display-md-letter-spacing);
72
+ --text-fs-display-md--font-weight: var(--fs-type-display-md-font-weight);
73
+ --text-fs-heading-lg: var(--fs-type-heading-lg-font-size);
74
+ --text-fs-heading-lg--line-height: var(--fs-type-heading-lg-line-height);
75
+ --text-fs-heading-lg--letter-spacing: var(--fs-type-heading-lg-letter-spacing);
76
+ --text-fs-heading-lg--font-weight: var(--fs-type-heading-lg-font-weight);
77
+ --text-fs-heading-md: var(--fs-type-heading-md-font-size);
78
+ --text-fs-heading-md--line-height: var(--fs-type-heading-md-line-height);
79
+ --text-fs-heading-md--letter-spacing: var(--fs-type-heading-md-letter-spacing);
80
+ --text-fs-heading-md--font-weight: var(--fs-type-heading-md-font-weight);
81
+ --text-fs-heading-sm: var(--fs-type-heading-sm-font-size);
82
+ --text-fs-heading-sm--line-height: var(--fs-type-heading-sm-line-height);
83
+ --text-fs-heading-sm--letter-spacing: var(--fs-type-heading-sm-letter-spacing);
84
+ --text-fs-heading-sm--font-weight: var(--fs-type-heading-sm-font-weight);
85
+ --text-fs-body-lg: var(--fs-type-body-lg-font-size);
86
+ --text-fs-body-lg--line-height: var(--fs-type-body-lg-line-height);
87
+ --text-fs-body-lg--letter-spacing: var(--fs-type-body-lg-letter-spacing);
88
+ --text-fs-body-lg--font-weight: var(--fs-type-body-lg-font-weight);
89
+ --text-fs-body-md: var(--fs-type-body-md-font-size);
90
+ --text-fs-body-md--line-height: var(--fs-type-body-md-line-height);
91
+ --text-fs-body-md--letter-spacing: var(--fs-type-body-md-letter-spacing);
92
+ --text-fs-body-md--font-weight: var(--fs-type-body-md-font-weight);
93
+ --text-fs-body-sm: var(--fs-type-body-sm-font-size);
94
+ --text-fs-body-sm--line-height: var(--fs-type-body-sm-line-height);
95
+ --text-fs-body-sm--letter-spacing: var(--fs-type-body-sm-letter-spacing);
96
+ --text-fs-body-sm--font-weight: var(--fs-type-body-sm-font-weight);
97
+ --text-fs-label-md: var(--fs-type-label-md-font-size);
98
+ --text-fs-label-md--line-height: var(--fs-type-label-md-line-height);
99
+ --text-fs-label-md--letter-spacing: var(--fs-type-label-md-letter-spacing);
100
+ --text-fs-label-md--font-weight: var(--fs-type-label-md-font-weight);
101
+ --text-fs-label-sm: var(--fs-type-label-sm-font-size);
102
+ --text-fs-label-sm--line-height: var(--fs-type-label-sm-line-height);
103
+ --text-fs-label-sm--letter-spacing: var(--fs-type-label-sm-letter-spacing);
104
+ --text-fs-label-sm--font-weight: var(--fs-type-label-sm-font-weight);
105
+ --text-fs-caption: var(--fs-type-caption-font-size);
106
+ --text-fs-caption--line-height: var(--fs-type-caption-line-height);
107
+ --text-fs-caption--letter-spacing: var(--fs-type-caption-letter-spacing);
108
+ --text-fs-caption--font-weight: var(--fs-type-caption-font-weight);
109
+ --spacing-fs-page-gutter: var(--fs-layout-page-gutter);
110
+ --spacing-fs-panel-padding: var(--fs-layout-panel-padding);
111
+ --spacing-fs-section-gap: var(--fs-layout-section-gap);
112
+ --spacing-fs-control-default: var(--fs-control-visible-default);
113
+ --spacing-fs-target-touch: var(--fs-control-target-touch);
114
+ --radius-fs-sm: var(--fs-radius-sm);
115
+ --radius-fs-md: var(--fs-radius-md);
116
+ --radius-fs-lg: var(--fs-radius-lg);
117
+ --radius-fs-xl: var(--fs-radius-xl);
118
+ --radius-fs-full: var(--fs-radius-full);
119
+ --shadow-fs-subtle: var(--fs-shadow-subtle);
120
+ --shadow-fs-raised: var(--fs-shadow-raised);
121
+ --ease-fs-standard: var(--fs-motion-easing-standard);
122
+ }
package/package.json ADDED
@@ -0,0 +1,60 @@
1
+ {
2
+ "name": "@fastyshop/ui",
3
+ "version": "0.1.0",
4
+ "license": "MIT",
5
+ "repository": {
6
+ "type": "git",
7
+ "url": "git+https://github.com/rubyhat/fastyshop-ui.git",
8
+ "directory": "packages/ui"
9
+ },
10
+ "publishConfig": {
11
+ "access": "public",
12
+ "registry": "https://registry.npmjs.org/"
13
+ },
14
+ "type": "module",
15
+ "engines": {
16
+ "node": ">=24.18.0 <25"
17
+ },
18
+ "types": "./dist/index.d.ts",
19
+ "exports": {
20
+ ".": {
21
+ "types": "./dist/index.d.ts",
22
+ "import": "./dist/index.js"
23
+ },
24
+ "./styles.css": "./dist/styles.css",
25
+ "./tailwind-theme.css": "./dist/tailwind-theme.css"
26
+ },
27
+ "files": [
28
+ "dist",
29
+ "README.md",
30
+ "CHANGELOG.md",
31
+ "LICENSE",
32
+ "THIRD_PARTY_NOTICES.md"
33
+ ],
34
+ "sideEffects": [
35
+ "./dist/styles.css",
36
+ "./dist/tailwind-theme.css"
37
+ ],
38
+ "peerDependencies": {
39
+ "react": ">=19.2.0 <20",
40
+ "react-dom": ">=19.2.0 <20"
41
+ },
42
+ "devDependencies": {
43
+ "@types/react": "19.2.18",
44
+ "@types/react-dom": "19.2.5",
45
+ "react": "19.2.8",
46
+ "react-dom": "19.2.8"
47
+ },
48
+ "dependencies": {
49
+ "@base-ui/react": "1.7.0"
50
+ },
51
+ "scripts": {
52
+ "clean": "node --eval \"import('node:fs').then(({ rmSync }) => rmSync('dist', { recursive: true, force: true }))\"",
53
+ "build:js": "tsc -p tsconfig.build.json",
54
+ "build:css": "node ./scripts/copy-assets.mjs",
55
+ "build": "pnpm clean && pnpm build:js && pnpm build:css",
56
+ "typecheck": "tsc -p tsconfig.json --noEmit",
57
+ "verify:font": "node ./scripts/verify-font.mjs && node --test ./scripts/tests/*.test.mjs",
58
+ "verify": "pnpm verify:font && node ./scripts/verify-package.mjs && tsc -p ./scripts/tsconfig.json"
59
+ }
60
+ }