beacon-ui 3.4.0 → 3.4.2
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.
- package/CHANGELOG.md +17 -1
- package/dist/components/Button.d.ts +2 -1
- package/dist/components/Button.d.ts.map +1 -1
- package/dist/components/Button.js +4 -4
- package/dist/components/Card.d.ts.map +1 -1
- package/dist/components/Card.js +2 -4
- package/dist/components/Menu.js +9 -9
- package/dist/components/MenuItem.d.ts.map +1 -1
- package/dist/components/MenuItem.js +12 -3
- package/dist/tokens/types.d.ts +2 -2
- package/dist/tokens/types.d.ts.map +1 -1
- package/package.json +1 -1
- package/tokens/generated/brand-dark.css +1 -1
- package/tokens/generated/brand-light.css +1 -1
- package/tokens/generated/index.css +7 -6
- package/tokens/generated/primitives.css +1 -1
- package/tokens/generated/semantic.css +1 -0
- package/tokens/generated/typography.css +3 -3
package/CHANGELOG.md
CHANGED
|
@@ -5,7 +5,23 @@ All notable changes to this project will be documented in this file.
|
|
|
5
5
|
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
|
|
6
6
|
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
|
|
7
7
|
|
|
8
|
-
## [3.4.
|
|
8
|
+
## [3.4.2] - 2026-01-03
|
|
9
|
+
|
|
10
|
+
### Added
|
|
11
|
+
- Added `underline` prop to Button component for link variant to control text decoration
|
|
12
|
+
|
|
13
|
+
## [3.4.1] - 2026-01-03
|
|
14
|
+
|
|
15
|
+
### Changed
|
|
16
|
+
- Refactored inline CSS styles in changelog, how-to-use, and releases pages to use design system token variables and CSS utility classes
|
|
17
|
+
- Added CSS utility classes for common content patterns: `.ds-content__grid`, `.ds-content__card`, `.ds-content__flex`, `.ds-content__flex-wrap`, `.ds-content__version-badge`, `.ds-content__entry`, `.ds-content__code-container`, `.ds-content__code-wrapper`
|
|
18
|
+
|
|
19
|
+
### Fixed
|
|
20
|
+
- Fixed copy button vertical alignment in code blocks for install package sections
|
|
21
|
+
- Fixed button outline appearing momentarily on click - outline now only appears for keyboard navigation, not mouse clicks
|
|
22
|
+
- Improved consistency of styling across documentation pages by replacing inline styles with design system classes
|
|
23
|
+
|
|
24
|
+
## [3.4.0] - 2026-01-02
|
|
9
25
|
|
|
10
26
|
### Added
|
|
11
27
|
- Button Icon component for icon-only button interactions with support for all button variants, sizes, and states
|
|
@@ -17,7 +17,8 @@ export interface ButtonProps extends Omit<ComponentPropsWithRef<"button">, "type
|
|
|
17
17
|
state?: ButtonState;
|
|
18
18
|
color?: ButtonColor;
|
|
19
19
|
type?: "button" | "submit" | "reset";
|
|
20
|
+
underline?: boolean;
|
|
20
21
|
children: React.ReactNode;
|
|
21
22
|
}
|
|
22
|
-
export declare function Button({ variant, size, cornerRadius, startIcon, endIcon, fillContainer, justifyContent, loading, disabled, state: stateProp, color, type, children, className, style, onClick, onMouseEnter, onMouseLeave, onFocus, onBlur, onMouseDown, onMouseUp, ref, ...rest }: ButtonProps): import("react/jsx-runtime").JSX.Element;
|
|
23
|
+
export declare function Button({ variant, size, cornerRadius, startIcon, endIcon, fillContainer, justifyContent, loading, disabled, state: stateProp, color, type, underline, children, className, style, onClick, onMouseEnter, onMouseLeave, onFocus, onBlur, onMouseDown, onMouseUp, ref, ...rest }: ButtonProps): import("react/jsx-runtime").JSX.Element;
|
|
23
24
|
//# sourceMappingURL=Button.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/components/Button.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAkC,qBAAqB,EAAgC,MAAM,OAAO,CAAC;AAI5G,MAAM,MAAM,aAAa,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,CAAC;AACpE,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAC1D,MAAM,MAAM,gBAAgB,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;AACrD,MAAM,MAAM,cAAc,GAAG,QAAQ,GAAG,eAAe,CAAC;AACxD,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,CAAC;AACxE,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,SAAS,GAAG,UAAU,GAAG,SAAS,CAAC;AAEzE,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,qBAAqB,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAChF,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,YAAY,CAAC,EAAE,gBAAgB,CAAC;IAChC,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IACrC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAkED,wBAAgB,MAAM,CAAC,EACrB,OAAkB,EAClB,IAAW,EACX,YAAgB,EAChB,SAAS,EACT,OAAO,EACP,aAAqB,EACrB,cAAyB,EACzB,OAAe,EACf,QAAgB,EAChB,KAAK,EAAE,SAAS,EAChB,KAAiB,EACjB,IAAe,EACf,QAAQ,EACR,SAAS,EACT,KAAK,EACL,OAAO,EACP,YAAY,EACZ,YAAY,EACZ,OAAO,EACP,MAAM,EACN,WAAW,EACX,SAAS,EACT,GAAG,EACH,GAAG,IAAI,EACR,EAAE,WAAW,2CAsSb"}
|
|
1
|
+
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/components/Button.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAkC,qBAAqB,EAAgC,MAAM,OAAO,CAAC;AAI5G,MAAM,MAAM,aAAa,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,CAAC;AACpE,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAC1D,MAAM,MAAM,gBAAgB,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;AACrD,MAAM,MAAM,cAAc,GAAG,QAAQ,GAAG,eAAe,CAAC;AACxD,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,CAAC;AACxE,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,SAAS,GAAG,UAAU,GAAG,SAAS,CAAC;AAEzE,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,qBAAqB,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAChF,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,YAAY,CAAC,EAAE,gBAAgB,CAAC;IAChC,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IACrC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAkED,wBAAgB,MAAM,CAAC,EACrB,OAAkB,EAClB,IAAW,EACX,YAAgB,EAChB,SAAS,EACT,OAAO,EACP,aAAqB,EACrB,cAAyB,EACzB,OAAe,EACf,QAAgB,EAChB,KAAK,EAAE,SAAS,EAChB,KAAiB,EACjB,IAAe,EACf,SAAS,EACT,QAAQ,EACR,SAAS,EACT,KAAK,EACL,OAAO,EACP,YAAY,EACZ,YAAY,EACZ,OAAO,EACP,MAAM,EACN,WAAW,EACX,SAAS,EACT,GAAG,EACH,GAAG,IAAI,EACR,EAAE,WAAW,2CAsSb"}
|
|
@@ -55,7 +55,7 @@ const LOADER_ICON_SIZE_MAP = {
|
|
|
55
55
|
lg: 32,
|
|
56
56
|
xl: 40,
|
|
57
57
|
};
|
|
58
|
-
export function Button({ variant = "filled", size = "md", cornerRadius = 2, startIcon, endIcon, fillContainer = false, justifyContent = "center", loading = false, disabled = false, state: stateProp, color = "primary", type = "button", children, className, style, onClick, onMouseEnter, onMouseLeave, onFocus, onBlur, onMouseDown, onMouseUp, ref, ...rest }) {
|
|
58
|
+
export function Button({ variant = "filled", size = "md", cornerRadius = 2, startIcon, endIcon, fillContainer = false, justifyContent = "center", loading = false, disabled = false, state: stateProp, color = "primary", type = "button", underline, children, className, style, onClick, onMouseEnter, onMouseLeave, onFocus, onBlur, onMouseDown, onMouseUp, ref, ...rest }) {
|
|
59
59
|
const themeContext = useThemeSafe();
|
|
60
60
|
const sizeConfig = SIZE_CONFIG[size];
|
|
61
61
|
const borderRadius = CORNER_RADIUS_MAP[cornerRadius];
|
|
@@ -171,8 +171,8 @@ export function Button({ variant = "filled", size = "md", cornerRadius = 2, star
|
|
|
171
171
|
borderWidth: 0,
|
|
172
172
|
borderStyle: "none",
|
|
173
173
|
borderColor: "transparent",
|
|
174
|
-
textDecoration: "underline",
|
|
175
|
-
textUnderlineOffset: "2px",
|
|
174
|
+
textDecoration: underline !== false ? "underline" : "none",
|
|
175
|
+
textUnderlineOffset: underline !== false ? "2px" : undefined,
|
|
176
176
|
};
|
|
177
177
|
break;
|
|
178
178
|
}
|
|
@@ -234,7 +234,7 @@ export function Button({ variant = "filled", size = "md", cornerRadius = 2, star
|
|
|
234
234
|
stateStyles.outlineOffset = "2px";
|
|
235
235
|
}
|
|
236
236
|
return { ...baseStyles, ...variantStyles, ...stateStyles, ...style };
|
|
237
|
-
}, [variant, sizeConfig, borderRadius, fillContainer, justifyContent, currentState, isDisabled, isLoading, color, style]);
|
|
237
|
+
}, [variant, sizeConfig, borderRadius, fillContainer, justifyContent, currentState, isDisabled, isLoading, color, underline, style]);
|
|
238
238
|
// Clone icons with the correct size based on button size
|
|
239
239
|
const iconSize = sizeConfig.iconSize;
|
|
240
240
|
const clonedStartIcon = startIcon && isValidElement(startIcon)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../src/components/Card.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,qBAAqB,EAAE,MAAM,OAAO,CAAC;AAG9C,OAAO,EAAoB,KAAK,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAC3E,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAEjD,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,aAAa,GAAG,UAAU,CAAC;AAChE,MAAM,MAAM,UAAU,GAAG,GAAG,GAAG,IAAI,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC;AAW5E,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,qBAAqB,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IAC3E,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,YAAY,CAAC,EAAE,gBAAgB,CAAC;IAChC,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAoBD,wBAAgB,IAAI,CAAC,EACnB,OAAa,EACb,MAAM,EACN,MAAkB,EAClB,MAAM,EACN,YAAgB,EAChB,aAAqB,EACrB,WAAqB,EACrB,WAAmB,EACnB,UAAiB,EACjB,QAAQ,EACR,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,IAAI,EACR,EAAE,SAAS,
|
|
1
|
+
{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../src/components/Card.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,qBAAqB,EAAE,MAAM,OAAO,CAAC;AAG9C,OAAO,EAAoB,KAAK,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAC3E,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAEjD,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,aAAa,GAAG,UAAU,CAAC;AAChE,MAAM,MAAM,UAAU,GAAG,GAAG,GAAG,IAAI,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC;AAW5E,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,qBAAqB,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IAC3E,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,YAAY,CAAC,EAAE,gBAAgB,CAAC;IAChC,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAoBD,wBAAgB,IAAI,CAAC,EACnB,OAAa,EACb,MAAM,EACN,MAAkB,EAClB,MAAM,EACN,YAAgB,EAChB,aAAqB,EACrB,WAAqB,EACrB,WAAmB,EACnB,UAAiB,EACjB,QAAQ,EACR,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,IAAI,EACR,EAAE,SAAS,2CAwGX"}
|
package/dist/components/Card.js
CHANGED
|
@@ -45,7 +45,7 @@ export function Card({ padding = 400, height, status = "default", shadow, corner
|
|
|
45
45
|
padding: getSpacingToken(padding),
|
|
46
46
|
borderRadius: CORNER_RADIUS_MAP[cornerRadius],
|
|
47
47
|
position: "relative",
|
|
48
|
-
backgroundColor:
|
|
48
|
+
backgroundColor: "var(--bg-page-primary)",
|
|
49
49
|
...(heightValue && { height: heightValue }),
|
|
50
50
|
...(shadow && { boxShadow: getShadowToken(shadow) }),
|
|
51
51
|
...style,
|
|
@@ -58,9 +58,7 @@ export function Card({ padding = 400, height, status = "default", shadow, corner
|
|
|
58
58
|
cardStyles.border = "var(--border-width-25) solid var(--border-strong-200)";
|
|
59
59
|
}
|
|
60
60
|
}
|
|
61
|
-
const overlayGradient =
|
|
62
|
-
? "var(--bg-page-secondary)"
|
|
63
|
-
: "var(--bg-page-primary)";
|
|
61
|
+
const overlayGradient = "var(--bg-page-primary)";
|
|
64
62
|
// Build background layers using CSS multiple backgrounds
|
|
65
63
|
// CSS backgrounds stack: first listed = top layer, last listed = bottom layer
|
|
66
64
|
// We want: overlay (middle) first, pattern (bottom) last
|
package/dist/components/Menu.js
CHANGED
|
@@ -41,11 +41,11 @@ export function Menu({ variant = "desktop", showMenu = true, showButton = true,
|
|
|
41
41
|
const baseStyles = {
|
|
42
42
|
display: "flex",
|
|
43
43
|
flexDirection: "column",
|
|
44
|
-
backgroundColor: "var(--bg-page-
|
|
45
|
-
borderTop: "var(--border-width-25) solid var(--border-
|
|
46
|
-
borderRight: "var(--border-width-25) solid var(--border-
|
|
47
|
-
borderBottom: "var(--border-width-25) solid var(--border-
|
|
48
|
-
borderLeft: "var(--border-width-25) solid var(--border-
|
|
44
|
+
backgroundColor: "var(--bg-page-base)",
|
|
45
|
+
borderTop: "var(--border-width-25) solid var(--border-strong-100)",
|
|
46
|
+
borderRight: "var(--border-width-25) solid var(--border-strong-100)",
|
|
47
|
+
borderBottom: "var(--border-width-25) solid var(--border-strong-100)",
|
|
48
|
+
borderLeft: "var(--border-width-25) solid var(--border-strong-100)",
|
|
49
49
|
position: "relative",
|
|
50
50
|
};
|
|
51
51
|
if (variant === "desktop") {
|
|
@@ -56,7 +56,7 @@ export function Menu({ variant = "desktop", showMenu = true, showButton = true,
|
|
|
56
56
|
borderLeft: "none",
|
|
57
57
|
borderTop: "none",
|
|
58
58
|
borderBottom: "none",
|
|
59
|
-
borderRight: "var(--border-width-25) solid var(--border-
|
|
59
|
+
borderRight: "var(--border-width-25) solid var(--border-strong-100)",
|
|
60
60
|
padding: "var(--spacing-500) var(--spacing-400)",
|
|
61
61
|
gap: "var(--spacing-none)",
|
|
62
62
|
};
|
|
@@ -67,7 +67,7 @@ export function Menu({ variant = "desktop", showMenu = true, showButton = true,
|
|
|
67
67
|
width: "430px",
|
|
68
68
|
borderTop: "none",
|
|
69
69
|
borderRight: "none",
|
|
70
|
-
borderBottom: "var(--border-width-25) solid var(--border-
|
|
70
|
+
borderBottom: "var(--border-width-25) solid var(--border-strong-100)",
|
|
71
71
|
borderLeft: "none",
|
|
72
72
|
padding: variant === "tablet-open" ? "var(--spacing-200) var(--spacing-400)" : "8px 0",
|
|
73
73
|
gap: "var(--spacing-none)",
|
|
@@ -79,7 +79,7 @@ export function Menu({ variant = "desktop", showMenu = true, showButton = true,
|
|
|
79
79
|
width: "400px",
|
|
80
80
|
borderTop: "none",
|
|
81
81
|
borderRight: "none",
|
|
82
|
-
borderBottom: "var(--border-width-25) solid var(--border-
|
|
82
|
+
borderBottom: "var(--border-width-25) solid var(--border-strong-100)",
|
|
83
83
|
borderLeft: "none",
|
|
84
84
|
padding: variant === "mobile-open" ? "var(--spacing-200) var(--spacing-400)" : "var(--spacing-200) var(--spacing-none)",
|
|
85
85
|
gap: "var(--spacing-none)",
|
|
@@ -91,7 +91,7 @@ export function Menu({ variant = "desktop", showMenu = true, showButton = true,
|
|
|
91
91
|
width: "100%",
|
|
92
92
|
borderTop: "none",
|
|
93
93
|
borderRight: "none",
|
|
94
|
-
borderBottom: "var(--border-width-25) solid var(--border-
|
|
94
|
+
borderBottom: "var(--border-width-25) solid var(--border-strong-100)",
|
|
95
95
|
borderLeft: "none",
|
|
96
96
|
padding: "var(--spacing-200) var(--spacing-400)",
|
|
97
97
|
alignItems: "flex-end",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuItem.d.ts","sourceRoot":"","sources":["../../src/components/MenuItem.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGzD,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,UAAU,CAAC;AAE1E,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,qBAAqB,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrF,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,SAAS,GAAG,IAAI,CAAC;IAC9B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,SAAS,GAAG,IAAI,CAAC;IAC5B,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,wBAAgB,QAAQ,CAAC,EACvB,SAAuB,EACvB,SAAgB,EAChB,UAAiB,EACjB,OAAc,EACd,QAAe,EACf,KAAiB,EACjB,OAAO,EACP,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EAAE,aAAa,
|
|
1
|
+
{"version":3,"file":"MenuItem.d.ts","sourceRoot":"","sources":["../../src/components/MenuItem.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGzD,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,UAAU,CAAC;AAE1E,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,qBAAqB,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrF,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,SAAS,GAAG,IAAI,CAAC;IAC9B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,SAAS,GAAG,IAAI,CAAC;IAC5B,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,wBAAgB,QAAQ,CAAC,EACvB,SAAuB,EACvB,SAAgB,EAChB,UAAiB,EACjB,OAAc,EACd,QAAe,EACf,KAAiB,EACjB,OAAO,EACP,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EAAE,aAAa,2CA0If"}
|
|
@@ -10,10 +10,10 @@ export function MenuItem({ menuTitle = "Menu Item", iconStart = true, iconStart1
|
|
|
10
10
|
const backgroundColor = isActive
|
|
11
11
|
? "var(--bg-primary-tonal)"
|
|
12
12
|
: isHovered
|
|
13
|
-
? "var(--bg-page-
|
|
13
|
+
? "var(--bg-page-primary)"
|
|
14
14
|
: isDisabled
|
|
15
|
-
? "var(--bg-page-
|
|
16
|
-
: "var(--bg-page-
|
|
15
|
+
? "var(--bg-page-base)"
|
|
16
|
+
: "var(--bg-page-base)";
|
|
17
17
|
// Text colors based on state
|
|
18
18
|
const textColor = isActive
|
|
19
19
|
? "var(--fg-primary-on-tonal)"
|
|
@@ -48,9 +48,18 @@ export function MenuItem({ menuTitle = "Menu Item", iconStart = true, iconStart1
|
|
|
48
48
|
borderRadius: "var(--corner-radius-200)",
|
|
49
49
|
width: "100%",
|
|
50
50
|
backgroundColor,
|
|
51
|
+
background: backgroundColor,
|
|
51
52
|
border: borderStyle,
|
|
52
53
|
cursor: isDisabled ? "not-allowed" : onClick ? "pointer" : "default",
|
|
53
54
|
transition: "background-color 0.2s ease, border-color 0.2s ease",
|
|
55
|
+
appearance: "none",
|
|
56
|
+
WebkitAppearance: "none",
|
|
57
|
+
MozAppearance: "none",
|
|
58
|
+
outline: "none",
|
|
59
|
+
fontFamily: "inherit",
|
|
60
|
+
fontSize: "inherit",
|
|
61
|
+
lineHeight: "inherit",
|
|
62
|
+
textAlign: "left",
|
|
54
63
|
...style,
|
|
55
64
|
};
|
|
56
65
|
return (_jsxs("button", { type: "button", className: className, style: containerStyles, onClick: isDisabled ? undefined : onClick, disabled: isDisabled, ...rest, children: [iconStart && (_jsx("div", { style: {
|
package/dist/tokens/types.d.ts
CHANGED
|
@@ -4,9 +4,9 @@
|
|
|
4
4
|
*/
|
|
5
5
|
export type ColorPrimitive = "Color.Purple.100" | "Color.Purple.200" | "Color.Purple.300" | "Color.Purple.400" | "Color.Purple.500" | "Color.Purple.600" | "Color.Purple.700" | "Color.Purple.800" | "Color.Purple.900" | "Color.Blue.100" | "Color.Blue.200" | "Color.Blue.300" | "Color.Blue.400" | "Color.Blue.500" | "Color.Blue.600" | "Color.Blue.700" | "Color.Blue.800" | "Color.Blue.900" | "Color.Chromatic.100" | "Color.Chromatic.200" | "Color.Chromatic.300" | "Color.Chromatic.400" | "Color.Chromatic.500" | "Color.Chromatic.600" | "Color.Chromatic.700" | "Color.Chromatic.800" | "Color.Chromatic.900" | "Color.Gray.50" | "Color.Gray.100" | "Color.Gray.200" | "Color.Gray.300" | "Color.Gray.400" | "Color.Gray.500" | "Color.Gray.600" | "Color.Gray.700" | "Color.Gray.800" | "Color.Gray.900" | "Color.Green.100" | "Color.Green.200" | "Color.Green.300" | "Color.Green.400" | "Color.Green.500" | "Color.Green.600" | "Color.Green.700" | "Color.Green.800" | "Color.Red.100" | "Color.Red.200" | "Color.Red.300" | "Color.Red.400" | "Color.Red.500" | "Color.Red.600" | "Color.Red.700" | "Color.Red.800" | "Color.Orange.100" | "Color.Orange.200" | "Color.Orange.300" | "Color.Orange.400" | "Color.Orange.500" | "Color.Orange.600" | "Color.Orange.700" | "Color.Orange.800" | "Color.Black.0" | "Color.Black.100" | "Color.Black.200" | "Color.Black.300" | "Color.Black.400" | "Color.Black.500" | "Color.Black.600" | "Color.Black.700" | "Color.Black.800" | "Color.Black.1000" | "Color.White.0" | "Color.White.100" | "Color.White.200" | "Color.White.300" | "Color.White.400" | "Color.White.500" | "Color.White.600" | "Color.White.700" | "Color.White.800" | "Color.White.1000";
|
|
6
6
|
export type ScaleToken = "Scale.0" | "Scale.25" | "Scale.50" | "Scale.100" | "Scale.150" | "Scale.200" | "Scale.300" | "Scale.400" | "Scale.450" | "Scale.500" | "Scale.550" | "Scale.600" | "Scale.650" | "Scale.700" | "Scale.800" | "Scale.900" | "Scale.1000" | "Scale.2000";
|
|
7
|
-
export type SemanticColor = "Color.Primary.100" | "Color.Primary.200" | "Color.Primary.300" | "Color.Primary.400" | "Color.Primary.500" | "Color.Primary.600" | "Color.Primary.700" | "Color.Primary.800" | "Color.Primary.900" | "Color.Neutral.50" | "Color.Neutral.100" | "Color.Neutral.200" | "Color.Neutral.300" | "Color.Neutral.400" | "Color.Neutral.500" | "Color.Neutral.600" | "Color.Neutral.700" | "Color.Neutral.800" | "Color.Neutral.White" | "Color.Neutral.Black" | "Color.Success.100" | "Color.Success.200" | "Color.Success.300" | "Color.Success.400" | "Color.Success.500" | "Color.Success.600" | "Color.Success.700" | "Color.Success.800" | "Color.Warning.100" | "Color.Warning.200" | "Color.Warning.300" | "Color.Warning.400" | "Color.Warning.500" | "Color.Warning.600" | "Color.Warning.700" | "Color.Warning.800" | "Color.Critical.100" | "Color.Critical.200" | "Color.Critical.300" | "Color.Critical.400" | "Color.Critical.500" | "Color.Critical.600" | "Color.Critical.700" | "Color.Critical.800" | "Color.Alpha-Neutral.White-0" | "Color.Alpha-Neutral.White-100" | "Color.Alpha-Neutral.White-200" | "Color.Alpha-Neutral.White-300" | "Color.Alpha-Neutral.White-400" | "Color.Alpha-Neutral.White-500" | "Color.Alpha-Neutral.White-600" | "Color.Alpha-Neutral.White-700" | "Color.Alpha-Neutral.White-800" | "Color.Alpha-Neutral.White-1000" | "Color.Alpha-Neutral.Black-0" | "Color.Alpha-Neutral.Black-100" | "Color.Alpha-Neutral.Black-200" | "Color.Alpha-Neutral.Black-300" | "Color.Alpha-Neutral.Black-400" | "Color.Alpha-Neutral.Black-500" | "Color.Alpha-Neutral.Black-600" | "Color.Alpha-Neutral.Black-700" | "Color.Alpha-Neutral.Black-800" | "Color.Alpha-Neutral.Black-1000";
|
|
7
|
+
export type SemanticColor = "Color.Primary.100" | "Color.Primary.200" | "Color.Primary.300" | "Color.Primary.400" | "Color.Primary.500" | "Color.Primary.600" | "Color.Primary.700" | "Color.Primary.800" | "Color.Primary.900" | "Color.Neutral.50" | "Color.Neutral.100" | "Color.Neutral.200" | "Color.Neutral.300" | "Color.Neutral.400" | "Color.Neutral.500" | "Color.Neutral.600" | "Color.Neutral.700" | "Color.Neutral.800" | "Color.Neutral.900" | "Color.Neutral.White" | "Color.Neutral.Black" | "Color.Success.100" | "Color.Success.200" | "Color.Success.300" | "Color.Success.400" | "Color.Success.500" | "Color.Success.600" | "Color.Success.700" | "Color.Success.800" | "Color.Warning.100" | "Color.Warning.200" | "Color.Warning.300" | "Color.Warning.400" | "Color.Warning.500" | "Color.Warning.600" | "Color.Warning.700" | "Color.Warning.800" | "Color.Critical.100" | "Color.Critical.200" | "Color.Critical.300" | "Color.Critical.400" | "Color.Critical.500" | "Color.Critical.600" | "Color.Critical.700" | "Color.Critical.800" | "Color.Alpha-Neutral.White-0" | "Color.Alpha-Neutral.White-100" | "Color.Alpha-Neutral.White-200" | "Color.Alpha-Neutral.White-300" | "Color.Alpha-Neutral.White-400" | "Color.Alpha-Neutral.White-500" | "Color.Alpha-Neutral.White-600" | "Color.Alpha-Neutral.White-700" | "Color.Alpha-Neutral.White-800" | "Color.Alpha-Neutral.White-1000" | "Color.Alpha-Neutral.Black-0" | "Color.Alpha-Neutral.Black-100" | "Color.Alpha-Neutral.Black-200" | "Color.Alpha-Neutral.Black-300" | "Color.Alpha-Neutral.Black-400" | "Color.Alpha-Neutral.Black-500" | "Color.Alpha-Neutral.Black-600" | "Color.Alpha-Neutral.Black-700" | "Color.Alpha-Neutral.Black-800" | "Color.Alpha-Neutral.Black-1000";
|
|
8
8
|
export type SpacingToken = "Spacing.50" | "Spacing.100" | "Spacing.200" | "Spacing.300" | "Spacing.400" | "Spacing.450" | "Spacing.500" | "Spacing.600" | "Spacing.650" | "Spacing.700" | "Spacing.800" | "Spacing.900" | "Spacing.1000" | "Spacing.2000" | "Spacing.None";
|
|
9
|
-
export type BackgroundToken = "Background.
|
|
9
|
+
export type BackgroundToken = "Background.Page_Base" | "Background.Page_Primary" | "Background.Page_Secondary" | "Background.Page_Tertiary" | "Background.Disabled" | "Background.Primary" | "Background.Primary_Tonal" | "Background.Primary_Pressed" | "Background.Primary_Disabled" | "Background.Primary_Dark" | "Background.Primary-On_Hover" | "Background.Primary_Tonal-On_Hover" | "Background.Primary-On_Focused" | "Background.Success" | "Background.Success_Tonal" | "Background.Success_Dark" | "Background.Success_Disabled" | "Background.Success-On_Hover" | "Background.Warning" | "Background.Warning_Tonal" | "Background.Warning_Dark" | "Background.Warning_Disabled" | "Background.Warning-On_Hover" | "Background.Critical" | "Background.Critical_Tonal" | "Background.Critical_Dark" | "Background.Critical_Disabled" | "Background.Critical-On_Hover" | "Background.Transparent";
|
|
10
10
|
export type ForegroundToken = "Foreground.Neutral" | "Foreground.Neutral_Secondary" | "Foreground.Neutral_Tertiary" | "Foreground.Primary" | "Foreground.Primary_Disabled" | "Foreground.Primary_Pressed" | "Foreground.Primary_-_On_Tonal" | "Foreground.Primary-_On_Focus" | "Foreground.Primary-_On_Hover" | "Foreground.Critical" | "Foreground.Critical_Tonal" | "Foreground.Critical-_On_Tonal" | "Foreground.Warning" | "Foreground.Warning-_On_Tonal" | "Foreground.Success" | "Foreground.Success-_On_Tonal" | "Foreground.On_Action" | "Foreground.White" | "Foreground.Disabled" | "Foreground.On_Disabled";
|
|
11
11
|
export type BorderToken = "Border.Strong" | "Border.Strong-100" | "Border.Strong-200" | "Border.Neutral_Primary" | "Border.Neutral_Secondary" | "Border.Neutral_Tertiary" | "Border.Primary" | "Border.Primary_Tonal" | "Border.Primary_Disabled" | "Border.Primary-_On_Hover" | "Border.Primary_Pressed" | "Border.Critical" | "Border.Critical_Tonal" | "Border.Warning" | "Border.Warning_Tonal" | "Border.Success" | "Border.Success_Tonal" | "Border.On_Action" | "Border.White" | "Border.Disabled";
|
|
12
12
|
export type Theme = "light" | "dark";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/tokens/types.ts"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/tokens/types.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/* Brand tokens - dark theme */
|
|
2
2
|
[data-theme="dark"] {
|
|
3
|
-
--bg-
|
|
3
|
+
--bg-page-base: var(--color-neutral-900);
|
|
4
4
|
--bg-page-primary: var(--color-neutral-800);
|
|
5
5
|
--bg-page-secondary: var(--color-neutral-700);
|
|
6
6
|
--bg-page-tertiary: var(--color-neutral-600);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/* Brand tokens - light theme */
|
|
2
2
|
:root, [data-theme="light"] {
|
|
3
|
-
--bg-
|
|
3
|
+
--bg-page-base: var(--color-alpha-neutral-white-1000);
|
|
4
4
|
--bg-page-primary: var(--color-neutral-50);
|
|
5
5
|
--bg-page-secondary: var(--color-neutral-100);
|
|
6
6
|
--bg-page-tertiary: var(--color-neutral-200);
|
|
@@ -39,7 +39,7 @@
|
|
|
39
39
|
--color-gray-600: #3f3c3d;
|
|
40
40
|
--color-gray-700: #2a2728;
|
|
41
41
|
--color-gray-800: #1f1d1d;
|
|
42
|
-
--color-gray-900: #
|
|
42
|
+
--color-gray-900: #161616;
|
|
43
43
|
--color-green-100: #e0ffff;
|
|
44
44
|
--color-green-200: #9bfdfa;
|
|
45
45
|
--color-green-300: #69fcf7;
|
|
@@ -170,6 +170,7 @@
|
|
|
170
170
|
--color-neutral-600: var(--color-gray-600);
|
|
171
171
|
--color-neutral-700: var(--color-gray-700);
|
|
172
172
|
--color-neutral-800: var(--color-gray-800);
|
|
173
|
+
--color-neutral-900: var(--color-gray-900);
|
|
173
174
|
--color-neutral-white: var(--color-white-1000);
|
|
174
175
|
--color-neutral-black: var(--color-black-1000);
|
|
175
176
|
--color-success-100: var(--color-green-100);
|
|
@@ -257,7 +258,7 @@
|
|
|
257
258
|
|
|
258
259
|
/* Brand tokens - light theme */
|
|
259
260
|
:root, [data-theme="light"] {
|
|
260
|
-
--bg-
|
|
261
|
+
--bg-page-base: var(--color-alpha-neutral-white-1000);
|
|
261
262
|
--bg-page-primary: var(--color-neutral-50);
|
|
262
263
|
--bg-page-secondary: var(--color-neutral-100);
|
|
263
264
|
--bg-page-tertiary: var(--color-neutral-200);
|
|
@@ -344,7 +345,7 @@
|
|
|
344
345
|
|
|
345
346
|
/* Brand tokens - dark theme */
|
|
346
347
|
[data-theme="dark"] {
|
|
347
|
-
--bg-
|
|
348
|
+
--bg-page-base: var(--color-neutral-900);
|
|
348
349
|
--bg-page-primary: var(--color-neutral-800);
|
|
349
350
|
--bg-page-secondary: var(--color-neutral-700);
|
|
350
351
|
--bg-page-tertiary: var(--color-neutral-600);
|
|
@@ -700,13 +701,13 @@
|
|
|
700
701
|
/* Typography utility classes */
|
|
701
702
|
.text-title-small {
|
|
702
703
|
font-family: var(--font-secondary);
|
|
703
|
-
font-weight: var(--font-weight-secondary-
|
|
704
|
+
font-weight: var(--font-weight-secondary-medium);
|
|
704
705
|
font-size: var(--fonts-title-small-text-size);
|
|
705
706
|
line-height: var(--fonts-title-small-line-height);
|
|
706
707
|
}
|
|
707
708
|
.text-title-regular {
|
|
708
709
|
font-family: var(--font-secondary);
|
|
709
|
-
font-weight: var(--font-weight-secondary-
|
|
710
|
+
font-weight: var(--font-weight-secondary-medium);
|
|
710
711
|
font-size: var(--fonts-title-regular-text-size);
|
|
711
712
|
line-height: var(--fonts-title-regular-line-height);
|
|
712
713
|
}
|
|
@@ -747,7 +748,7 @@
|
|
|
747
748
|
}
|
|
748
749
|
.text-heading-h6 {
|
|
749
750
|
font-family: var(--font-secondary);
|
|
750
|
-
font-weight: var(--font-weight-secondary-
|
|
751
|
+
font-weight: var(--font-weight-secondary-semibold);
|
|
751
752
|
text-transform: capitalize;
|
|
752
753
|
font-size: var(--fonts-heading-h6-text-size);
|
|
753
754
|
line-height: var(--fonts-heading-h6-line-height);
|
|
@@ -50,6 +50,7 @@
|
|
|
50
50
|
--color-neutral-600: var(--color-gray-600);
|
|
51
51
|
--color-neutral-700: var(--color-gray-700);
|
|
52
52
|
--color-neutral-800: var(--color-gray-800);
|
|
53
|
+
--color-neutral-900: var(--color-gray-900);
|
|
53
54
|
--color-neutral-white: var(--color-white-1000);
|
|
54
55
|
--color-neutral-black: var(--color-black-1000);
|
|
55
56
|
--color-success-100: var(--color-green-100);
|
|
@@ -22,13 +22,13 @@
|
|
|
22
22
|
/* Typography utility classes */
|
|
23
23
|
.text-title-small {
|
|
24
24
|
font-family: var(--font-secondary);
|
|
25
|
-
font-weight: var(--font-weight-secondary-
|
|
25
|
+
font-weight: var(--font-weight-secondary-medium);
|
|
26
26
|
font-size: var(--fonts-title-small-text-size);
|
|
27
27
|
line-height: var(--fonts-title-small-line-height);
|
|
28
28
|
}
|
|
29
29
|
.text-title-regular {
|
|
30
30
|
font-family: var(--font-secondary);
|
|
31
|
-
font-weight: var(--font-weight-secondary-
|
|
31
|
+
font-weight: var(--font-weight-secondary-medium);
|
|
32
32
|
font-size: var(--fonts-title-regular-text-size);
|
|
33
33
|
line-height: var(--fonts-title-regular-line-height);
|
|
34
34
|
}
|
|
@@ -69,7 +69,7 @@
|
|
|
69
69
|
}
|
|
70
70
|
.text-heading-h6 {
|
|
71
71
|
font-family: var(--font-secondary);
|
|
72
|
-
font-weight: var(--font-weight-secondary-
|
|
72
|
+
font-weight: var(--font-weight-secondary-semibold);
|
|
73
73
|
text-transform: capitalize;
|
|
74
74
|
font-size: var(--fonts-heading-h6-text-size);
|
|
75
75
|
line-height: var(--fonts-heading-h6-line-height);
|