kang-components 0.4.0 → 0.6.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.
@@ -0,0 +1,51 @@
1
+ /**
2
+ * BackButton — a domain-free "go back" control.
3
+ *
4
+ * Ported from ymy-components (`./buttons/BackButton`), where it was a bare
5
+ * `<IoChevronBackOutline onClick={...} />` with no semantics, no press feedback
6
+ * and no theming. The kang port keeps the same public surface (`size`, `onClick`)
7
+ * but upgrades it into a real, accessible control following kang conventions:
8
+ *
9
+ * - Renders a semantic `<button type="button">` (was a bare SVG with a click
10
+ * handler) so it is keyboard-focusable and announced as a button.
11
+ * - Press feedback via the shared `pressPrimary()` CSS primitive — the same
12
+ * scale/bounce language every kang action button uses.
13
+ * - A Material `Ripple` overlay on press, themed off `theme.colors.ripple`.
14
+ * - Icon color reads `theme.colors.onSurface` (falls back to `currentColor`),
15
+ * so it adapts to a styled-components `ThemeProvider` but still works without
16
+ * one.
17
+ * - `disabled` support: blocks the click and dims the control.
18
+ *
19
+ * Icon: ymy hard-depended on `react-icons` (IoChevronBackOutline). To keep kang
20
+ * dependency-light and domain-free, the same chevron-back glyph ships as an
21
+ * inline SVG (identical Ionicons path data), and consumers may override it with
22
+ * any node via `icon` — the same pattern as BannerButton.
23
+ *
24
+ * `styled-components` and `react` are the only things this module pulls in;
25
+ * consumers importing the press/string primitives never touch them.
26
+ */
27
+ import { type ReactElement, type ReactNode } from 'react';
28
+ export type BackButtonProps = {
29
+ /** Icon size (any CSS size value). Defaults to `'1.5rem'` — matching ymy. */
30
+ size?: string;
31
+ /**
32
+ * Optional click handler, invoked on click/activation. If omitted the button
33
+ * is inert (renders, but does nothing on press).
34
+ */
35
+ onClick?: () => void;
36
+ /** Disable the control: blocks the handler and dims the icon. */
37
+ disabled?: boolean;
38
+ /** Accessible label for screen readers. Defaults to `'Back'`. */
39
+ ariaLabel?: string;
40
+ /** Optional class name passthrough for layout/positioning by the consumer. */
41
+ className?: string;
42
+ /**
43
+ * An explicit icon node, overriding the default inline chevron. Lets
44
+ * consumers supply their own glyph (e.g. a react-icons element) without kang
45
+ * depending on an icon library.
46
+ */
47
+ icon?: ReactNode;
48
+ };
49
+ declare const BackButton: ({ size, onClick, disabled, ariaLabel, className, icon, }: BackButtonProps) => ReactElement;
50
+ export default BackButton;
51
+ //# sourceMappingURL=back-button.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"back-button.d.ts","sourceRoot":"","sources":["../src/back-button.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AAEH,OAAO,EAAgC,KAAK,YAAY,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAKxF,MAAM,MAAM,eAAe,GAAG;IAC7B,6EAA6E;IAC7E,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,iEAAiE;IACjE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iEAAiE;IACjE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,8EAA8E;IAC9E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;CACjB,CAAC;AAoDF,QAAA,MAAM,UAAU,6DAOb,eAAe,KAAG,YAyBpB,CAAC;AAEF,eAAe,UAAU,CAAC"}
@@ -0,0 +1,70 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ /**
3
+ * BackButton — a domain-free "go back" control.
4
+ *
5
+ * Ported from ymy-components (`./buttons/BackButton`), where it was a bare
6
+ * `<IoChevronBackOutline onClick={...} />` with no semantics, no press feedback
7
+ * and no theming. The kang port keeps the same public surface (`size`, `onClick`)
8
+ * but upgrades it into a real, accessible control following kang conventions:
9
+ *
10
+ * - Renders a semantic `<button type="button">` (was a bare SVG with a click
11
+ * handler) so it is keyboard-focusable and announced as a button.
12
+ * - Press feedback via the shared `pressPrimary()` CSS primitive — the same
13
+ * scale/bounce language every kang action button uses.
14
+ * - A Material `Ripple` overlay on press, themed off `theme.colors.ripple`.
15
+ * - Icon color reads `theme.colors.onSurface` (falls back to `currentColor`),
16
+ * so it adapts to a styled-components `ThemeProvider` but still works without
17
+ * one.
18
+ * - `disabled` support: blocks the click and dims the control.
19
+ *
20
+ * Icon: ymy hard-depended on `react-icons` (IoChevronBackOutline). To keep kang
21
+ * dependency-light and domain-free, the same chevron-back glyph ships as an
22
+ * inline SVG (identical Ionicons path data), and consumers may override it with
23
+ * any node via `icon` — the same pattern as BannerButton.
24
+ *
25
+ * `styled-components` and `react` are the only things this module pulls in;
26
+ * consumers importing the press/string primitives never touch them.
27
+ */
28
+ import { useCallback } from 'react';
29
+ import { styled } from 'styled-components';
30
+ import { pressPrimary } from './press.js';
31
+ import { Ripple, useRipple } from './ripple.js';
32
+ /**
33
+ * Inline IoChevronBackOutline (react-icons/io5) — identical Ionicons path data
34
+ * (viewBox + stroke-width 48 outline chevron) so the glyph is unchanged.
35
+ */
36
+ const ChevronBackIcon = ({ size }) => (_jsx("svg", { stroke: "currentColor", fill: "currentColor", strokeWidth: "0", viewBox: "0 0 512 512", height: size, width: size, xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", children: _jsx("path", { fill: "none", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "48", d: "M328 112 184 256l144 144" }) }));
37
+ const StyledBackButton = styled.button `
38
+ position: relative;
39
+ overflow: hidden;
40
+ display: inline-flex;
41
+ align-items: center;
42
+ justify-content: center;
43
+ padding: 0;
44
+ margin: 0;
45
+ border: none;
46
+ background: transparent;
47
+ cursor: ${({ $disabled }) => ($disabled ? 'not-allowed' : 'pointer')};
48
+ color: ${({ theme }) => theme?.colors?.onSurface ?? 'currentColor'};
49
+ opacity: ${({ $disabled }) => ($disabled ? 0.4 : 1)};
50
+ line-height: 0;
51
+ -webkit-tap-highlight-color: transparent;
52
+
53
+ ${pressPrimary()}
54
+
55
+ &:disabled {
56
+ pointer-events: none;
57
+ }
58
+ `;
59
+ const BackButton = ({ size, onClick, disabled = false, ariaLabel = 'Back', className, icon, }) => {
60
+ const { ripple, trigger, isTarget } = useRipple();
61
+ const handleClick = useCallback((e) => {
62
+ if (disabled)
63
+ return;
64
+ trigger(e, 'back');
65
+ onClick?.();
66
+ }, [disabled, onClick, trigger]);
67
+ return (_jsxs(StyledBackButton, { type: "button", className: className, "$disabled": disabled, disabled: disabled, "aria-label": ariaLabel, onClick: handleClick, children: [icon !== undefined ? icon : _jsx(ChevronBackIcon, { size: size != null ? size : '1.5rem' }), isTarget('back') && ripple && _jsx(Ripple, { "$x": ripple.x, "$y": ripple.y }, ripple.key)] }));
68
+ };
69
+ export default BackButton;
70
+ //# sourceMappingURL=back-button.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"back-button.js","sourceRoot":"","sources":["../src/back-button.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AAEH,OAAO,EAAE,WAAW,EAAsD,MAAM,OAAO,CAAC;AACxF,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAC3C,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAC1C,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAwBhD;;;GAGG;AACH,MAAM,eAAe,GAAG,CAAC,EAAE,IAAI,EAAoB,EAAgB,EAAE,CAAC,CACrE,cACC,MAAM,EAAC,cAAc,EACrB,IAAI,EAAC,cAAc,EACnB,WAAW,EAAC,GAAG,EACf,OAAO,EAAC,aAAa,EACrB,MAAM,EAAE,IAAI,EACZ,KAAK,EAAE,IAAI,EACX,KAAK,EAAC,4BAA4B,iBACtB,MAAM,EAClB,SAAS,EAAC,OAAO,YAEjB,eACC,IAAI,EAAC,MAAM,EACX,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,EACtB,WAAW,EAAC,IAAI,EAChB,CAAC,EAAC,0BAA0B,GAC3B,GACG,CACN,CAAC;AAEF,MAAM,gBAAgB,GAAG,MAAM,CAAC,MAAM,CAAwB;;;;;;;;;;WAUnD,CAAC,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC;UAC3D,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CACrB,KAA6C,EAAE,MAAM,EAAE,SAAS,IAAI,cAAc;YACzE,CAAC,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;;;;GAIjD,YAAY,EAAE;;;;;CAKhB,CAAC;AAEF,MAAM,UAAU,GAAG,CAAC,EACnB,IAAI,EACJ,OAAO,EACP,QAAQ,GAAG,KAAK,EAChB,SAAS,GAAG,MAAM,EAClB,SAAS,EACT,IAAI,GACa,EAAgB,EAAE;IACnC,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAU,CAAC;IAE1D,MAAM,WAAW,GAAG,WAAW,CAC9B,CAAC,CAAgC,EAAE,EAAE;QACpC,IAAI,QAAQ;YAAE,OAAO;QACrB,OAAO,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC;QACnB,OAAO,EAAE,EAAE,CAAC;IACb,CAAC,EACD,CAAC,QAAQ,EAAE,OAAO,EAAE,OAAO,CAAC,CAC5B,CAAC;IAEF,OAAO,CACN,MAAC,gBAAgB,IAChB,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,SAAS,eACT,QAAQ,EACnB,QAAQ,EAAE,QAAQ,gBACN,SAAS,EACrB,OAAO,EAAE,WAAW,aAEnB,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAC,eAAe,IAAC,IAAI,EAAE,IAAI,IAAI,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,GAAI,EACrF,QAAQ,CAAC,MAAM,CAAC,IAAI,MAAM,IAAI,KAAC,MAAM,UAAsB,MAAM,CAAC,CAAC,QAAM,MAAM,CAAC,CAAC,IAAtC,MAAM,CAAC,GAAG,CAAgC,IACpE,CACnB,CAAC;AACH,CAAC,CAAC;AAEF,eAAe,UAAU,CAAC"}
@@ -0,0 +1,53 @@
1
+ /**
2
+ * BannerButton — a pill-shaped call-to-action button with a leading icon and
3
+ * cross-fading multilingual label.
4
+ *
5
+ * Ported from ymy-components (`./buttons/BannerButton`). The visual language is
6
+ * preserved (rounded pill, drop shadow, primary/secondary variants, a press
7
+ * "scale-down" feedback) but reconciled onto kang's conventions:
8
+ *
9
+ * - **Theme-driven colors** read off styled-components' `props.theme` (the same
10
+ * tokens {@link buildTheme} produces), with literal fallbacks so the button
11
+ * still renders without a `ThemeProvider`.
12
+ * - **Press feedback** uses kang's CSS-first {@link pressPrimary} primitive
13
+ * instead of a bespoke keyframe, keeping the press language consistent across
14
+ * the library.
15
+ * - **Label** delegates to kang's domain-free {@link AnimatedText}: the
16
+ * multilingual `buttonText` is mapped to `variants` (english ↔ preferred
17
+ * Chinese set) with all three strings reserved as sizers so the box never
18
+ * reflows mid-swap.
19
+ *
20
+ * Icons: ymy hard-depended on `react-icons` (FaPlus / FiSend). To keep kang
21
+ * dependency-light and domain-free, the same two glyphs ship as inline SVGs
22
+ * selectable via `iconComponent`, and consumers may pass any node via `icon`.
23
+ *
24
+ * `styled-components` and `react` are optional peer dependencies, pulled in only
25
+ * by this (and other runtime) modules.
26
+ */
27
+ import { type ReactNode } from 'react';
28
+ import type { CharacterPreference, DynamicLanguage } from './language.js';
29
+ export type BannerButtonProps = {
30
+ /**
31
+ * Which built-in icon to display. `'plus'` and `'send'` ship as inline SVGs.
32
+ * Ignored when an explicit `icon` node is provided.
33
+ */
34
+ iconComponent?: 'plus' | 'send';
35
+ /**
36
+ * An explicit icon node, overriding `iconComponent`. Lets consumers supply
37
+ * their own glyph (e.g. a react-icons element) without kang depending on an
38
+ * icon library.
39
+ */
40
+ icon?: ReactNode;
41
+ /** The button label, available in english / traditional / simplified. */
42
+ buttonText: DynamicLanguage;
43
+ /** Visual variant. Defaults to `'primary'`. */
44
+ buttonType?: 'primary' | 'secondary';
45
+ /** Click handler. */
46
+ onClick?: () => void;
47
+ /** Preferred Chinese character set for the label. Defaults to `'simplified'`. */
48
+ characterPreference?: CharacterPreference;
49
+ /** Whether the label cross-fades between english and Chinese. Defaults to true. */
50
+ animate?: boolean;
51
+ };
52
+ export default function BannerButton({ iconComponent, icon, buttonText, buttonType, onClick, characterPreference, animate, }: BannerButtonProps): import("react").JSX.Element;
53
+ //# sourceMappingURL=banner-button.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"banner-button.d.ts","sourceRoot":"","sources":["../src/banner-button.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AAEH,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAMvC,OAAO,KAAK,EAAE,mBAAmB,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAE1E,MAAM,MAAM,iBAAiB,GAAG;IAC/B;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAChC;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,yEAAyE;IACzE,UAAU,EAAE,eAAe,CAAC;IAC5B,+CAA+C;IAC/C,UAAU,CAAC,EAAE,SAAS,GAAG,WAAW,CAAC;IACrC,qBAAqB;IACrB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,iFAAiF;IACjF,mBAAmB,CAAC,EAAE,mBAAmB,CAAC;IAC1C,mFAAmF;IACnF,OAAO,CAAC,EAAE,OAAO,CAAC;CAClB,CAAC;AA+FF,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACpC,aAAa,EACb,IAAI,EACJ,UAAU,EACV,UAAsB,EACtB,OAAO,EACP,mBAAkC,EAClC,OAAc,GACd,EAAE,iBAAiB,+BAwBnB"}
@@ -0,0 +1,69 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ // Named imports (not the default) so this resolves consistently across bundler
3
+ // and raw ESM/CJS environments — see the note in ripple.ts.
4
+ import { styled } from 'styled-components';
5
+ import AnimatedText from './animated-text.js';
6
+ import { pressPrimary } from './press.js';
7
+ const BannerButtonContainer = styled.div `
8
+ display: inline-block;
9
+ position: relative;
10
+ overflow: hidden;
11
+ border-radius: 2.5rem;
12
+ background: ${({ theme }) => theme?.colors?.primary ?? '#489fb5'};
13
+ box-shadow: 0px 4px 4px 0px
14
+ ${({ theme }) => theme?.colors?.shadow ?? 'rgba(0, 0, 0, 0.25)'};
15
+
16
+ ${pressPrimary()}
17
+ `;
18
+ const StyledButton = styled.button `
19
+ display: flex;
20
+ align-items: center;
21
+ position: relative;
22
+ z-index: 10;
23
+ padding: 0.5rem 1rem;
24
+ border: none;
25
+ outline: none;
26
+ cursor: pointer;
27
+ transition: background-color 0.3s;
28
+
29
+ &.primary {
30
+ background-color: ${({ theme }) => theme?.colors?.primary ?? '#489fb5'};
31
+ color: ${({ theme }) => theme?.colors?.onPrimary ?? 'white'};
32
+ }
33
+
34
+ &.secondary {
35
+ background-color: ${({ theme }) => theme?.colors?.secondaryLight ?? '#ffb652'};
36
+ color: ${({ theme }) => theme?.colors?.onSecondary ?? 'black'};
37
+ }
38
+ `;
39
+ const IconContainer = styled.span `
40
+ display: flex;
41
+ margin-right: 1.25rem;
42
+
43
+ @media (min-width: 640px) {
44
+ margin-right: 0.25rem;
45
+ }
46
+ `;
47
+ /** Inline FaPlus (react-icons/fa) — kept identical so the glyph is unchanged. */
48
+ const PlusIcon = () => (_jsx("svg", { stroke: "currentColor", fill: "currentColor", strokeWidth: "0", viewBox: "0 0 448 512", height: "1em", width: "1em", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", children: _jsx("path", { d: "M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z" }) }));
49
+ /** Inline FiSend (react-icons/fi) — kept identical so the glyph is unchanged. */
50
+ const SendIcon = () => (_jsxs("svg", { stroke: "currentColor", fill: "none", strokeWidth: "2", viewBox: "0 0 24 24", strokeLinecap: "round", strokeLinejoin: "round", height: "1em", width: "1em", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", children: [_jsx("line", { x1: "22", y1: "2", x2: "11", y2: "13" }), _jsx("polygon", { points: "22 2 15 22 11 13 2 9 22 2" })] }));
51
+ function resolveIcon(icon, iconComponent) {
52
+ if (icon !== undefined)
53
+ return icon;
54
+ if (iconComponent === 'plus')
55
+ return _jsx(PlusIcon, {});
56
+ if (iconComponent === 'send')
57
+ return _jsx(SendIcon, {});
58
+ return null;
59
+ }
60
+ export default function BannerButton({ iconComponent, icon, buttonText, buttonType = 'primary', onClick, characterPreference = 'simplified', animate = true, }) {
61
+ const iconElement = resolveIcon(icon, iconComponent);
62
+ // Map the multilingual label onto AnimatedText's domain-free variant model:
63
+ // cycle english <-> the preferred Chinese set, static index 0 = english
64
+ // (matching ymy's default). All three strings are reserved as sizers so the
65
+ // box is always sized to the widest and never reflows mid-swap.
66
+ const chineseText = characterPreference === 'traditional' ? buttonText.traditional : buttonText.simplified;
67
+ return (_jsx(BannerButtonContainer, { onClick: onClick, children: _jsxs(StyledButton, { type: "button", className: buttonType, children: [iconElement !== null && _jsx(IconContainer, { children: iconElement }), _jsx(AnimatedText, { textStyles: { lineHeight: '0.8rem', minWidth: '3rem' }, variants: [buttonText.english, chineseText], sizers: [buttonText.english, buttonText.simplified, buttonText.traditional], staticIndex: 0, animate: animate })] }) }));
68
+ }
69
+ //# sourceMappingURL=banner-button.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"banner-button.js","sourceRoot":"","sources":["../src/banner-button.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,52 @@
1
+ /**
2
+ * CircleIconButton — a round, themed icon button with a spring entry animation.
3
+ *
4
+ * Ported faithfully from ymy-components (`./buttons/CircleIconButton`). It renders
5
+ * one of a small set of built-in icons (`person`, `qr`) inside a circular outlined
6
+ * button that scales/fades in on mount via react-spring, and fires `onClick` when
7
+ * pressed. The two xunzi sites that consume it (HeroBanner, ProfileButton) drive it
8
+ * purely through the `iconComponent` string + `onClick`, so that API is preserved
9
+ * 1:1 to keep the re-point a pure import swap.
10
+ *
11
+ * Theming: the border reads `theme.colors.onPrimary` and the icon reads
12
+ * `theme.colors.onSurface` off styled-components' `props.theme`, with literal
13
+ * fallbacks so it renders sensibly with or without a `ThemeProvider`.
14
+ *
15
+ * Press feedback: layered on top of ymy's behavior using kang's `pressPrimary`
16
+ * (the icon-button tier). The entry animation owns `transform` via react-spring,
17
+ * so press uses the CSS `scale` property (`pressPrimaryScale`) to avoid fighting it.
18
+ *
19
+ * Icons: ymy hard-depended on `react-icons` (BsPerson / BsQrCodeScan). To keep
20
+ * kang dependency-light and domain-free, the same two glyphs ship as inline SVGs
21
+ * (matching Bootstrap-icons path data) selectable via `iconComponent`, and
22
+ * consumers may pass any node via `icon` — the same pattern as BannerButton.
23
+ *
24
+ * `styled-components` and `@react-spring/web` are optional peer dependencies, used
25
+ * only by this module — consumers importing just the string primitives never pull
26
+ * them in.
27
+ */
28
+ import { type ReactElement, type ReactNode } from 'react';
29
+ /** The built-in icon set this button can render. */
30
+ export type CircleIconName = 'person' | 'qr';
31
+ export type CircleIconButtonProps = {
32
+ /**
33
+ * Which built-in icon to render. Ignored when an explicit `icon` node is
34
+ * provided.
35
+ * - `'person'` — person icon (profile).
36
+ * - `'qr'` — QR-code scan icon (invite/friend).
37
+ */
38
+ iconComponent: CircleIconName;
39
+ /**
40
+ * An explicit icon node, overriding `iconComponent`. Lets consumers supply
41
+ * their own glyph (e.g. a react-icons element) without kang depending on an
42
+ * icon library — the same override pattern as BannerButton.
43
+ */
44
+ icon?: ReactNode;
45
+ /**
46
+ * Optional click handler, invoked when the button is pressed. If omitted the
47
+ * button still renders and is interactive but performs no action.
48
+ */
49
+ onClick?: () => void;
50
+ };
51
+ export default function CircleIconButton({ iconComponent, icon, onClick, }: CircleIconButtonProps): ReactElement;
52
+ //# sourceMappingURL=circle-icon-button.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"circle-icon-button.d.ts","sourceRoot":"","sources":["../src/circle-icon-button.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AAEH,OAAO,EAAE,KAAK,YAAY,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAO1D,oDAAoD;AACpD,MAAM,MAAM,cAAc,GAAG,QAAQ,GAAG,IAAI,CAAC;AAE7C,MAAM,MAAM,qBAAqB,GAAG;IACnC;;;;;OAKG;IACH,aAAa,EAAE,cAAc,CAAC;IAE9B;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAyEF,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACxC,aAAa,EACb,IAAI,EACJ,OAAO,GACP,EAAE,qBAAqB,GAAG,YAAY,CAqBtC"}
@@ -0,0 +1,51 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { animated, useSpring } from '@react-spring/web';
3
+ // Named import (not the default) so styled-components resolves consistently
4
+ // across bundler and raw ESM/CJS environments — matches ripple.ts.
5
+ import { styled } from 'styled-components';
6
+ import { pressPrimaryScale } from './press.js';
7
+ const StyledCircleButton = styled(animated.button) `
8
+ width: 2.5rem;
9
+ height: 2.5rem;
10
+ padding: 0;
11
+ border-radius: 50%;
12
+ border: 1px solid
13
+ ${({ theme }) => theme?.colors?.onPrimary ?? 'white'};
14
+ background: transparent;
15
+ display: flex;
16
+ align-items: center;
17
+ justify-content: center;
18
+ cursor: pointer;
19
+ ${pressPrimaryScale()}
20
+ `;
21
+ const StyledIcon = styled.span `
22
+ display: flex;
23
+ color: ${({ theme }) => theme?.colors?.onSurface ?? 'black'};
24
+ font-size: 1.125rem;
25
+ `;
26
+ /** Inline BsPerson (react-icons/bs) — Bootstrap-icons path data, glyph unchanged. */
27
+ const PersonIcon = () => (_jsx("svg", { stroke: "currentColor", fill: "currentColor", strokeWidth: "0", viewBox: "0 0 16 16", height: "1em", width: "1em", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", children: _jsx("path", { d: "M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6m2-3a2 2 0 1 1-4 0 2 2 0 0 1 4 0m4 8c0 1-1 1-1 1H3s-1 0-1-1 1-4 6-4 6 3 6 4m-1-.004c-.001-.246-.154-.986-.832-1.664C11.516 10.68 10.289 10 8 10s-3.516.68-4.168 1.332c-.678.678-.83 1.418-.832 1.664z" }) }));
28
+ /** Inline BsQrCodeScan (react-icons/bs) — Bootstrap-icons path data, glyph unchanged. */
29
+ const QrIcon = () => (_jsxs("svg", { stroke: "currentColor", fill: "currentColor", strokeWidth: "0", viewBox: "0 0 16 16", height: "1em", width: "1em", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", children: [_jsx("path", { d: "M0 .5A.5.5 0 0 1 .5 0h3a.5.5 0 0 1 0 1H1v2.5a.5.5 0 0 1-1 0zm12 0a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-1 0V1h-2.5a.5.5 0 0 1-.5-.5M.5 12a.5.5 0 0 1 .5.5V15h2.5a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5v-3a.5.5 0 0 1 .5-.5m15 0a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1 0-1H15v-2.5a.5.5 0 0 1 .5-.5M4 4h1v1H4z" }), _jsx("path", { d: "M7 2H2v5h5zM3 3h3v3H3zm2 8H4v1h1z" }), _jsx("path", { d: "M7 9H2v5h5zm-4 1h3v3H3zm8-6h1v1h-1z" }), _jsx("path", { d: "M9 2h5v5H9zm1 1v3h3V3zM8 8v2h1v1H8v1h2v-2h1v2h1v-1h2v-1h-3V8zm2 2H9V9h1zm4 2h-1v1h-2v1h3zm-4 2v-1H8v1z" }), _jsx("path", { d: "M12 9h2V8h-2z" })] }));
30
+ const ICONS = {
31
+ person: _jsx(PersonIcon, {}),
32
+ qr: _jsx(QrIcon, {}),
33
+ };
34
+ function resolveIcon(icon, iconComponent) {
35
+ if (icon !== undefined)
36
+ return icon;
37
+ return ICONS[iconComponent];
38
+ }
39
+ export default function CircleIconButton({ iconComponent, icon, onClick, }) {
40
+ const animatedStyles = useSpring({
41
+ from: { opacity: 0, scale: 0.5 },
42
+ to: { opacity: 1, scale: 1 },
43
+ });
44
+ const handleClick = () => {
45
+ if (onClick) {
46
+ onClick();
47
+ }
48
+ };
49
+ return (_jsx(StyledCircleButton, { type: "button", style: animatedStyles, onClick: handleClick, children: _jsx(StyledIcon, { children: resolveIcon(icon, iconComponent) }) }));
50
+ }
51
+ //# sourceMappingURL=circle-icon-button.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"circle-icon-button.js","sourceRoot":"","sources":["../src/circle-icon-button.tsx"],"names":[],"mappings":";AA6BA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACxD,4EAA4E;AAC5E,mEAAmE;AACnE,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAC3C,OAAO,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AA8B/C,MAAM,kBAAkB,GAAG,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAA;;;;;;IAM9C,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAE,KAAqB,EAAE,MAAM,EAAE,SAAS,IAAI,OAAO;;;;;;GAMpE,iBAAiB,EAAE;CACrB,CAAC;AAEF,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAA;;UAEpB,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAE,KAAqB,EAAE,MAAM,EAAE,SAAS,IAAI,OAAO;;CAE5E,CAAC;AAEF,qFAAqF;AACrF,MAAM,UAAU,GAAG,GAAiB,EAAE,CAAC,CACtC,cACC,MAAM,EAAC,cAAc,EACrB,IAAI,EAAC,cAAc,EACnB,WAAW,EAAC,GAAG,EACf,OAAO,EAAC,WAAW,EACnB,MAAM,EAAC,KAAK,EACZ,KAAK,EAAC,KAAK,EACX,KAAK,EAAC,4BAA4B,iBACtB,MAAM,EAClB,SAAS,EAAC,OAAO,YAEjB,eAAM,CAAC,EAAC,uOAAuO,GAAG,GAC7O,CACN,CAAC;AAEF,yFAAyF;AACzF,MAAM,MAAM,GAAG,GAAiB,EAAE,CAAC,CAClC,eACC,MAAM,EAAC,cAAc,EACrB,IAAI,EAAC,cAAc,EACnB,WAAW,EAAC,GAAG,EACf,OAAO,EAAC,WAAW,EACnB,MAAM,EAAC,KAAK,EACZ,KAAK,EAAC,KAAK,EACX,KAAK,EAAC,4BAA4B,iBACtB,MAAM,EAClB,SAAS,EAAC,OAAO,aAEjB,eAAM,CAAC,EAAC,gUAAgU,GAAG,EAC3U,eAAM,CAAC,EAAC,mCAAmC,GAAG,EAC9C,eAAM,CAAC,EAAC,qCAAqC,GAAG,EAChD,eAAM,CAAC,EAAC,wGAAwG,GAAG,EACnH,eAAM,CAAC,EAAC,eAAe,GAAG,IACrB,CACN,CAAC;AAEF,MAAM,KAAK,GAAyC;IACnD,MAAM,EAAE,KAAC,UAAU,KAAG;IACtB,EAAE,EAAE,KAAC,MAAM,KAAG;CACd,CAAC;AAEF,SAAS,WAAW,CAAC,IAAe,EAAE,aAA6B;IAClE,IAAI,IAAI,KAAK,SAAS;QAAE,OAAO,IAAI,CAAC;IACpC,OAAO,KAAK,CAAC,aAAa,CAAC,CAAC;AAC7B,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACxC,aAAa,EACb,IAAI,EACJ,OAAO,GACgB;IACvB,MAAM,cAAc,GAAG,SAAS,CAAC;QAChC,IAAI,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE;QAChC,EAAE,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE;KAC5B,CAAC,CAAC;IAEH,MAAM,WAAW,GAAG,GAAG,EAAE;QACxB,IAAI,OAAO,EAAE,CAAC;YACb,OAAO,EAAE,CAAC;QACX,CAAC;IACF,CAAC,CAAC;IAEF,OAAO,CACN,KAAC,kBAAkB,IAClB,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,cAAc,EACrB,OAAO,EAAE,WAAW,YAEpB,KAAC,UAAU,cAAE,WAAW,CAAC,IAAI,EAAE,aAAa,CAAC,GAAc,GACvC,CACrB,CAAC;AACH,CAAC"}
package/dist/index.d.ts CHANGED
@@ -7,4 +7,15 @@ export { SPRING_COMFORTABLE, SPRING_COMFORTABLE_SLOW, SPRING_SNAPPY, SPRING_RESP
7
7
  export type { SpringConfigConstant } from './spring.js';
8
8
  export { default as AnimatedText } from './animated-text.js';
9
9
  export type { AnimatedTextProps } from './animated-text.js';
10
+ export { default as BackButton } from './back-button.js';
11
+ export type { BackButtonProps } from './back-button.js';
12
+ export { default as CircleIconButton } from './circle-icon-button.js';
13
+ export type { CircleIconButtonProps, CircleIconName } from './circle-icon-button.js';
14
+ export { default as BannerButton } from './banner-button.js';
15
+ export type { BannerButtonProps } from './banner-button.js';
16
+ export { buildTheme, theme, hexToRgb } from './theme.js';
17
+ export type { ThemeType } from './theme.js';
18
+ export { lightPalette, darkPalette } from './palettes.js';
19
+ export type { ModeColorPalette } from './palettes.js';
20
+ export type { DynamicLanguage, CharacterPreference, StaticLanguage, } from './language.js';
10
21
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,YAAY,EACZ,mBAAmB,EACnB,kBAAkB,EAClB,YAAY,EACZ,WAAW,EACX,iBAAiB,EACjB,gBAAgB,GAChB,MAAM,YAAY,CAAC;AAEpB,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAE7D,OAAO,EACN,oBAAoB,EACpB,eAAe,EACf,cAAc,GACd,MAAM,mBAAmB,CAAC;AAE3B,OAAO,EAAE,MAAM,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACjE,YAAY,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE/C,OAAO,EACN,kBAAkB,EAClB,uBAAuB,EACvB,aAAa,EACb,iBAAiB,EACjB,gBAAgB,EAChB,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,cAAc,EACd,aAAa,GACb,MAAM,aAAa,CAAC;AACrB,YAAY,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC;AAExD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAC7D,YAAY,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,YAAY,EACZ,mBAAmB,EACnB,kBAAkB,EAClB,YAAY,EACZ,WAAW,EACX,iBAAiB,EACjB,gBAAgB,GAChB,MAAM,YAAY,CAAC;AAEpB,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAE7D,OAAO,EACN,oBAAoB,EACpB,eAAe,EACf,cAAc,GACd,MAAM,mBAAmB,CAAC;AAE3B,OAAO,EAAE,MAAM,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACjE,YAAY,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE/C,OAAO,EACN,kBAAkB,EAClB,uBAAuB,EACvB,aAAa,EACb,iBAAiB,EACjB,gBAAgB,EAChB,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,cAAc,EACd,aAAa,GACb,MAAM,aAAa,CAAC;AACrB,YAAY,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC;AAExD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAC7D,YAAY,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAE5D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAC;AACzD,YAAY,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AACxD,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AACtE,YAAY,EAAE,qBAAqB,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AACrF,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAC7D,YAAY,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAE5D,OAAO,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACzD,YAAY,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAC5C,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC1D,YAAY,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAEtD,YAAY,EACX,eAAe,EACf,mBAAmB,EACnB,cAAc,GACd,MAAM,eAAe,CAAC"}
package/dist/index.js CHANGED
@@ -4,4 +4,9 @@ export { actionSheetContainer, actionSheetList, actionSheetRow, } from './action
4
4
  export { Ripple, rippleAnimation, useRipple } from './ripple.js';
5
5
  export { SPRING_COMFORTABLE, SPRING_COMFORTABLE_SLOW, SPRING_SNAPPY, SPRING_RESPONSIVE, SPRING_STAGGERED, SPRING_INSTANT, SPRING_GENTLE, SPRING_VERY_SLOW, SPRING_LANDING, SPRING_RISING, } from './spring.js';
6
6
  export { default as AnimatedText } from './animated-text.js';
7
+ export { default as BackButton } from './back-button.js';
8
+ export { default as CircleIconButton } from './circle-icon-button.js';
9
+ export { default as BannerButton } from './banner-button.js';
10
+ export { buildTheme, theme, hexToRgb } from './theme.js';
11
+ export { lightPalette, darkPalette } from './palettes.js';
7
12
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,YAAY,EACZ,mBAAmB,EACnB,kBAAkB,EAClB,YAAY,EACZ,WAAW,EACX,iBAAiB,EACjB,gBAAgB,GAChB,MAAM,YAAY,CAAC;AAEpB,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAE7D,OAAO,EACN,oBAAoB,EACpB,eAAe,EACf,cAAc,GACd,MAAM,mBAAmB,CAAC;AAE3B,OAAO,EAAE,MAAM,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAGjE,OAAO,EACN,kBAAkB,EAClB,uBAAuB,EACvB,aAAa,EACb,iBAAiB,EACjB,gBAAgB,EAChB,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,cAAc,EACd,aAAa,GACb,MAAM,aAAa,CAAC;AAGrB,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,oBAAoB,CAAC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,YAAY,EACZ,mBAAmB,EACnB,kBAAkB,EAClB,YAAY,EACZ,WAAW,EACX,iBAAiB,EACjB,gBAAgB,GAChB,MAAM,YAAY,CAAC;AAEpB,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAE7D,OAAO,EACN,oBAAoB,EACpB,eAAe,EACf,cAAc,GACd,MAAM,mBAAmB,CAAC;AAE3B,OAAO,EAAE,MAAM,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAGjE,OAAO,EACN,kBAAkB,EAClB,uBAAuB,EACvB,aAAa,EACb,iBAAiB,EACjB,gBAAgB,EAChB,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,cAAc,EACd,aAAa,GACb,MAAM,aAAa,CAAC;AAGrB,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAG7D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAEzD,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAEtE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAG7D,OAAO,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEzD,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC"}
@@ -0,0 +1,23 @@
1
+ /**
2
+ * Shared language types — ported from ymy-components.
3
+ *
4
+ * These describe a multilingual content model and the user's display
5
+ * preferences. They are pure types (no runtime), kept domain-light so consumers
6
+ * (e.g. an i18n layer) can map their own language model onto primitives like
7
+ * {@link AnimatedText}.
8
+ *
9
+ * In ymy these lived across `./types/DynamicLanguage` and
10
+ * `./animations/AnimatedText`; kang's `AnimatedText` is intentionally
11
+ * domain-free, so the language vocabulary is consolidated here.
12
+ */
13
+ /** A single piece of content available in English, traditional, and simplified Chinese. */
14
+ export type DynamicLanguage = {
15
+ english: string;
16
+ traditional: string;
17
+ simplified: string;
18
+ };
19
+ /** Which Chinese character set the user prefers to read. */
20
+ export type CharacterPreference = 'simplified' | 'traditional';
21
+ /** Which static (non-cycling) language to display. */
22
+ export type StaticLanguage = 'english' | 'chinese';
23
+ //# sourceMappingURL=language.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"language.d.ts","sourceRoot":"","sources":["../src/language.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAEH,2FAA2F;AAC3F,MAAM,MAAM,eAAe,GAAG;IAC7B,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,4DAA4D;AAC5D,MAAM,MAAM,mBAAmB,GAAG,YAAY,GAAG,aAAa,CAAC;AAE/D,sDAAsD;AACtD,MAAM,MAAM,cAAc,GAAG,SAAS,GAAG,SAAS,CAAC"}
@@ -0,0 +1,14 @@
1
+ /**
2
+ * Shared language types — ported from ymy-components.
3
+ *
4
+ * These describe a multilingual content model and the user's display
5
+ * preferences. They are pure types (no runtime), kept domain-light so consumers
6
+ * (e.g. an i18n layer) can map their own language model onto primitives like
7
+ * {@link AnimatedText}.
8
+ *
9
+ * In ymy these lived across `./types/DynamicLanguage` and
10
+ * `./animations/AnimatedText`; kang's `AnimatedText` is intentionally
11
+ * domain-free, so the language vocabulary is consolidated here.
12
+ */
13
+ export {};
14
+ //# sourceMappingURL=language.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"language.js","sourceRoot":"","sources":["../src/language.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG"}
@@ -0,0 +1,87 @@
1
+ /**
2
+ * Per-mode color palettes for the theme system.
3
+ *
4
+ * Bold minimal color system:
5
+ * - Light mode: refined teal primary, sky-blue background, warm white surfaces.
6
+ * - Dark mode: soft green primary, near-black with green tint.
7
+ *
8
+ * Every design token is a ready-to-use value; the theme builder is a mechanical
9
+ * mapping from a palette to the theme object. Ported from ymy-components.
10
+ */
11
+ /** Per-mode color palette: every design token as a ready-to-use value */
12
+ export interface ModeColorPalette {
13
+ primary: string;
14
+ onPrimary: string;
15
+ primaryContainer: string;
16
+ onPrimaryContainer: string;
17
+ primaryDark: string;
18
+ primaryDarker: string;
19
+ secondary: string;
20
+ onSecondary: string;
21
+ secondaryContainer: string;
22
+ onSecondaryContainer: string;
23
+ secondaryLight: string;
24
+ success: string;
25
+ onSuccess: string;
26
+ successContainer: string;
27
+ onSuccessContainer: string;
28
+ successSurface: string;
29
+ successDark: string;
30
+ successMuted: string;
31
+ error: string;
32
+ onError: string;
33
+ errorMuted: string;
34
+ surface: string;
35
+ onSurface: string;
36
+ surfaceVariant: string;
37
+ onSurfaceVariant: string;
38
+ surfaceContainer: string;
39
+ surfaceContainerHigh: string;
40
+ background: string;
41
+ onBackground: string;
42
+ outline: string;
43
+ outlineVariant: string;
44
+ shadow: string;
45
+ shadowLight: string;
46
+ shadowLighter: string;
47
+ shadowSubtle: string;
48
+ shadowFaint: string;
49
+ scrim: string;
50
+ scrimLight: string;
51
+ ripple: string;
52
+ whiteHigh: string;
53
+ whiteMedium: string;
54
+ whiteLow: string;
55
+ whiteHover: string;
56
+ keyboardSurface: string;
57
+ keyCharacter: string;
58
+ keyCharacterText: string;
59
+ keyDefault: string;
60
+ keyDefaultText: string;
61
+ keyWrong: string;
62
+ keyWrongMuted: string;
63
+ keyCorrect: string;
64
+ keyCorrectMuted: string;
65
+ keyAccentText: string;
66
+ keyDisabled: string;
67
+ keyDisabledText: string;
68
+ toggleTrackOn: string;
69
+ toggleTrackOff: string;
70
+ toggleThumbOn: string;
71
+ toggleThumbOff: string;
72
+ toggleHoverOn: string;
73
+ toggleHoverOff: string;
74
+ toggleFocusOn: string;
75
+ toggleFocusOff: string;
76
+ textShadowDark: string;
77
+ textShadow1: string;
78
+ textShadow2: string;
79
+ textShadow3: string;
80
+ primaryRgb: string;
81
+ backgroundRgb: string;
82
+ surfaceRgb: string;
83
+ primaryDarkerRgb: string;
84
+ }
85
+ export declare const lightPalette: ModeColorPalette;
86
+ export declare const darkPalette: ModeColorPalette;
87
+ //# sourceMappingURL=palettes.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"palettes.d.ts","sourceRoot":"","sources":["../src/palettes.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,yEAAyE;AACzE,MAAM,WAAW,gBAAgB;IAEhC,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;IAClB,gBAAgB,EAAE,MAAM,CAAC;IACzB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,WAAW,EAAE,MAAM,CAAC;IACpB,aAAa,EAAE,MAAM,CAAC;IAGtB,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,oBAAoB,EAAE,MAAM,CAAC;IAC7B,cAAc,EAAE,MAAM,CAAC;IAGvB,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;IAClB,gBAAgB,EAAE,MAAM,CAAC;IACzB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,cAAc,EAAE,MAAM,CAAC;IACvB,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,EAAE,MAAM,CAAC;IAGrB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,MAAM,CAAC;IAGnB,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;IAClB,cAAc,EAAE,MAAM,CAAC;IACvB,gBAAgB,EAAE,MAAM,CAAC;IACzB,gBAAgB,EAAE,MAAM,CAAC;IACzB,oBAAoB,EAAE,MAAM,CAAC;IAG7B,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IAGrB,OAAO,EAAE,MAAM,CAAC;IAChB,cAAc,EAAE,MAAM,CAAC;IAGvB,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;IACpB,aAAa,EAAE,MAAM,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IAGpB,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,MAAM,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC;IAGf,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IAGnB,eAAe,EAAE,MAAM,CAAC;IACxB,YAAY,EAAE,MAAM,CAAC;IACrB,gBAAgB,EAAE,MAAM,CAAC;IACzB,UAAU,EAAE,MAAM,CAAC;IACnB,cAAc,EAAE,MAAM,CAAC;IACvB,QAAQ,EAAE,MAAM,CAAC;IACjB,aAAa,EAAE,MAAM,CAAC;IACtB,UAAU,EAAE,MAAM,CAAC;IACnB,eAAe,EAAE,MAAM,CAAC;IACxB,aAAa,EAAE,MAAM,CAAC;IACtB,WAAW,EAAE,MAAM,CAAC;IACpB,eAAe,EAAE,MAAM,CAAC;IAGxB,aAAa,EAAE,MAAM,CAAC;IACtB,cAAc,EAAE,MAAM,CAAC;IACvB,aAAa,EAAE,MAAM,CAAC;IACtB,cAAc,EAAE,MAAM,CAAC;IACvB,aAAa,EAAE,MAAM,CAAC;IACtB,cAAc,EAAE,MAAM,CAAC;IACvB,aAAa,EAAE,MAAM,CAAC;IACtB,cAAc,EAAE,MAAM,CAAC;IAGvB,cAAc,EAAE,MAAM,CAAC;IACvB,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;IAGpB,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;IACtB,UAAU,EAAE,MAAM,CAAC;IACnB,gBAAgB,EAAE,MAAM,CAAC;CACzB;AAED,eAAO,MAAM,YAAY,EAAE,gBAmG1B,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,gBAmGzB,CAAC"}
@@ -0,0 +1,185 @@
1
+ /**
2
+ * Per-mode color palettes for the theme system.
3
+ *
4
+ * Bold minimal color system:
5
+ * - Light mode: refined teal primary, sky-blue background, warm white surfaces.
6
+ * - Dark mode: soft green primary, near-black with green tint.
7
+ *
8
+ * Every design token is a ready-to-use value; the theme builder is a mechanical
9
+ * mapping from a palette to the theme object. Ported from ymy-components.
10
+ */
11
+ export const lightPalette = {
12
+ // Primary — refined teal, calm and grounded
13
+ primary: '#2E7D8C',
14
+ onPrimary: '#ffffff',
15
+ primaryContainer: '#B2EBF2',
16
+ onPrimaryContainer: '#1A5C68',
17
+ primaryDark: '#256A77',
18
+ primaryDarker: '#1C5561',
19
+ // Secondary — bold goldenrod yellow
20
+ secondary: '#E8C840',
21
+ onSecondary: '#1A1A1A',
22
+ secondaryContainer: '#FFF8E0',
23
+ onSecondaryContainer: '#1A1A1A',
24
+ secondaryLight: '#E8C840',
25
+ // Success
26
+ success: '#4ade80',
27
+ onSuccess: '#0D3B70',
28
+ successContainer: '#bbf7d0',
29
+ onSuccessContainer: '#166534',
30
+ successSurface: '#f0fdf4',
31
+ successDark: '#22c55e',
32
+ successMuted: '#3d6b56',
33
+ // Error
34
+ error: '#BF4B3E',
35
+ onError: '#ffffff',
36
+ errorMuted: '#6b4a46',
37
+ // Surface — warm white
38
+ surface: '#ffffff',
39
+ onSurface: '#1A1A1A',
40
+ surfaceVariant: '#FFF9F2',
41
+ onSurfaceVariant: '#5A5550',
42
+ surfaceContainer: '#F8F6F4',
43
+ surfaceContainerHigh: '#F0EEEC',
44
+ // Background — bright sky blue splash
45
+ background: '#64B5F6',
46
+ onBackground: '#0A0A0A',
47
+ // Outline & Dividers
48
+ outline: '#9E9E9E',
49
+ outlineVariant: '#D0D0D0',
50
+ // Shadows
51
+ shadow: 'rgba(0, 0, 0, 0.28)',
52
+ shadowLight: 'rgba(0, 0, 0, 0.15)',
53
+ shadowLighter: 'rgba(0, 0, 0, 0.10)',
54
+ shadowSubtle: 'rgba(0, 0, 0, 0.08)',
55
+ shadowFaint: 'rgba(0, 0, 0, 0.05)',
56
+ // Overlay
57
+ scrim: 'rgba(0, 0, 0, 0.4)',
58
+ scrimLight: 'rgba(0, 0, 0, 0.3)',
59
+ ripple: 'rgba(0, 0, 0, 0.1)',
60
+ // Interactive states (white variants for dark backgrounds)
61
+ whiteHigh: 'rgba(255, 255, 255, 0.9)',
62
+ whiteMedium: 'rgba(255, 255, 255, 0.5)',
63
+ whiteLow: 'rgba(255, 255, 255, 0.4)',
64
+ whiteHover: 'rgba(255, 255, 255, 0.08)',
65
+ // Keyboard chrome — neutral gray (doesn't compete with blue)
66
+ keyboardSurface: '#D5D3D0',
67
+ keyCharacter: '#ffffff',
68
+ keyCharacterText: '#1A1A1A',
69
+ keyDefault: '#B5B2AE',
70
+ keyDefaultText: '#1A1A1A',
71
+ keyWrong: '#B5B2AE',
72
+ keyWrongMuted: '#B5B2AE',
73
+ keyCorrect: '#2E7D8C',
74
+ keyCorrectMuted: '#256A77',
75
+ keyAccentText: '#ffffff',
76
+ keyDisabled: '#6E6E6E',
77
+ keyDisabledText: '#9E9E9E',
78
+ // Toggle/Switch — teal
79
+ toggleTrackOn: 'rgba(46, 125, 140, 0.5)',
80
+ toggleTrackOff: 'rgba(0, 0, 0, 0.38)',
81
+ toggleThumbOn: '#2E7D8C',
82
+ toggleThumbOff: '#FAFAFA',
83
+ toggleHoverOn: 'rgba(46, 125, 140, 0.08)',
84
+ toggleHoverOff: 'rgba(0, 0, 0, 0.04)',
85
+ toggleFocusOn: 'rgba(46, 125, 140, 0.12)',
86
+ toggleFocusOff: 'rgba(0, 0, 0, 0.06)',
87
+ // 3D text shadows
88
+ textShadowDark: '#505050',
89
+ textShadow1: '#E0E0E0',
90
+ textShadow2: '#D0D0D0',
91
+ textShadow3: '#B8B8B8',
92
+ // RGB decompositions
93
+ primaryRgb: '46, 125, 140',
94
+ backgroundRgb: '100, 181, 246',
95
+ surfaceRgb: '255, 255, 255',
96
+ primaryDarkerRgb: '28, 85, 97',
97
+ };
98
+ export const darkPalette = {
99
+ // Primary — soft green for contrast on near-black
100
+ primary: '#81c784',
101
+ onPrimary: '#1a4f2e',
102
+ primaryContainer: '#1b5e20',
103
+ onPrimaryContainer: '#c8e6c9',
104
+ primaryDark: '#4caf50',
105
+ primaryDarker: '#2e7d32',
106
+ // Secondary — lighter orange/gold accents
107
+ secondary: '#E8C840',
108
+ onSecondary: '#161616',
109
+ secondaryContainer: '#2A3A2A',
110
+ onSecondaryContainer: '#FFF5E0',
111
+ secondaryLight: '#D4A520',
112
+ // Success
113
+ success: '#4ade80',
114
+ onSuccess: '#166534',
115
+ successContainer: '#243d2f',
116
+ onSuccessContainer: '#bbf7d0',
117
+ successSurface: '#1a3022',
118
+ successDark: '#4ade80',
119
+ successMuted: '#22c55e',
120
+ // Error — #f28078 gives >=4.5:1 on surface (#282C28)
121
+ error: '#f28078',
122
+ onError: '#161616',
123
+ errorMuted: '#8b5a55',
124
+ // Surface — near-black with subtle green tint
125
+ surface: '#282C28',
126
+ onSurface: '#eeeeee',
127
+ surfaceVariant: '#1C201C',
128
+ onSurfaceVariant: '#d0d0d0',
129
+ surfaceContainer: '#323632',
130
+ surfaceContainerHigh: '#3C403C',
131
+ // Background — near-black hero
132
+ background: '#0E110E',
133
+ onBackground: '#eeeeee',
134
+ // Outline & Dividers — neutral-tinted for green surfaces
135
+ outline: '#858885',
136
+ outlineVariant: '#656865',
137
+ // Shadows — subtler on dark backgrounds
138
+ shadow: 'rgba(0, 0, 0, 0.4)',
139
+ shadowLight: 'rgba(0, 0, 0, 0.25)',
140
+ shadowLighter: 'rgba(0, 0, 0, 0.15)',
141
+ shadowSubtle: 'rgba(0, 0, 0, 0.1)',
142
+ shadowFaint: 'rgba(0, 0, 0, 0.06)',
143
+ // Overlay
144
+ scrim: 'rgba(0, 0, 0, 0.6)',
145
+ scrimLight: 'rgba(0, 0, 0, 0.45)',
146
+ ripple: 'rgba(255, 255, 255, 0.1)',
147
+ // Interactive states (white variants)
148
+ whiteHigh: 'rgba(255, 255, 255, 0.87)',
149
+ whiteMedium: 'rgba(255, 255, 255, 0.5)',
150
+ whiteLow: 'rgba(255, 255, 255, 0.2)',
151
+ whiteHover: 'rgba(255, 255, 255, 0.08)',
152
+ // Keyboard chrome — dark green-tinted
153
+ keyboardSurface: '#1e241e',
154
+ keyCharacter: '#383e38',
155
+ keyCharacterText: '#eeeeee',
156
+ keyDefault: '#2a302a',
157
+ keyDefaultText: '#d0d0d0',
158
+ keyWrong: '#2a302a',
159
+ keyWrongMuted: '#2a302a',
160
+ keyCorrect: '#4caf50',
161
+ keyCorrectMuted: '#2e7d32',
162
+ keyAccentText: '#eeeeee',
163
+ keyDisabled: '#505050',
164
+ keyDisabledText: '#6E6E6E',
165
+ // Toggle/Switch — green teal
166
+ toggleTrackOn: 'rgba(129, 199, 132, 0.5)',
167
+ toggleTrackOff: 'rgba(255, 255, 255, 0.3)',
168
+ toggleThumbOn: '#81c784',
169
+ toggleThumbOff: '#6E6E6E',
170
+ toggleHoverOn: 'rgba(129, 199, 132, 0.08)',
171
+ toggleHoverOff: 'rgba(255, 255, 255, 0.04)',
172
+ toggleFocusOn: 'rgba(129, 199, 132, 0.12)',
173
+ toggleFocusOff: 'rgba(255, 255, 255, 0.06)',
174
+ // 3D text shadows
175
+ textShadowDark: '#000000',
176
+ textShadow1: '#2A2A2A',
177
+ textShadow2: '#161616',
178
+ textShadow3: '#000000',
179
+ // RGB decompositions
180
+ primaryRgb: '129, 199, 132',
181
+ backgroundRgb: '14, 17, 14',
182
+ surfaceRgb: '40, 44, 40',
183
+ primaryDarkerRgb: '46, 125, 50',
184
+ };
185
+ //# sourceMappingURL=palettes.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"palettes.js","sourceRoot":"","sources":["../src/palettes.ts"],"names":[],"mappings":"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"}
@@ -0,0 +1,192 @@
1
+ /**
2
+ * Theme system — a mechanical mapping from a per-mode {@link ModeColorPalette}
3
+ * to the theme object consumed via styled-components' `props.theme`.
4
+ *
5
+ * Ported from ymy-components. The palettes carry all color values; this builder
6
+ * assembles them (plus spacing/styling tokens) into the shape the app reads.
7
+ *
8
+ * To wire global `DefaultTheme` typing in a consumer, augment styled-components
9
+ * with {@link ThemeType} (see the project's `styled.d.ts`).
10
+ */
11
+ import type { ModeColorPalette } from './palettes.js';
12
+ /** Convert a hex color (`#rrggbb`) to an `"r, g, b"` string for rgba() usage */
13
+ export declare function hexToRgb(hex: string): string;
14
+ /** Build a theme object for the given mode */
15
+ export declare function buildTheme(mode: 'light' | 'dark'): {
16
+ readonly spacing: {
17
+ readonly appStandardPadding: "1rem";
18
+ };
19
+ readonly colors: {
20
+ readonly primary: string;
21
+ readonly onPrimary: string;
22
+ readonly primaryContainer: string;
23
+ readonly onPrimaryContainer: string;
24
+ readonly primaryDark: string;
25
+ readonly primaryDarker: string;
26
+ readonly secondary: string;
27
+ readonly onSecondary: string;
28
+ readonly secondaryContainer: string;
29
+ readonly onSecondaryContainer: string;
30
+ readonly secondaryLight: string;
31
+ readonly success: string;
32
+ readonly onSuccess: string;
33
+ readonly successContainer: string;
34
+ readonly onSuccessContainer: string;
35
+ readonly successSurface: string;
36
+ readonly successDark: string;
37
+ readonly successMuted: string;
38
+ readonly error: string;
39
+ readonly onError: string;
40
+ readonly errorMuted: string;
41
+ readonly surface: string;
42
+ readonly onSurface: string;
43
+ readonly surfaceVariant: string;
44
+ readonly onSurfaceVariant: string;
45
+ readonly surfaceContainer: string;
46
+ readonly surfaceContainerHigh: string;
47
+ readonly background: string;
48
+ readonly onBackground: string;
49
+ readonly outline: string;
50
+ readonly outlineVariant: string;
51
+ readonly shadow: string;
52
+ readonly shadowLight: string;
53
+ readonly shadowLighter: string;
54
+ readonly shadowSubtle: string;
55
+ readonly shadowFaint: string;
56
+ readonly scrim: string;
57
+ readonly scrimLight: string;
58
+ readonly ripple: string;
59
+ readonly whiteHigh: string;
60
+ readonly whiteMedium: string;
61
+ readonly whiteLow: string;
62
+ readonly whiteHover: string;
63
+ readonly keyboardSurface: string;
64
+ readonly keyCharacter: string;
65
+ readonly keyCharacterText: string;
66
+ readonly keyDefault: string;
67
+ readonly keyDefaultText: string;
68
+ readonly keyWrong: string;
69
+ readonly keyWrongMuted: string;
70
+ readonly keyCorrect: string;
71
+ readonly keyCorrectMuted: string;
72
+ readonly keyAccentText: string;
73
+ readonly keyDisabled: string;
74
+ readonly keyDisabledText: string;
75
+ readonly toggleTrackOn: string;
76
+ readonly toggleTrackOff: string;
77
+ readonly toggleThumbOn: string;
78
+ readonly toggleThumbOff: string;
79
+ readonly toggleHoverOn: string;
80
+ readonly toggleHoverOff: string;
81
+ readonly toggleFocusOn: string;
82
+ readonly toggleFocusOff: string;
83
+ readonly textShadowDark: string;
84
+ readonly textShadow1: string;
85
+ readonly textShadow2: string;
86
+ readonly textShadow3: string;
87
+ readonly primaryRgb: string;
88
+ readonly backgroundRgb: string;
89
+ readonly surfaceRgb: string;
90
+ readonly primaryDarkerRgb: string;
91
+ readonly primaryLight: string;
92
+ readonly backgroundHex: string;
93
+ readonly bottomNavBarBackgroundRgb: string;
94
+ readonly settingsBackgroundRgb: string;
95
+ readonly text: string;
96
+ };
97
+ readonly styling: {
98
+ readonly borderRadiusPixel: number;
99
+ };
100
+ readonly palette: ModeColorPalette;
101
+ };
102
+ /** Default light theme (for backwards compatibility and tests) */
103
+ export declare const theme: {
104
+ readonly spacing: {
105
+ readonly appStandardPadding: "1rem";
106
+ };
107
+ readonly colors: {
108
+ readonly primary: string;
109
+ readonly onPrimary: string;
110
+ readonly primaryContainer: string;
111
+ readonly onPrimaryContainer: string;
112
+ readonly primaryDark: string;
113
+ readonly primaryDarker: string;
114
+ readonly secondary: string;
115
+ readonly onSecondary: string;
116
+ readonly secondaryContainer: string;
117
+ readonly onSecondaryContainer: string;
118
+ readonly secondaryLight: string;
119
+ readonly success: string;
120
+ readonly onSuccess: string;
121
+ readonly successContainer: string;
122
+ readonly onSuccessContainer: string;
123
+ readonly successSurface: string;
124
+ readonly successDark: string;
125
+ readonly successMuted: string;
126
+ readonly error: string;
127
+ readonly onError: string;
128
+ readonly errorMuted: string;
129
+ readonly surface: string;
130
+ readonly onSurface: string;
131
+ readonly surfaceVariant: string;
132
+ readonly onSurfaceVariant: string;
133
+ readonly surfaceContainer: string;
134
+ readonly surfaceContainerHigh: string;
135
+ readonly background: string;
136
+ readonly onBackground: string;
137
+ readonly outline: string;
138
+ readonly outlineVariant: string;
139
+ readonly shadow: string;
140
+ readonly shadowLight: string;
141
+ readonly shadowLighter: string;
142
+ readonly shadowSubtle: string;
143
+ readonly shadowFaint: string;
144
+ readonly scrim: string;
145
+ readonly scrimLight: string;
146
+ readonly ripple: string;
147
+ readonly whiteHigh: string;
148
+ readonly whiteMedium: string;
149
+ readonly whiteLow: string;
150
+ readonly whiteHover: string;
151
+ readonly keyboardSurface: string;
152
+ readonly keyCharacter: string;
153
+ readonly keyCharacterText: string;
154
+ readonly keyDefault: string;
155
+ readonly keyDefaultText: string;
156
+ readonly keyWrong: string;
157
+ readonly keyWrongMuted: string;
158
+ readonly keyCorrect: string;
159
+ readonly keyCorrectMuted: string;
160
+ readonly keyAccentText: string;
161
+ readonly keyDisabled: string;
162
+ readonly keyDisabledText: string;
163
+ readonly toggleTrackOn: string;
164
+ readonly toggleTrackOff: string;
165
+ readonly toggleThumbOn: string;
166
+ readonly toggleThumbOff: string;
167
+ readonly toggleHoverOn: string;
168
+ readonly toggleHoverOff: string;
169
+ readonly toggleFocusOn: string;
170
+ readonly toggleFocusOff: string;
171
+ readonly textShadowDark: string;
172
+ readonly textShadow1: string;
173
+ readonly textShadow2: string;
174
+ readonly textShadow3: string;
175
+ readonly primaryRgb: string;
176
+ readonly backgroundRgb: string;
177
+ readonly surfaceRgb: string;
178
+ readonly primaryDarkerRgb: string;
179
+ readonly primaryLight: string;
180
+ readonly backgroundHex: string;
181
+ readonly bottomNavBarBackgroundRgb: string;
182
+ readonly settingsBackgroundRgb: string;
183
+ readonly text: string;
184
+ };
185
+ readonly styling: {
186
+ readonly borderRadiusPixel: number;
187
+ };
188
+ readonly palette: ModeColorPalette;
189
+ };
190
+ /** Type export for use in styled.d.ts augmentations */
191
+ export type ThemeType = ReturnType<typeof buildTheme>;
192
+ //# sourceMappingURL=theme.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../src/theme.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAGtD,gFAAgF;AAChF,wBAAgB,QAAQ,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAM5C;AA6GD,8CAA8C;AAC9C,wBAAgB,UAAU,CAAC,IAAI,EAAE,OAAO,GAAG,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oCAPrB,MAAM;;;EASjC;AAED,kEAAkE;AAClE,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oCAZU,MAAM;;;CAYM,CAAC;AAEzC,uDAAuD;AACvD,MAAM,MAAM,SAAS,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC"}
package/dist/theme.js ADDED
@@ -0,0 +1,118 @@
1
+ /**
2
+ * Theme system — a mechanical mapping from a per-mode {@link ModeColorPalette}
3
+ * to the theme object consumed via styled-components' `props.theme`.
4
+ *
5
+ * Ported from ymy-components. The palettes carry all color values; this builder
6
+ * assembles them (plus spacing/styling tokens) into the shape the app reads.
7
+ *
8
+ * To wire global `DefaultTheme` typing in a consumer, augment styled-components
9
+ * with {@link ThemeType} (see the project's `styled.d.ts`).
10
+ */
11
+ import { lightPalette, darkPalette } from './palettes.js';
12
+ /** Convert a hex color (`#rrggbb`) to an `"r, g, b"` string for rgba() usage */
13
+ export function hexToRgb(hex) {
14
+ const h = hex.replace('#', '');
15
+ const r = parseInt(h.substring(0, 2), 16);
16
+ const g = parseInt(h.substring(2, 4), 16);
17
+ const b = parseInt(h.substring(4, 6), 16);
18
+ return `${r}, ${g}, ${b}`;
19
+ }
20
+ function assembleTheme(palette) {
21
+ return {
22
+ spacing: {
23
+ appStandardPadding: '1rem',
24
+ },
25
+ colors: {
26
+ // Core tokens — 1:1 from palette
27
+ primary: palette.primary,
28
+ onPrimary: palette.onPrimary,
29
+ primaryContainer: palette.primaryContainer,
30
+ onPrimaryContainer: palette.onPrimaryContainer,
31
+ primaryDark: palette.primaryDark,
32
+ primaryDarker: palette.primaryDarker,
33
+ secondary: palette.secondary,
34
+ onSecondary: palette.onSecondary,
35
+ secondaryContainer: palette.secondaryContainer,
36
+ onSecondaryContainer: palette.onSecondaryContainer,
37
+ secondaryLight: palette.secondaryLight,
38
+ success: palette.success,
39
+ onSuccess: palette.onSuccess,
40
+ successContainer: palette.successContainer,
41
+ onSuccessContainer: palette.onSuccessContainer,
42
+ successSurface: palette.successSurface,
43
+ successDark: palette.successDark,
44
+ successMuted: palette.successMuted,
45
+ error: palette.error,
46
+ onError: palette.onError,
47
+ errorMuted: palette.errorMuted,
48
+ surface: palette.surface,
49
+ onSurface: palette.onSurface,
50
+ surfaceVariant: palette.surfaceVariant,
51
+ onSurfaceVariant: palette.onSurfaceVariant,
52
+ surfaceContainer: palette.surfaceContainer,
53
+ surfaceContainerHigh: palette.surfaceContainerHigh,
54
+ background: palette.background,
55
+ onBackground: palette.onBackground,
56
+ outline: palette.outline,
57
+ outlineVariant: palette.outlineVariant,
58
+ shadow: palette.shadow,
59
+ shadowLight: palette.shadowLight,
60
+ shadowLighter: palette.shadowLighter,
61
+ shadowSubtle: palette.shadowSubtle,
62
+ shadowFaint: palette.shadowFaint,
63
+ scrim: palette.scrim,
64
+ scrimLight: palette.scrimLight,
65
+ ripple: palette.ripple,
66
+ whiteHigh: palette.whiteHigh,
67
+ whiteMedium: palette.whiteMedium,
68
+ whiteLow: palette.whiteLow,
69
+ whiteHover: palette.whiteHover,
70
+ keyboardSurface: palette.keyboardSurface,
71
+ keyCharacter: palette.keyCharacter,
72
+ keyCharacterText: palette.keyCharacterText,
73
+ keyDefault: palette.keyDefault,
74
+ keyDefaultText: palette.keyDefaultText,
75
+ keyWrong: palette.keyWrong,
76
+ keyWrongMuted: palette.keyWrongMuted,
77
+ keyCorrect: palette.keyCorrect,
78
+ keyCorrectMuted: palette.keyCorrectMuted,
79
+ keyAccentText: palette.keyAccentText,
80
+ keyDisabled: palette.keyDisabled,
81
+ keyDisabledText: palette.keyDisabledText,
82
+ toggleTrackOn: palette.toggleTrackOn,
83
+ toggleTrackOff: palette.toggleTrackOff,
84
+ toggleThumbOn: palette.toggleThumbOn,
85
+ toggleThumbOff: palette.toggleThumbOff,
86
+ toggleHoverOn: palette.toggleHoverOn,
87
+ toggleHoverOff: palette.toggleHoverOff,
88
+ toggleFocusOn: palette.toggleFocusOn,
89
+ toggleFocusOff: palette.toggleFocusOff,
90
+ textShadowDark: palette.textShadowDark,
91
+ textShadow1: palette.textShadow1,
92
+ textShadow2: palette.textShadow2,
93
+ textShadow3: palette.textShadow3,
94
+ // RGB versions for rgba() usage in styled-components
95
+ primaryRgb: palette.primaryRgb,
96
+ backgroundRgb: palette.backgroundRgb,
97
+ surfaceRgb: palette.surfaceRgb,
98
+ primaryDarkerRgb: palette.primaryDarkerRgb,
99
+ // Legacy mappings (for gradual migration - can be removed later)
100
+ primaryLight: palette.primaryContainer,
101
+ backgroundHex: palette.background,
102
+ bottomNavBarBackgroundRgb: palette.primaryRgb,
103
+ settingsBackgroundRgb: palette.surfaceRgb,
104
+ text: palette.onSurface,
105
+ },
106
+ styling: {
107
+ borderRadiusPixel: 32,
108
+ },
109
+ palette,
110
+ };
111
+ }
112
+ /** Build a theme object for the given mode */
113
+ export function buildTheme(mode) {
114
+ return assembleTheme(mode === 'dark' ? darkPalette : lightPalette);
115
+ }
116
+ /** Default light theme (for backwards compatibility and tests) */
117
+ export const theme = buildTheme('light');
118
+ //# sourceMappingURL=theme.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"theme.js","sourceRoot":"","sources":["../src/theme.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAGH,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE1D,gFAAgF;AAChF,MAAM,UAAU,QAAQ,CAAC,GAAW;IACnC,MAAM,CAAC,GAAG,GAAG,CAAC,OAAO,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC;IAC/B,MAAM,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;IAC1C,MAAM,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;IAC1C,MAAM,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;IAC1C,OAAO,GAAG,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC;AAC3B,CAAC;AAED,SAAS,aAAa,CAAC,OAAyB;IAC/C,OAAO;QACN,OAAO,EAAE;YACR,kBAAkB,EAAE,MAAM;SAC1B;QACD,MAAM,EAAE;YACP,iCAAiC;YACjC,OAAO,EAAE,OAAO,CAAC,OAAO;YACxB,SAAS,EAAE,OAAO,CAAC,SAAS;YAC5B,gBAAgB,EAAE,OAAO,CAAC,gBAAgB;YAC1C,kBAAkB,EAAE,OAAO,CAAC,kBAAkB;YAC9C,WAAW,EAAE,OAAO,CAAC,WAAW;YAChC,aAAa,EAAE,OAAO,CAAC,aAAa;YAEpC,SAAS,EAAE,OAAO,CAAC,SAAS;YAC5B,WAAW,EAAE,OAAO,CAAC,WAAW;YAChC,kBAAkB,EAAE,OAAO,CAAC,kBAAkB;YAC9C,oBAAoB,EAAE,OAAO,CAAC,oBAAoB;YAClD,cAAc,EAAE,OAAO,CAAC,cAAc;YAEtC,OAAO,EAAE,OAAO,CAAC,OAAO;YACxB,SAAS,EAAE,OAAO,CAAC,SAAS;YAC5B,gBAAgB,EAAE,OAAO,CAAC,gBAAgB;YAC1C,kBAAkB,EAAE,OAAO,CAAC,kBAAkB;YAC9C,cAAc,EAAE,OAAO,CAAC,cAAc;YACtC,WAAW,EAAE,OAAO,CAAC,WAAW;YAChC,YAAY,EAAE,OAAO,CAAC,YAAY;YAElC,KAAK,EAAE,OAAO,CAAC,KAAK;YACpB,OAAO,EAAE,OAAO,CAAC,OAAO;YACxB,UAAU,EAAE,OAAO,CAAC,UAAU;YAE9B,OAAO,EAAE,OAAO,CAAC,OAAO;YACxB,SAAS,EAAE,OAAO,CAAC,SAAS;YAC5B,cAAc,EAAE,OAAO,CAAC,cAAc;YACtC,gBAAgB,EAAE,OAAO,CAAC,gBAAgB;YAC1C,gBAAgB,EAAE,OAAO,CAAC,gBAAgB;YAC1C,oBAAoB,EAAE,OAAO,CAAC,oBAAoB;YAElD,UAAU,EAAE,OAAO,CAAC,UAAU;YAC9B,YAAY,EAAE,OAAO,CAAC,YAAY;YAElC,OAAO,EAAE,OAAO,CAAC,OAAO;YACxB,cAAc,EAAE,OAAO,CAAC,cAAc;YAEtC,MAAM,EAAE,OAAO,CAAC,MAAM;YACtB,WAAW,EAAE,OAAO,CAAC,WAAW;YAChC,aAAa,EAAE,OAAO,CAAC,aAAa;YACpC,YAAY,EAAE,OAAO,CAAC,YAAY;YAClC,WAAW,EAAE,OAAO,CAAC,WAAW;YAEhC,KAAK,EAAE,OAAO,CAAC,KAAK;YACpB,UAAU,EAAE,OAAO,CAAC,UAAU;YAC9B,MAAM,EAAE,OAAO,CAAC,MAAM;YAEtB,SAAS,EAAE,OAAO,CAAC,SAAS;YAC5B,WAAW,EAAE,OAAO,CAAC,WAAW;YAChC,QAAQ,EAAE,OAAO,CAAC,QAAQ;YAC1B,UAAU,EAAE,OAAO,CAAC,UAAU;YAE9B,eAAe,EAAE,OAAO,CAAC,eAAe;YACxC,YAAY,EAAE,OAAO,CAAC,YAAY;YAClC,gBAAgB,EAAE,OAAO,CAAC,gBAAgB;YAC1C,UAAU,EAAE,OAAO,CAAC,UAAU;YAC9B,cAAc,EAAE,OAAO,CAAC,cAAc;YACtC,QAAQ,EAAE,OAAO,CAAC,QAAQ;YAC1B,aAAa,EAAE,OAAO,CAAC,aAAa;YACpC,UAAU,EAAE,OAAO,CAAC,UAAU;YAC9B,eAAe,EAAE,OAAO,CAAC,eAAe;YACxC,aAAa,EAAE,OAAO,CAAC,aAAa;YACpC,WAAW,EAAE,OAAO,CAAC,WAAW;YAChC,eAAe,EAAE,OAAO,CAAC,eAAe;YAExC,aAAa,EAAE,OAAO,CAAC,aAAa;YACpC,cAAc,EAAE,OAAO,CAAC,cAAc;YACtC,aAAa,EAAE,OAAO,CAAC,aAAa;YACpC,cAAc,EAAE,OAAO,CAAC,cAAc;YACtC,aAAa,EAAE,OAAO,CAAC,aAAa;YACpC,cAAc,EAAE,OAAO,CAAC,cAAc;YACtC,aAAa,EAAE,OAAO,CAAC,aAAa;YACpC,cAAc,EAAE,OAAO,CAAC,cAAc;YAEtC,cAAc,EAAE,OAAO,CAAC,cAAc;YACtC,WAAW,EAAE,OAAO,CAAC,WAAW;YAChC,WAAW,EAAE,OAAO,CAAC,WAAW;YAChC,WAAW,EAAE,OAAO,CAAC,WAAW;YAEhC,qDAAqD;YACrD,UAAU,EAAE,OAAO,CAAC,UAAU;YAC9B,aAAa,EAAE,OAAO,CAAC,aAAa;YACpC,UAAU,EAAE,OAAO,CAAC,UAAU;YAC9B,gBAAgB,EAAE,OAAO,CAAC,gBAAgB;YAE1C,iEAAiE;YACjE,YAAY,EAAE,OAAO,CAAC,gBAAgB;YACtC,aAAa,EAAE,OAAO,CAAC,UAAU;YACjC,yBAAyB,EAAE,OAAO,CAAC,UAAU;YAC7C,qBAAqB,EAAE,OAAO,CAAC,UAAU;YACzC,IAAI,EAAE,OAAO,CAAC,SAAS;SACvB;QACD,OAAO,EAAE;YACR,iBAAiB,EAAE,EAAY;SAC/B;QACD,OAAO;KACE,CAAC;AACZ,CAAC;AAED,8CAA8C;AAC9C,MAAM,UAAU,UAAU,CAAC,IAAsB;IAChD,OAAO,aAAa,CAAC,IAAI,KAAK,MAAM,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC;AACpE,CAAC;AAED,kEAAkE;AAClE,MAAM,CAAC,MAAM,KAAK,GAAG,UAAU,CAAC,OAAO,CAAC,CAAC"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "kang-components",
3
- "version": "0.4.0",
4
- "description": "Generic, domain-free React UI primitives (CSS-first press feedback, delayed-action hook, spring presets, cross-fading text).",
3
+ "version": "0.6.0",
4
+ "description": "Generic, domain-free React UI primitives (CSS-first press feedback, delayed-action hook, spring presets, cross-fading text, circle icon button).",
5
5
  "type": "module",
6
6
  "license": "MIT",
7
7
  "repository": {
@@ -23,6 +23,8 @@
23
23
  "sideEffects": false,
24
24
  "scripts": {
25
25
  "build": "tsc -p tsconfig.build.json",
26
+ "test": "vitest run",
27
+ "test:watch": "vitest",
26
28
  "prepublishOnly": "npm run build"
27
29
  },
28
30
  "peerDependencies": {
@@ -43,9 +45,16 @@
43
45
  },
44
46
  "devDependencies": {
45
47
  "@react-spring/web": "^9.7.5",
48
+ "@testing-library/jest-dom": "^6.6.3",
49
+ "@testing-library/react": "^16.1.0",
46
50
  "@types/react": "^18.3.18",
51
+ "@types/react-dom": "^18.3.5",
52
+ "@vitejs/plugin-react": "^4.3.4",
53
+ "jsdom": "^25.0.1",
47
54
  "react": "^18.3.1",
55
+ "react-dom": "^18.3.1",
48
56
  "styled-components": "^6.1.16",
49
- "typescript": "~5.6.2"
57
+ "typescript": "~5.6.2",
58
+ "vitest": "^2.1.8"
50
59
  }
51
60
  }