@kakadu/components 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/atom-B-bW2QKm.js +1 -0
- package/build/atom-CqxGy6PS.mjs +12 -0
- package/build/atom.d.ts +2 -0
- package/build/atom.js +1 -0
- package/build/atom.mjs +5 -0
- package/build/box-C72tT5hd.js +1 -0
- package/build/box-DQbqyewI.mjs +13 -0
- package/build/box.d.ts +1 -0
- package/build/box.js +1 -0
- package/build/box.mjs +4 -0
- package/build/components/atom.d.ts +10 -0
- package/build/components/box.d.ts +4 -0
- package/build/components/flex.d.ts +6 -0
- package/build/components/gauge.d.ts +6 -0
- package/build/components/skeleton.d.ts +13 -0
- package/build/components/spinner.d.ts +5 -0
- package/build/components/text.d.ts +7 -0
- package/build/components.css +1 -0
- package/build/flex-Czl688kn.js +1 -0
- package/build/flex-a_d7XX18.mjs +15 -0
- package/build/flex.d.ts +2 -0
- package/build/flex.js +1 -0
- package/build/flex.mjs +4 -0
- package/build/gauge-DHIuVOGi.mjs +41 -0
- package/build/gauge-Y0dT3vhB.js +1 -0
- package/build/gauge.d.ts +2 -0
- package/build/gauge.js +1 -0
- package/build/gauge.mjs +4 -0
- package/build/index.d.ts +11 -0
- package/build/index.js +1 -0
- package/build/index.mjs +26 -0
- package/build/jsx-runtime-B4hRZ52C.mjs +282 -0
- package/build/jsx-runtime-BB_1_6y_.js +22 -0
- package/build/skeleton-BL8lC2O4.js +1 -0
- package/build/skeleton-CWUXsrG6.mjs +48 -0
- package/build/skeleton.d.ts +1 -0
- package/build/skeleton.js +1 -0
- package/build/skeleton.mjs +5 -0
- package/build/spinner-Bal8iQ21.mjs +14 -0
- package/build/spinner-DQcSzoeb.js +1 -0
- package/build/spinner.d.ts +1 -0
- package/build/spinner.js +1 -0
- package/build/spinner.mjs +4 -0
- package/build/text-B_B-fHoN.mjs +39 -0
- package/build/text-COwGgyWJ.js +1 -0
- package/build/text.d.ts +1 -0
- package/build/text.js +1 -0
- package/build/text.mjs +7 -0
- package/build/theme.d.ts +16 -0
- package/build/theme.js +1 -0
- package/build/theme.mjs +17 -0
- package/package.json +190 -0
- package/readme.md +9 -0
- package/theme.tsx +130 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";const m=require("react"),e="div";function o({as:t,reference:r,...n}){return m.createElement(t??e,{...n,ref:r})}exports.Atom=o;exports.defaultAtomElementType=e;
|
package/build/atom.d.ts
ADDED
package/build/atom.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./atom-B-bW2QKm.js");exports.default=e.Atom;exports.defaultAtomElementType=e.defaultAtomElementType;
|
package/build/atom.mjs
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";const r=require("./jsx-runtime-BB_1_6y_.js"),o=require("@kuma-ui/core"),u=require("./atom-B-bW2QKm.js");function c({as:e,className:s,...t}){return r.jsxRuntimeExports.jsx(u.Atom,{as:e??"div",...t,className:o.cx("kuma-1846349723",s)})}exports.Box=c;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { j as s } from "./jsx-runtime-B4hRZ52C.mjs";
|
|
2
|
+
import { cx as t } from "@kuma-ui/core";
|
|
3
|
+
import { A as a } from "./atom-CqxGy6PS.mjs";
|
|
4
|
+
function e({
|
|
5
|
+
as: o,
|
|
6
|
+
className: m,
|
|
7
|
+
...r
|
|
8
|
+
}) {
|
|
9
|
+
return /* @__PURE__ */ s.jsx(a, { as: o ?? "div", ...r, className: t("kuma-1846349723", m) });
|
|
10
|
+
}
|
|
11
|
+
export {
|
|
12
|
+
e as B
|
|
13
|
+
};
|
package/build/box.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from './components/box';
|
package/build/box.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./box-C72tT5hd.js");exports.default=e.Box;
|
package/build/box.mjs
ADDED
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { type ElementType, type ComponentPropsWithoutRef, type ComponentRef, type Ref } from 'react';
|
|
2
|
+
export declare const defaultAtomElementType = "div";
|
|
3
|
+
export type AtomElementType = ElementType;
|
|
4
|
+
export type DefaultAtomElementType = typeof defaultAtomElementType;
|
|
5
|
+
export type AtomProperties<Type extends ElementType = DefaultAtomElementType> = ComponentPropsWithoutRef<Type> & {
|
|
6
|
+
readonly as?: Type;
|
|
7
|
+
readonly reference?: Ref<ComponentRef<Type>>;
|
|
8
|
+
readonly className?: string;
|
|
9
|
+
};
|
|
10
|
+
export default function Atom<Type extends ElementType = DefaultAtomElementType>({ as, reference, ...properties }: AtomProperties<Type>): import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { type AtomElementType, type AtomProperties } from './atom';
|
|
2
|
+
type BoxProperties<Type extends AtomElementType = 'div'> = AtomProperties<Type>;
|
|
3
|
+
export default function Box<Type extends AtomElementType = 'div'>({ as, className, ...properties }: BoxProperties<Type>): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
export {};
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { type AtomElementType, type AtomProperties, type DefaultAtomElementType } from './atom';
|
|
2
|
+
export type FlexProperties<Type extends AtomElementType = DefaultAtomElementType> = AtomProperties<Type> & {
|
|
3
|
+
readonly direction?: 'row' | 'column';
|
|
4
|
+
readonly gap?: 0.25 | 0.375 | 0.5 | 1 | 1.5 | 2;
|
|
5
|
+
};
|
|
6
|
+
export default function Flex<Type extends AtomElementType = DefaultAtomElementType>({ as, direction, gap, className, ...properties }: FlexProperties<Type>): import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { type HTMLAttributes } from 'react';
|
|
2
|
+
type SkeletonProperties = {
|
|
3
|
+
readonly width?: string | number;
|
|
4
|
+
readonly height?: string | number;
|
|
5
|
+
readonly className?: string;
|
|
6
|
+
readonly isAnimated?: boolean;
|
|
7
|
+
} & HTMLAttributes<HTMLDivElement>;
|
|
8
|
+
export declare function SkeletonInstance({ width, height, className, children, isAnimated, ...parameters }: SkeletonProperties): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export default function Skeleton({ lines, isAnimated, }: {
|
|
10
|
+
readonly lines?: number;
|
|
11
|
+
readonly isAnimated?: boolean;
|
|
12
|
+
}): import("react/jsx-runtime").JSX.Element | null;
|
|
13
|
+
export {};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { type ElementType } from 'react';
|
|
2
|
+
import { type AtomProperties } from './atom';
|
|
3
|
+
export declare function Heading<Type extends ElementType = 'h1'>({ as, className, ...properties }: AtomProperties<Type>): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
export declare const spanStyles: string;
|
|
5
|
+
export declare function Paragraph<Type extends ElementType = 'p'>({ as, className, ...properties }: AtomProperties<Type>): import("react/jsx-runtime").JSX.Element;
|
|
6
|
+
export declare function Span<Type extends ElementType = 'span'>({ as, className, ...properties }: AtomProperties<Type>): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export default function Text<Type extends ElementType = 'div'>({ as, className, ...properties }: AtomProperties<Type>): import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.kuma-1846349723{background:#fefefe;padding:var(--gap);box-shadow:inset 0 0 0 1px #0003,inset 0 0 0 2px #ffffffbf,inset 0 4px #00000006,0 0 2px 1px #ffffff80,0 1px 1px #00000008,0 3px #00000008;border-radius:12px}.kuma-1168981339{display:flex}.kuma-2635417128{flex-direction:column}.kuma-2276234075{gap:var(--quarter-gap)}.kuma-739568937{gap:var(--third-gap)}.kuma-3438335458{gap:var(--half-gap)}.kuma-3993051137{gap:var(--gap)}.kuma-4186556816{gap:var(--sesquialteral-gap)}.kuma-1435205015{gap:var(--double-gap)}.kuma-3997436555{--background-color:#fafcff;--foreground-color:#000;--blue-color:#2f455d;--blue-dark-color:#32445b;--blue-hover-color:#345882;--blue-light-color:#b3c0d4;--blue-pale-color:#e1efff;--green-color:#4ca486;--green-pale-color:#dceeec;--green-dark-color:#3c6957;--grey-color:#c6c6c6;--grey-pale-color:#dfdfdf;--red-color:#ff4d4d;--red-pale-color:#ffe5e5;--red-pale-hover-color:#ffd6d6;--yellow-color:#f5c235;--yellow-dark-color:#9f7605;--flash-color:rgba(255, 216, 57, .5);--font-weight-modifier:50;--accent-font-family:"Frank Ruhl Libre",serif;--font-family:"Inter",-apple-system,helvetica,arial,sans-serif;--gap:16px;--quarter-gap:calc(var(--gap) / 4);--third-gap:calc(var(--gap) / 3);--half-gap:calc(var(--gap) / 2);--sesquialteral-gap:calc(var(--gap) * 1.5);--double-gap:calc(var(--gap) * 2);--triple-gap:calc(var(--gap) * 3);--quadruple-gap:calc(var(--gap) * 4);--sidebar-z-index:424242;--modal-z-index:424243;font-family:var(--font-family);font-optical-sizing:auto;line-height:normal;color:var(--foreground-color);--8px:.5rem;--9px:.5625rem;--10px:.625rem;--11px:.6875rem;--12px:.75rem;--13px:.8125rem;--14px:.875rem;--15px:.9375rem;--16px:1rem;--17px:1.0625rem;--18px:1.125rem;--19px:1.1875rem;--20px:1.25rem;--21px:1.3125rem;--22px:1.375rem;--23px:1.4375rem;--24px:1.5rem;--25px:1.5625rem;--26px:1.625rem;--27px:1.6875rem;--28px:1.75rem;--29px:1.8125rem;--30px:1.875rem;--31px:1.9375rem;--32px:2rem;--33px:2.0625rem;--34px:2.125rem;--35px:2.1875rem;--36px:2.25rem;--37px:2.3125rem;--38px:2.375rem;--39px:2.4375rem;--40px:2.5rem;--41px:2.5625rem;--42px:2.625rem;--43px:2.6875rem;--44px:2.75rem;--45px:2.8125rem;--46px:2.875rem;--47px:2.9375rem;--48px:3rem}.kuma-3997436555 :where([data-theme=dark]){--font-weight-modifier:0}.kuma-4178476647{overflow-wrap:anywhere;-webkit-hyphens:auto;hyphens:auto}.kuma-216224454{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;text-align:left;border:0;margin:0;padding:0;cursor:pointer}[dir=rtl] .kuma-216224454{text-align:right}.kuma-2934642132{font-family:var(--accent-font-family);font-size:var(--37px);font-weight:650;padding:0;margin:0}.kuma-1010422083{font-family:var(--font-family);font-size:var(--16px)}.kuma-1010422083 b{font-weight:500}.kuma-1010422083 strong{font-weight:600}.kuma-1010422083 a{color:var(--green-dark-color);text-decoration:underline}@media(hover:hover){.kuma-1010422083 a:hover{text-decoration:none}}.kuma-2351087175{font-size:var(--18px);font-weight:425;line-height:1.5em;padding:0;margin:0}.kuma-2351087175 ol{margin:0;margin-top:var(--gap);padding:0;list-style-position:inside}.kuma-2351087175 li::marker{font-weight:600}.kuma-2351087175 pre{background:#00000006;font-size:var(--12px);line-height:1.5em;color:#000;margin:0;white-space:pre-wrap;overflow:auto;padding:var(--gap);border-radius:var(--half-gap);box-sizing:border-box;margin:var(--gap) 0;box-shadow:inset 0 0 0 1px #0003}.kuma-2608978433{max-width:720px;text-wrap:pretty}.kuma-2608978433 h1:has(+p:last-child){font-size:var(--32px)}.kuma-2608978433 h1+:is(p,ul){margin-top:.75em}.kuma-2608978433 h1+:is(p,ul):last-child{margin-top:.25em}.kuma-2608978433 h1+p:has(+p){font-size:var(--22px);font-weight:275;line-height:1.3em;opacity:.75}.kuma-2608978433 h1+p:has(+p)+p{margin-top:1.25em}.kuma-2608978433 p+:is(p){margin-top:.75em}.kuma-361702174{--size:80px;--thickness:13px;--font-size:var(--25px);--font-weight:600;--offset:2px;--highlight-color:rgba(255, 255, 255, .2);--shadow-color:rgba(0, 0, 0, .1);--hard-shadow-offset:4px;--hard-shadow-color:rgba(0, 0, 0, .05);background:#f9f9f9;width:var(--size);height:var(--size);box-shadow:0 1px 0 var(--shadow-color),0 var(--hard-shadow-offset) 0 var(--hard-shadow-color),inset 0 1px 0 var(--shadow-color),inset 0 2px 0 var(--highlight-color);border-radius:var(--size);position:relative;display:flex;align-items:center;justify-content:center}.kuma-3162945807{--size:60px;--thickness:11px;--font-size:var(--18px);--font-weight:600;--offset:2px}.kuma-2977513648{--size:100px;--thickness:17px;--font-size:var(--32px);--offset:3px}.kuma-707327569{background:var(--start-color);width:var(--thickness);height:var(--thickness);border-radius:var(--thickness);position:absolute;top:50%;left:0;transform:translateY(-50%);box-shadow:0 1px 0 var(--shadow-color),0 var(--hard-shadow-offset) 0 var(--hard-shadow-color),inset 0 0 0 1px var(--shadow-color),0 0 2px #fff3}.kuma-3185646656{width:100%;height:100%;background:conic-gradient(from -90deg,var(--gradient));-webkit-mask-image:conic-gradient(from -90deg,#000 0%,#000 var(--percentage),transparent var(--percentage),transparent 100%);mask-image:conic-gradient(from -90deg,#000 0%,#000 var(--percentage),transparent var(--percentage),transparent 100%);border-radius:var(--size);box-shadow:0 1px 0 var(--shadow-color),0 var(--hard-shadow-offset) 0 var(--hard-shadow-color),inset 0 4px #ffffff26,inset 0 0 0 1px var(--shadow-color)}.kuma-257978560{--inner-size:calc(var(--size) - (var(--thickness) * 2));background:#0000002d;width:var(--inner-size);height:var(--inner-size);border-radius:var(--inner-size);box-shadow:0 0 0 1px #00000026,0 0 2px #fff6;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.kuma-586099934{--inner-size:calc(var(--size) - var(--thickness) * 2);background:#fff;width:var(--inner-size);height:var(--inner-size);font-size:var(--font-size);font-weight:var(--font-weight);font-variant-numeric:tabular-nums;letter-spacing:-.07em;border-radius:var(--inner-size);display:flex;align-items:center;justify-content:center;box-shadow:0 1px 0 var(--shadow-color),0 2px 0 var(--highlight-color),inset 0 var(--hard-shadow-offset) 0 var(--hard-shadow-color),inset 0 1px 0 var(--shadow-color);position:absolute}.kuma-967240013{--dial-size:calc(var(--thickness) + (var(--offset) * 2));--radius:calc((var(--size) / 2) - var(--offset));--angle:calc(-180deg + (var(--percentage-factor) * 360deg));background:#fff;width:var(--dial-size);height:var(--dial-size);border-radius:var(--dial-size);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(var(--angle)) translate(calc(var(--radius) - (var(--offset) * 2))) rotate(calc(var(--angle) * -1));box-shadow:0 1px 0 var(--shadow-color),0 var(--hard-shadow-offset) 0 var(--hard-shadow-color),0 0 1px #00000080}.kuma-3225063030{--dial-cutout-size:calc(var(--dial-size) / 2.25);background:var(--end-color);width:var(--dial-cutout-size);height:var(--dial-cutout-size);border-radius:var(--dial-cutout-size);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:inset 0 0 0 1px var(--shadow-color),inset 0 var(--hard-shadow-offset) 0 0 var(--hard-shadow-color)}.kuma-3027005914{--background-size:300px;--background-negative-size:calc(var(--background-size) * -1);--highlight-color:255,255,255;--border-radius:100px;background:#00000026;width:var(--skeleton-size, 100%);height:var(--skeleton-size);border-radius:var(--border-radius);display:inline-block;vertical-align:top;position:relative}@keyframes skeleton-animation{0%{background-position:var(--background-negative-size) 0%}to{background-position:right var(--background-negative-size) top 0%}}.kuma-3311350973{--opacity:.3}.kuma-3311350973:before{content:"";mix-blend-mode:overlay;background-position:var(--background-negative-size) 0%;background-attachment:fixed;background-size:var(--background-size) 100%;background-repeat:no-repeat;background-image:linear-gradient(90deg,rgba(var(--highlight-color),0),rgba(var(--highlight-color),var(--opacity)),rgba(var(--highlight-color),0));animation:skeleton-animation 1.1s infinite ease-in-out;will-change:background-position;position:absolute;top:0;left:0;width:100%;height:100%;border-radius:var(--border-radius)}.kuma-3140855657{vertical-align:middle}.kuma-2940817552{display:inline-block;vertical-align:top}.kuma-2073235239{animation:loading-spinner .97s linear infinite}@keyframes loading-spinner{0%{transform:rotate(0)}to{transform:rotate(359.999deg)}}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";const o=require("./jsx-runtime-BB_1_6y_.js"),r=require("@kuma-ui/core"),e=require("./atom-B-bW2QKm.js");function c({as:m,direction:t="column",gap:u=1,className:s,...n}){return o.jsxRuntimeExports.jsx(e.Atom,{as:m??e.defaultAtomElementType,...n,className:r.cx("kuma-1168981339",t==="column"&&"kuma-2635417128",u===.25&&"kuma-2276234075",u===.375&&"kuma-739568937",u===.5&&"kuma-3438335458",u===1&&"kuma-3993051137",u===1.5&&"kuma-4186556816",u===2&&"kuma-1435205015",s)})}exports.Flex=c;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { j as r } from "./jsx-runtime-B4hRZ52C.mjs";
|
|
2
|
+
import { cx as s } from "@kuma-ui/core";
|
|
3
|
+
import { A as e, d as k } from "./atom-CqxGy6PS.mjs";
|
|
4
|
+
function c({
|
|
5
|
+
as: u,
|
|
6
|
+
direction: o = "column",
|
|
7
|
+
gap: m = 1,
|
|
8
|
+
className: t,
|
|
9
|
+
...a
|
|
10
|
+
}) {
|
|
11
|
+
return /* @__PURE__ */ r.jsx(e, { as: u ?? k, ...a, className: s("kuma-1168981339", o === "column" && "kuma-2635417128", m === 0.25 && "kuma-2276234075", m === 0.375 && "kuma-739568937", m === 0.5 && "kuma-3438335458", m === 1 && "kuma-3993051137", m === 1.5 && "kuma-4186556816", m === 2 && "kuma-1435205015", t) });
|
|
12
|
+
}
|
|
13
|
+
export {
|
|
14
|
+
c as F
|
|
15
|
+
};
|
package/build/flex.d.ts
ADDED
package/build/flex.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./flex-Czl688kn.js");exports.default=e.Flex;
|
package/build/flex.mjs
ADDED
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import { j as s } from "./jsx-runtime-B4hRZ52C.mjs";
|
|
2
|
+
import { useMemo as e } from "react";
|
|
3
|
+
import { cx as E } from "@kuma-ui/core";
|
|
4
|
+
const c = {
|
|
5
|
+
/* eslint-disable @typescript-eslint/naming-convention */
|
|
6
|
+
0: ["#D60D43"],
|
|
7
|
+
15: ["#D60D43", "#FFCD45"],
|
|
8
|
+
30: ["#D6460D", "#ffda54"],
|
|
9
|
+
50: ["#D6860D", "#F1DC3B", "#CEE838"],
|
|
10
|
+
65: ["#D6BE0D", "#FFD045", "#6DE838"],
|
|
11
|
+
80: ["#D9E838", "#93E838", "#3EE838"],
|
|
12
|
+
100: ["#55EB62", "#38E99A", "#5EEA52"]
|
|
13
|
+
/* eslint-enable @typescript-eslint/naming-convention */
|
|
14
|
+
}, f = Object.keys(c).map((o) => Number.parseInt(o, 10)).sort((o, t) => t - o);
|
|
15
|
+
function h({
|
|
16
|
+
label: o,
|
|
17
|
+
size: t,
|
|
18
|
+
percentage: l = 0
|
|
19
|
+
}) {
|
|
20
|
+
const a = e(() => Math.max(0, Math.min(100, l)), [l]), u = e(() => a / 100, [a]), r = e(() => {
|
|
21
|
+
for (const n of f)
|
|
22
|
+
if (a >= n)
|
|
23
|
+
return c[n];
|
|
24
|
+
return [];
|
|
25
|
+
}, [a]), m = e(() => r.length, [r]), i = e(() => r.at(0), [r]), d = e(() => r.at(-1), [r]), D = e(() => r.map((n, x) => `${n} ${Math.round(x / m * 100)}%`).join(", "), [r, m]);
|
|
26
|
+
return /* @__PURE__ */ s.jsxs("div", { style: {
|
|
27
|
+
"--percentage": `${a}%`,
|
|
28
|
+
"--percentage-factor": u,
|
|
29
|
+
"--gradient": D,
|
|
30
|
+
"--start-color": i,
|
|
31
|
+
"--end-color": d
|
|
32
|
+
}, role: "meter", "aria-valuenow": a, "aria-valuemin": 0, "aria-valuemax": 100, "aria-label": o, className: E("kuma-361702174", t === "small" && "kuma-3162945807", t === "large" && "kuma-2977513648"), children: [
|
|
33
|
+
a > 0 ? /* @__PURE__ */ s.jsx("div", { className: "kuma-707327569" }) : null,
|
|
34
|
+
/* @__PURE__ */ s.jsx("div", { className: "kuma-3185646656", children: /* @__PURE__ */ s.jsx("div", { className: "kuma-257978560" }) }),
|
|
35
|
+
/* @__PURE__ */ s.jsx("div", { className: "kuma-586099934", children: a }),
|
|
36
|
+
a > 0 && a < 100 ? /* @__PURE__ */ s.jsx("div", { className: "kuma-967240013", children: /* @__PURE__ */ s.jsx("div", { className: "kuma-3225063030" }) }) : null
|
|
37
|
+
] });
|
|
38
|
+
}
|
|
39
|
+
export {
|
|
40
|
+
h as G
|
|
41
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";const r=require("./jsx-runtime-BB_1_6y_.js"),t=require("react"),j=require("@kuma-ui/core"),c={0:["#D60D43"],15:["#D60D43","#FFCD45"],30:["#D6460D","#ffda54"],50:["#D6860D","#F1DC3B","#CEE838"],65:["#D6BE0D","#FFD045","#6DE838"],80:["#D9E838","#93E838","#3EE838"],100:["#55EB62","#38E99A","#5EEA52"]},D=Object.keys(c).map(a=>Number.parseInt(a,10)).sort((a,o)=>o-a);function k({label:a,size:o,percentage:u=0}){const e=t.useMemo(()=>Math.max(0,Math.min(100,u)),[u]),i=t.useMemo(()=>e/100,[e]),s=t.useMemo(()=>{for(const n of D)if(e>=n)return c[n];return[]},[e]),m=t.useMemo(()=>s.length,[s]),l=t.useMemo(()=>s.at(0),[s]),x=t.useMemo(()=>s.at(-1),[s]),E=t.useMemo(()=>s.map((n,d)=>`${n} ${Math.round(d/m*100)}%`).join(", "),[s,m]);return r.jsxRuntimeExports.jsxs("div",{style:{"--percentage":`${e}%`,"--percentage-factor":i,"--gradient":E,"--start-color":l,"--end-color":x},role:"meter","aria-valuenow":e,"aria-valuemin":0,"aria-valuemax":100,"aria-label":a,className:j.cx("kuma-361702174",o==="small"&&"kuma-3162945807",o==="large"&&"kuma-2977513648"),children:[e>0?r.jsxRuntimeExports.jsx("div",{className:"kuma-707327569"}):null,r.jsxRuntimeExports.jsx("div",{className:"kuma-3185646656",children:r.jsxRuntimeExports.jsx("div",{className:"kuma-257978560"})}),r.jsxRuntimeExports.jsx("div",{className:"kuma-586099934",children:e}),e>0&&e<100?r.jsxRuntimeExports.jsx("div",{className:"kuma-967240013",children:r.jsxRuntimeExports.jsx("div",{className:"kuma-3225063030"})}):null]})}exports.Gauge=k;
|
package/build/gauge.d.ts
ADDED
package/build/gauge.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./gauge-Y0dT3vhB.js");exports.default=e.Gauge;
|
package/build/gauge.mjs
ADDED
package/build/index.d.ts
ADDED
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
export { default as Atom, defaultAtomElementType } from './components/atom';
|
|
2
|
+
export type { AtomProperties, DefaultAtomElementType } from './components/atom';
|
|
3
|
+
export { default as Box } from './components/box';
|
|
4
|
+
export { default as Flex } from './components/flex';
|
|
5
|
+
export type { FlexProperties } from './components/flex';
|
|
6
|
+
export { default as Text, Heading, Paragraph, Span } from './components/text';
|
|
7
|
+
export { default as Gauge } from './components/gauge';
|
|
8
|
+
export type { GaugeProperties } from './components/gauge';
|
|
9
|
+
export { default as Skeleton, SkeletonInstance } from './components/skeleton';
|
|
10
|
+
export { default as Spinner } from './components/spinner';
|
|
11
|
+
export { default as theme, greenColor, overflowProtectionStyles, buttonResetStyles, } from './theme';
|
package/build/index.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./atom-B-bW2QKm.js"),r=require("./box-C72tT5hd.js"),l=require("./flex-Czl688kn.js"),e=require("./text-COwGgyWJ.js"),a=require("./gauge-Y0dT3vhB.js"),n=require("./skeleton-BL8lC2O4.js"),s=require("./spinner-DQcSzoeb.js"),t=require("./theme.js");exports.Atom=o.Atom;exports.defaultAtomElementType=o.defaultAtomElementType;exports.Box=r.Box;exports.Flex=l.Flex;exports.Heading=e.Heading;exports.Paragraph=e.Paragraph;exports.Span=e.Span;exports.Text=e.Text;exports.Gauge=a.Gauge;exports.Skeleton=n.Skeleton;exports.SkeletonInstance=n.SkeletonInstance;exports.Spinner=s.Spinner;exports.buttonResetStyles=t.buttonResetStyles;exports.greenColor=t.greenColor;exports.overflowProtectionStyles=t.overflowProtectionStyles;exports.theme=t.default;
|
package/build/index.mjs
ADDED
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { A as t, d as a } from "./atom-CqxGy6PS.mjs";
|
|
2
|
+
import { B as s } from "./box-DQbqyewI.mjs";
|
|
3
|
+
import { F as n } from "./flex-a_d7XX18.mjs";
|
|
4
|
+
import { H as f, P as x, S as l, T as S } from "./text-B_B-fHoN.mjs";
|
|
5
|
+
import { G as g } from "./gauge-DHIuVOGi.mjs";
|
|
6
|
+
import { S as i, a as y } from "./skeleton-CWUXsrG6.mjs";
|
|
7
|
+
import { S as P } from "./spinner-Bal8iQ21.mjs";
|
|
8
|
+
import { buttonResetStyles as c, greenColor as h, overflowProtectionStyles as k, default as B } from "./theme.mjs";
|
|
9
|
+
export {
|
|
10
|
+
t as Atom,
|
|
11
|
+
s as Box,
|
|
12
|
+
n as Flex,
|
|
13
|
+
g as Gauge,
|
|
14
|
+
f as Heading,
|
|
15
|
+
x as Paragraph,
|
|
16
|
+
i as Skeleton,
|
|
17
|
+
y as SkeletonInstance,
|
|
18
|
+
l as Span,
|
|
19
|
+
P as Spinner,
|
|
20
|
+
S as Text,
|
|
21
|
+
c as buttonResetStyles,
|
|
22
|
+
a as defaultAtomElementType,
|
|
23
|
+
h as greenColor,
|
|
24
|
+
k as overflowProtectionStyles,
|
|
25
|
+
B as theme
|
|
26
|
+
};
|
|
@@ -0,0 +1,282 @@
|
|
|
1
|
+
import K from "react";
|
|
2
|
+
var v = { exports: {} }, m = {};
|
|
3
|
+
/**
|
|
4
|
+
* @license React
|
|
5
|
+
* react-jsx-runtime.production.js
|
|
6
|
+
*
|
|
7
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
8
|
+
*
|
|
9
|
+
* This source code is licensed under the MIT license found in the
|
|
10
|
+
* LICENSE file in the root directory of this source tree.
|
|
11
|
+
*/
|
|
12
|
+
var $;
|
|
13
|
+
function ee() {
|
|
14
|
+
if ($) return m;
|
|
15
|
+
$ = 1;
|
|
16
|
+
var u = Symbol.for("react.transitional.element"), E = Symbol.for("react.fragment");
|
|
17
|
+
function c(i, o, s) {
|
|
18
|
+
var f = null;
|
|
19
|
+
if (s !== void 0 && (f = "" + s), o.key !== void 0 && (f = "" + o.key), "key" in o) {
|
|
20
|
+
s = {};
|
|
21
|
+
for (var d in o)
|
|
22
|
+
d !== "key" && (s[d] = o[d]);
|
|
23
|
+
} else s = o;
|
|
24
|
+
return o = s.ref, {
|
|
25
|
+
$$typeof: u,
|
|
26
|
+
type: i,
|
|
27
|
+
key: f,
|
|
28
|
+
ref: o !== void 0 ? o : null,
|
|
29
|
+
props: s
|
|
30
|
+
};
|
|
31
|
+
}
|
|
32
|
+
return m.Fragment = E, m.jsx = c, m.jsxs = c, m;
|
|
33
|
+
}
|
|
34
|
+
var _ = {};
|
|
35
|
+
/**
|
|
36
|
+
* @license React
|
|
37
|
+
* react-jsx-runtime.development.js
|
|
38
|
+
*
|
|
39
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
40
|
+
*
|
|
41
|
+
* This source code is licensed under the MIT license found in the
|
|
42
|
+
* LICENSE file in the root directory of this source tree.
|
|
43
|
+
*/
|
|
44
|
+
var I;
|
|
45
|
+
function re() {
|
|
46
|
+
return I || (I = 1, process.env.NODE_ENV !== "production" && (function() {
|
|
47
|
+
function u(e) {
|
|
48
|
+
if (e == null) return null;
|
|
49
|
+
if (typeof e == "function")
|
|
50
|
+
return e.$$typeof === H ? null : e.displayName || e.name || null;
|
|
51
|
+
if (typeof e == "string") return e;
|
|
52
|
+
switch (e) {
|
|
53
|
+
case p:
|
|
54
|
+
return "Fragment";
|
|
55
|
+
case U:
|
|
56
|
+
return "Profiler";
|
|
57
|
+
case W:
|
|
58
|
+
return "StrictMode";
|
|
59
|
+
case z:
|
|
60
|
+
return "Suspense";
|
|
61
|
+
case G:
|
|
62
|
+
return "SuspenseList";
|
|
63
|
+
case B:
|
|
64
|
+
return "Activity";
|
|
65
|
+
}
|
|
66
|
+
if (typeof e == "object")
|
|
67
|
+
switch (typeof e.tag == "number" && console.error(
|
|
68
|
+
"Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
|
|
69
|
+
), e.$$typeof) {
|
|
70
|
+
case M:
|
|
71
|
+
return "Portal";
|
|
72
|
+
case J:
|
|
73
|
+
return e.displayName || "Context";
|
|
74
|
+
case q:
|
|
75
|
+
return (e._context.displayName || "Context") + ".Consumer";
|
|
76
|
+
case V:
|
|
77
|
+
var r = e.render;
|
|
78
|
+
return e = e.displayName, e || (e = r.displayName || r.name || "", e = e !== "" ? "ForwardRef(" + e + ")" : "ForwardRef"), e;
|
|
79
|
+
case X:
|
|
80
|
+
return r = e.displayName || null, r !== null ? r : u(e.type) || "Memo";
|
|
81
|
+
case T:
|
|
82
|
+
r = e._payload, e = e._init;
|
|
83
|
+
try {
|
|
84
|
+
return u(e(r));
|
|
85
|
+
} catch {
|
|
86
|
+
}
|
|
87
|
+
}
|
|
88
|
+
return null;
|
|
89
|
+
}
|
|
90
|
+
function E(e) {
|
|
91
|
+
return "" + e;
|
|
92
|
+
}
|
|
93
|
+
function c(e) {
|
|
94
|
+
try {
|
|
95
|
+
E(e);
|
|
96
|
+
var r = !1;
|
|
97
|
+
} catch {
|
|
98
|
+
r = !0;
|
|
99
|
+
}
|
|
100
|
+
if (r) {
|
|
101
|
+
r = console;
|
|
102
|
+
var t = r.error, n = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object";
|
|
103
|
+
return t.call(
|
|
104
|
+
r,
|
|
105
|
+
"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
|
|
106
|
+
n
|
|
107
|
+
), E(e);
|
|
108
|
+
}
|
|
109
|
+
}
|
|
110
|
+
function i(e) {
|
|
111
|
+
if (e === p) return "<>";
|
|
112
|
+
if (typeof e == "object" && e !== null && e.$$typeof === T)
|
|
113
|
+
return "<...>";
|
|
114
|
+
try {
|
|
115
|
+
var r = u(e);
|
|
116
|
+
return r ? "<" + r + ">" : "<...>";
|
|
117
|
+
} catch {
|
|
118
|
+
return "<...>";
|
|
119
|
+
}
|
|
120
|
+
}
|
|
121
|
+
function o() {
|
|
122
|
+
var e = k.A;
|
|
123
|
+
return e === null ? null : e.getOwner();
|
|
124
|
+
}
|
|
125
|
+
function s() {
|
|
126
|
+
return Error("react-stack-top-frame");
|
|
127
|
+
}
|
|
128
|
+
function f(e) {
|
|
129
|
+
if (x.call(e, "key")) {
|
|
130
|
+
var r = Object.getOwnPropertyDescriptor(e, "key").get;
|
|
131
|
+
if (r && r.isReactWarning) return !1;
|
|
132
|
+
}
|
|
133
|
+
return e.key !== void 0;
|
|
134
|
+
}
|
|
135
|
+
function d(e, r) {
|
|
136
|
+
function t() {
|
|
137
|
+
g || (g = !0, console.error(
|
|
138
|
+
"%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
|
|
139
|
+
r
|
|
140
|
+
));
|
|
141
|
+
}
|
|
142
|
+
t.isReactWarning = !0, Object.defineProperty(e, "key", {
|
|
143
|
+
get: t,
|
|
144
|
+
configurable: !0
|
|
145
|
+
});
|
|
146
|
+
}
|
|
147
|
+
function D() {
|
|
148
|
+
var e = u(this.type);
|
|
149
|
+
return h[e] || (h[e] = !0, console.error(
|
|
150
|
+
"Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
|
|
151
|
+
)), e = this.props.ref, e !== void 0 ? e : null;
|
|
152
|
+
}
|
|
153
|
+
function L(e, r, t, n, b, A) {
|
|
154
|
+
var a = t.ref;
|
|
155
|
+
return e = {
|
|
156
|
+
$$typeof: j,
|
|
157
|
+
type: e,
|
|
158
|
+
key: r,
|
|
159
|
+
props: t,
|
|
160
|
+
_owner: n
|
|
161
|
+
}, (a !== void 0 ? a : null) !== null ? Object.defineProperty(e, "ref", {
|
|
162
|
+
enumerable: !1,
|
|
163
|
+
get: D
|
|
164
|
+
}) : Object.defineProperty(e, "ref", { enumerable: !1, value: null }), e._store = {}, Object.defineProperty(e._store, "validated", {
|
|
165
|
+
configurable: !1,
|
|
166
|
+
enumerable: !1,
|
|
167
|
+
writable: !0,
|
|
168
|
+
value: 0
|
|
169
|
+
}), Object.defineProperty(e, "_debugInfo", {
|
|
170
|
+
configurable: !1,
|
|
171
|
+
enumerable: !1,
|
|
172
|
+
writable: !0,
|
|
173
|
+
value: null
|
|
174
|
+
}), Object.defineProperty(e, "_debugStack", {
|
|
175
|
+
configurable: !1,
|
|
176
|
+
enumerable: !1,
|
|
177
|
+
writable: !0,
|
|
178
|
+
value: b
|
|
179
|
+
}), Object.defineProperty(e, "_debugTask", {
|
|
180
|
+
configurable: !1,
|
|
181
|
+
enumerable: !1,
|
|
182
|
+
writable: !0,
|
|
183
|
+
value: A
|
|
184
|
+
}), Object.freeze && (Object.freeze(e.props), Object.freeze(e)), e;
|
|
185
|
+
}
|
|
186
|
+
function P(e, r, t, n, b, A) {
|
|
187
|
+
var a = r.children;
|
|
188
|
+
if (a !== void 0)
|
|
189
|
+
if (n)
|
|
190
|
+
if (Z(a)) {
|
|
191
|
+
for (n = 0; n < a.length; n++)
|
|
192
|
+
w(a[n]);
|
|
193
|
+
Object.freeze && Object.freeze(a);
|
|
194
|
+
} else
|
|
195
|
+
console.error(
|
|
196
|
+
"React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
|
|
197
|
+
);
|
|
198
|
+
else w(a);
|
|
199
|
+
if (x.call(r, "key")) {
|
|
200
|
+
a = u(e);
|
|
201
|
+
var l = Object.keys(r).filter(function(Q) {
|
|
202
|
+
return Q !== "key";
|
|
203
|
+
});
|
|
204
|
+
n = 0 < l.length ? "{key: someKey, " + l.join(": ..., ") + ": ...}" : "{key: someKey}", Y[a + n] || (l = 0 < l.length ? "{" + l.join(": ..., ") + ": ...}" : "{}", console.error(
|
|
205
|
+
`A props object containing a "key" prop is being spread into JSX:
|
|
206
|
+
let props = %s;
|
|
207
|
+
<%s {...props} />
|
|
208
|
+
React keys must be passed directly to JSX without using spread:
|
|
209
|
+
let props = %s;
|
|
210
|
+
<%s key={someKey} {...props} />`,
|
|
211
|
+
n,
|
|
212
|
+
a,
|
|
213
|
+
l,
|
|
214
|
+
a
|
|
215
|
+
), Y[a + n] = !0);
|
|
216
|
+
}
|
|
217
|
+
if (a = null, t !== void 0 && (c(t), a = "" + t), f(r) && (c(r.key), a = "" + r.key), "key" in r) {
|
|
218
|
+
t = {};
|
|
219
|
+
for (var S in r)
|
|
220
|
+
S !== "key" && (t[S] = r[S]);
|
|
221
|
+
} else t = r;
|
|
222
|
+
return a && d(
|
|
223
|
+
t,
|
|
224
|
+
typeof e == "function" ? e.displayName || e.name || "Unknown" : e
|
|
225
|
+
), L(
|
|
226
|
+
e,
|
|
227
|
+
a,
|
|
228
|
+
t,
|
|
229
|
+
o(),
|
|
230
|
+
b,
|
|
231
|
+
A
|
|
232
|
+
);
|
|
233
|
+
}
|
|
234
|
+
function w(e) {
|
|
235
|
+
y(e) ? e._store && (e._store.validated = 1) : typeof e == "object" && e !== null && e.$$typeof === T && (e._payload.status === "fulfilled" ? y(e._payload.value) && e._payload.value._store && (e._payload.value._store.validated = 1) : e._store && (e._store.validated = 1));
|
|
236
|
+
}
|
|
237
|
+
function y(e) {
|
|
238
|
+
return typeof e == "object" && e !== null && e.$$typeof === j;
|
|
239
|
+
}
|
|
240
|
+
var R = K, j = Symbol.for("react.transitional.element"), M = Symbol.for("react.portal"), p = Symbol.for("react.fragment"), W = Symbol.for("react.strict_mode"), U = Symbol.for("react.profiler"), q = Symbol.for("react.consumer"), J = Symbol.for("react.context"), V = Symbol.for("react.forward_ref"), z = Symbol.for("react.suspense"), G = Symbol.for("react.suspense_list"), X = Symbol.for("react.memo"), T = Symbol.for("react.lazy"), B = Symbol.for("react.activity"), H = Symbol.for("react.client.reference"), k = R.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, x = Object.prototype.hasOwnProperty, Z = Array.isArray, O = console.createTask ? console.createTask : function() {
|
|
241
|
+
return null;
|
|
242
|
+
};
|
|
243
|
+
R = {
|
|
244
|
+
react_stack_bottom_frame: function(e) {
|
|
245
|
+
return e();
|
|
246
|
+
}
|
|
247
|
+
};
|
|
248
|
+
var g, h = {}, N = R.react_stack_bottom_frame.bind(
|
|
249
|
+
R,
|
|
250
|
+
s
|
|
251
|
+
)(), C = O(i(s)), Y = {};
|
|
252
|
+
_.Fragment = p, _.jsx = function(e, r, t) {
|
|
253
|
+
var n = 1e4 > k.recentlyCreatedOwnerStacks++;
|
|
254
|
+
return P(
|
|
255
|
+
e,
|
|
256
|
+
r,
|
|
257
|
+
t,
|
|
258
|
+
!1,
|
|
259
|
+
n ? Error("react-stack-top-frame") : N,
|
|
260
|
+
n ? O(i(e)) : C
|
|
261
|
+
);
|
|
262
|
+
}, _.jsxs = function(e, r, t) {
|
|
263
|
+
var n = 1e4 > k.recentlyCreatedOwnerStacks++;
|
|
264
|
+
return P(
|
|
265
|
+
e,
|
|
266
|
+
r,
|
|
267
|
+
t,
|
|
268
|
+
!0,
|
|
269
|
+
n ? Error("react-stack-top-frame") : N,
|
|
270
|
+
n ? O(i(e)) : C
|
|
271
|
+
);
|
|
272
|
+
};
|
|
273
|
+
})()), _;
|
|
274
|
+
}
|
|
275
|
+
var F;
|
|
276
|
+
function te() {
|
|
277
|
+
return F || (F = 1, process.env.NODE_ENV === "production" ? v.exports = ee() : v.exports = re()), v.exports;
|
|
278
|
+
}
|
|
279
|
+
var ae = te();
|
|
280
|
+
export {
|
|
281
|
+
ae as j
|
|
282
|
+
};
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
"use strict";const K=require("react");var v={exports:{}},m={};/**
|
|
2
|
+
* @license React
|
|
3
|
+
* react-jsx-runtime.production.js
|
|
4
|
+
*
|
|
5
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
6
|
+
*
|
|
7
|
+
* This source code is licensed under the MIT license found in the
|
|
8
|
+
* LICENSE file in the root directory of this source tree.
|
|
9
|
+
*/var $;function ee(){if($)return m;$=1;var u=Symbol.for("react.transitional.element"),_=Symbol.for("react.fragment");function c(i,o,s){var f=null;if(s!==void 0&&(f=""+s),o.key!==void 0&&(f=""+o.key),"key"in o){s={};for(var d in o)d!=="key"&&(s[d]=o[d])}else s=o;return o=s.ref,{$$typeof:u,type:i,key:f,ref:o!==void 0?o:null,props:s}}return m.Fragment=_,m.jsx=c,m.jsxs=c,m}var E={};/**
|
|
10
|
+
* @license React
|
|
11
|
+
* react-jsx-runtime.development.js
|
|
12
|
+
*
|
|
13
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
14
|
+
*
|
|
15
|
+
* This source code is licensed under the MIT license found in the
|
|
16
|
+
* LICENSE file in the root directory of this source tree.
|
|
17
|
+
*/var I;function re(){return I||(I=1,process.env.NODE_ENV!=="production"&&(function(){function u(e){if(e==null)return null;if(typeof e=="function")return e.$$typeof===H?null:e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case p:return"Fragment";case U:return"Profiler";case W:return"StrictMode";case z:return"Suspense";case G:return"SuspenseList";case B:return"Activity"}if(typeof e=="object")switch(typeof e.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),e.$$typeof){case M:return"Portal";case J:return e.displayName||"Context";case q:return(e._context.displayName||"Context")+".Consumer";case V:var r=e.render;return e=e.displayName,e||(e=r.displayName||r.name||"",e=e!==""?"ForwardRef("+e+")":"ForwardRef"),e;case X:return r=e.displayName||null,r!==null?r:u(e.type)||"Memo";case T:r=e._payload,e=e._init;try{return u(e(r))}catch{}}return null}function _(e){return""+e}function c(e){try{_(e);var r=!1}catch{r=!0}if(r){r=console;var t=r.error,n=typeof Symbol=="function"&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return t.call(r,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",n),_(e)}}function i(e){if(e===p)return"<>";if(typeof e=="object"&&e!==null&&e.$$typeof===T)return"<...>";try{var r=u(e);return r?"<"+r+">":"<...>"}catch{return"<...>"}}function o(){var e=k.A;return e===null?null:e.getOwner()}function s(){return Error("react-stack-top-frame")}function f(e){if(j.call(e,"key")){var r=Object.getOwnPropertyDescriptor(e,"key").get;if(r&&r.isReactWarning)return!1}return e.key!==void 0}function d(e,r){function t(){g||(g=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",r))}t.isReactWarning=!0,Object.defineProperty(e,"key",{get:t,configurable:!0})}function D(){var e=u(this.type);return h[e]||(h[e]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),e=this.props.ref,e!==void 0?e:null}function L(e,r,t,n,b,A){var a=t.ref;return e={$$typeof:y,type:e,key:r,props:t,_owner:n},(a!==void 0?a:null)!==null?Object.defineProperty(e,"ref",{enumerable:!1,get:D}):Object.defineProperty(e,"ref",{enumerable:!1,value:null}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(e,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:b}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:A}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function P(e,r,t,n,b,A){var a=r.children;if(a!==void 0)if(n)if(Z(a)){for(n=0;n<a.length;n++)w(a[n]);Object.freeze&&Object.freeze(a)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else w(a);if(j.call(r,"key")){a=u(e);var l=Object.keys(r).filter(function(Q){return Q!=="key"});n=0<l.length?"{key: someKey, "+l.join(": ..., ")+": ...}":"{key: someKey}",Y[a+n]||(l=0<l.length?"{"+l.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
|
|
18
|
+
let props = %s;
|
|
19
|
+
<%s {...props} />
|
|
20
|
+
React keys must be passed directly to JSX without using spread:
|
|
21
|
+
let props = %s;
|
|
22
|
+
<%s key={someKey} {...props} />`,n,a,l,a),Y[a+n]=!0)}if(a=null,t!==void 0&&(c(t),a=""+t),f(r)&&(c(r.key),a=""+r.key),"key"in r){t={};for(var S in r)S!=="key"&&(t[S]=r[S])}else t=r;return a&&d(t,typeof e=="function"?e.displayName||e.name||"Unknown":e),L(e,a,t,o(),b,A)}function w(e){x(e)?e._store&&(e._store.validated=1):typeof e=="object"&&e!==null&&e.$$typeof===T&&(e._payload.status==="fulfilled"?x(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function x(e){return typeof e=="object"&&e!==null&&e.$$typeof===y}var R=K,y=Symbol.for("react.transitional.element"),M=Symbol.for("react.portal"),p=Symbol.for("react.fragment"),W=Symbol.for("react.strict_mode"),U=Symbol.for("react.profiler"),q=Symbol.for("react.consumer"),J=Symbol.for("react.context"),V=Symbol.for("react.forward_ref"),z=Symbol.for("react.suspense"),G=Symbol.for("react.suspense_list"),X=Symbol.for("react.memo"),T=Symbol.for("react.lazy"),B=Symbol.for("react.activity"),H=Symbol.for("react.client.reference"),k=R.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,j=Object.prototype.hasOwnProperty,Z=Array.isArray,O=console.createTask?console.createTask:function(){return null};R={react_stack_bottom_frame:function(e){return e()}};var g,h={},N=R.react_stack_bottom_frame.bind(R,s)(),C=O(i(s)),Y={};E.Fragment=p,E.jsx=function(e,r,t){var n=1e4>k.recentlyCreatedOwnerStacks++;return P(e,r,t,!1,n?Error("react-stack-top-frame"):N,n?O(i(e)):C)},E.jsxs=function(e,r,t){var n=1e4>k.recentlyCreatedOwnerStacks++;return P(e,r,t,!0,n?Error("react-stack-top-frame"):N,n?O(i(e)):C)}})()),E}var F;function te(){return F||(F=1,process.env.NODE_ENV==="production"?v.exports=ee():v.exports=re()),v.exports}var ne=te();exports.jsxRuntimeExports=ne;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";const e=require("./jsx-runtime-BB_1_6y_.js"),c=require("react"),m=require("@kuma-ui/core");function u({width:t,height:s,className:o,children:r,isAnimated:n=!0,...x}){return e.jsxRuntimeExports.jsx("span",{...x,"aria-busy":!0,"aria-role":"progressbar",className:m.cx("kuma-3027005914",n&&"kuma-3311350973",o),style:{width:t,height:s},children:r??e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{children:" "})})}const i="kuma-3140855657";function a({lines:t=1,isAnimated:s=!0}){const o=c.useMemo(()=>{const r=[];if(t<=1)return r;for(let n=1;n<t;n+=1)r.push(e.jsxRuntimeExports.jsx(u,{width:"100%",height:"1em",isAnimated:s,className:i},n));return r},[t,s]);return t<1?null:t===1?e.jsxRuntimeExports.jsx(u,{width:"100%",height:"1em",isAnimated:s,className:i}):e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[o,e.jsxRuntimeExports.jsx(u,{width:"60%",height:"1em",isAnimated:s,className:i})]})}exports.Skeleton=a;exports.SkeletonInstance=u;
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import { j as e } from "./jsx-runtime-B4hRZ52C.mjs";
|
|
2
|
+
import { useMemo as l } from "react";
|
|
3
|
+
import { cx as c } from "@kuma-ui/core";
|
|
4
|
+
function o({
|
|
5
|
+
width: t,
|
|
6
|
+
height: r,
|
|
7
|
+
className: n,
|
|
8
|
+
children: s,
|
|
9
|
+
isAnimated: a = !0,
|
|
10
|
+
...m
|
|
11
|
+
}) {
|
|
12
|
+
return /* @__PURE__ */ e.jsx(
|
|
13
|
+
"span",
|
|
14
|
+
{
|
|
15
|
+
...m,
|
|
16
|
+
"aria-busy": !0,
|
|
17
|
+
"aria-role": "progressbar",
|
|
18
|
+
className: c("kuma-3027005914", a && "kuma-3311350973", n),
|
|
19
|
+
style: {
|
|
20
|
+
width: t,
|
|
21
|
+
height: r
|
|
22
|
+
},
|
|
23
|
+
children: s ?? /* @__PURE__ */ e.jsx(e.Fragment, { children: " " })
|
|
24
|
+
}
|
|
25
|
+
);
|
|
26
|
+
}
|
|
27
|
+
const u = "kuma-3140855657";
|
|
28
|
+
function f({
|
|
29
|
+
lines: t = 1,
|
|
30
|
+
isAnimated: r = !0
|
|
31
|
+
}) {
|
|
32
|
+
const n = l(() => {
|
|
33
|
+
const s = [];
|
|
34
|
+
if (t <= 1)
|
|
35
|
+
return s;
|
|
36
|
+
for (let a = 1; a < t; a += 1)
|
|
37
|
+
s.push(/* @__PURE__ */ e.jsx(o, { width: "100%", height: "1em", isAnimated: r, className: u }, a));
|
|
38
|
+
return s;
|
|
39
|
+
}, [t, r]);
|
|
40
|
+
return t < 1 ? null : t === 1 ? /* @__PURE__ */ e.jsx(o, { width: "100%", height: "1em", isAnimated: r, className: u }) : /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
|
|
41
|
+
n,
|
|
42
|
+
/* @__PURE__ */ e.jsx(o, { width: "60%", height: "1em", isAnimated: r, className: u })
|
|
43
|
+
] });
|
|
44
|
+
}
|
|
45
|
+
export {
|
|
46
|
+
f as S,
|
|
47
|
+
o as a
|
|
48
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default, SkeletonInstance } from './components/skeleton';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./skeleton-BL8lC2O4.js");exports.SkeletonInstance=e.SkeletonInstance;exports.default=e.Skeleton;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { j as m } from "./jsx-runtime-B4hRZ52C.mjs";
|
|
2
|
+
import { useMemo as o } from "react";
|
|
3
|
+
import { cx as x } from "@kuma-ui/core";
|
|
4
|
+
function l({
|
|
5
|
+
size: r = 18,
|
|
6
|
+
strokeWidth: s = 2.5,
|
|
7
|
+
isAnimated: f = !0
|
|
8
|
+
}) {
|
|
9
|
+
const t = o(() => r / 2, [r]), c = o(() => t - s / 2, [s, t]), e = o(() => 2 * Math.PI * c, [c]), n = o(() => e * 0.33, [e]), a = o(() => e - n, [e, n]), u = o(() => -a / 2, [a]);
|
|
10
|
+
return /* @__PURE__ */ m.jsx("svg", { width: r, height: r, preserveAspectRatio: "xMaxYMax meet", viewBox: `0 0 ${r} ${r}`, fill: "none", className: x("kuma-2940817552", f && "kuma-2073235239"), children: /* @__PURE__ */ m.jsx("circle", { cx: t, cy: t, r: c, stroke: "currentColor", strokeWidth: s, strokeLinecap: "round", strokeDasharray: `${a} ${n}`, strokeDashoffset: u }) });
|
|
11
|
+
}
|
|
12
|
+
export {
|
|
13
|
+
l as S
|
|
14
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";const a=require("./jsx-runtime-BB_1_6y_.js"),s=require("react"),x=require("@kuma-ui/core");function f({size:e=18,strokeWidth:o=2.5,isAnimated:i=!0}){const r=s.useMemo(()=>e/2,[e]),n=s.useMemo(()=>r-o/2,[o,r]),t=s.useMemo(()=>2*Math.PI*n,[n]),c=s.useMemo(()=>t*.33,[t]),u=s.useMemo(()=>t-c,[t,c]),m=s.useMemo(()=>-u/2,[u]);return a.jsxRuntimeExports.jsx("svg",{width:e,height:e,preserveAspectRatio:"xMaxYMax meet",viewBox:`0 0 ${e} ${e}`,fill:"none",className:x.cx("kuma-2940817552",i&&"kuma-2073235239"),children:a.jsxRuntimeExports.jsx("circle",{cx:r,cy:r,r:n,stroke:"currentColor",strokeWidth:o,strokeLinecap:"round",strokeDasharray:`${u} ${c}`,strokeDashoffset:m})})}exports.Spinner=f;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from './components/spinner';
|
package/build/spinner.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./spinner-DQcSzoeb.js");exports.default=e.Spinner;
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import { j as t } from "./jsx-runtime-B4hRZ52C.mjs";
|
|
2
|
+
import { cx as o } from "@kuma-ui/core";
|
|
3
|
+
import { overflowProtectionStyles as e } from "./theme.mjs";
|
|
4
|
+
import { A as n } from "./atom-CqxGy6PS.mjs";
|
|
5
|
+
function f({
|
|
6
|
+
as: a,
|
|
7
|
+
className: s,
|
|
8
|
+
...r
|
|
9
|
+
}) {
|
|
10
|
+
return /* @__PURE__ */ t.jsx(n, { as: a ?? "h1", ...r, className: o(e, "kuma-2934642132", s) });
|
|
11
|
+
}
|
|
12
|
+
const m = "kuma-1010422083";
|
|
13
|
+
function x({
|
|
14
|
+
as: a,
|
|
15
|
+
className: s,
|
|
16
|
+
...r
|
|
17
|
+
}) {
|
|
18
|
+
return /* @__PURE__ */ t.jsx(n, { as: a ?? "p", ...r, className: o(m, "kuma-2351087175", s) });
|
|
19
|
+
}
|
|
20
|
+
function l({
|
|
21
|
+
as: a,
|
|
22
|
+
className: s,
|
|
23
|
+
...r
|
|
24
|
+
}) {
|
|
25
|
+
return /* @__PURE__ */ t.jsx(n, { as: a ?? "span", ...r, className: o(m, s) });
|
|
26
|
+
}
|
|
27
|
+
function j({
|
|
28
|
+
as: a,
|
|
29
|
+
className: s,
|
|
30
|
+
...r
|
|
31
|
+
}) {
|
|
32
|
+
return /* @__PURE__ */ t.jsx(n, { as: a ?? "div", ...r, className: o("kuma-2608978433", s) });
|
|
33
|
+
}
|
|
34
|
+
export {
|
|
35
|
+
f as H,
|
|
36
|
+
x as P,
|
|
37
|
+
l as S,
|
|
38
|
+
j as T
|
|
39
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";const a=require("./jsx-runtime-BB_1_6y_.js"),n=require("@kuma-ui/core"),u=require("./theme.js"),r=require("./atom-B-bW2QKm.js");function c({as:s,className:t,...e}){return a.jsxRuntimeExports.jsx(r.Atom,{as:s??"h1",...e,className:n.cx(u.overflowProtectionStyles,"kuma-2934642132",t)})}const o="kuma-1010422083";function m({as:s,className:t,...e}){return a.jsxRuntimeExports.jsx(r.Atom,{as:s??"p",...e,className:n.cx(o,"kuma-2351087175",t)})}function x({as:s,className:t,...e}){return a.jsxRuntimeExports.jsx(r.Atom,{as:s??"span",...e,className:n.cx(o,t)})}function i({as:s,className:t,...e}){return a.jsxRuntimeExports.jsx(r.Atom,{as:s??"div",...e,className:n.cx("kuma-2608978433",t)})}exports.Heading=c;exports.Paragraph=m;exports.Span=x;exports.Text=i;
|
package/build/text.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { Heading, Paragraph, Span, default as Text } from './components/text';
|
package/build/text.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./text-COwGgyWJ.js");exports.Heading=e.Heading;exports.Paragraph=e.Paragraph;exports.Span=e.Span;exports.Text=e.Text;
|
package/build/text.mjs
ADDED
package/build/theme.d.ts
ADDED
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
export declare const greenColor = "#4ca486";
|
|
2
|
+
export declare const font: {
|
|
3
|
+
family: string;
|
|
4
|
+
stylesheet: string;
|
|
5
|
+
preconnect: ({
|
|
6
|
+
url: string;
|
|
7
|
+
crossorigin?: undefined;
|
|
8
|
+
} | {
|
|
9
|
+
url: string;
|
|
10
|
+
crossorigin: boolean;
|
|
11
|
+
})[];
|
|
12
|
+
};
|
|
13
|
+
declare const theme: string;
|
|
14
|
+
export default theme;
|
|
15
|
+
export declare const overflowProtectionStyles: string;
|
|
16
|
+
export declare const buttonResetStyles: string;
|
package/build/theme.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t="#4ca486",e={family:"DM Sans, sans-serif",stylesheet:"https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap",preconnect:[{url:"https://fonts.googleapis.com"},{url:"https://fonts.gstatic.com",crossorigin:!0}]},o="kuma-3997436555",s="kuma-4178476647",n="kuma-216224454";exports.buttonResetStyles=n;exports.default=o;exports.font=e;exports.greenColor=t;exports.overflowProtectionStyles=s;
|
package/build/theme.mjs
ADDED
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
const t = "#4ca486", s = {
|
|
2
|
+
family: "DM Sans, sans-serif",
|
|
3
|
+
stylesheet: "https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap",
|
|
4
|
+
preconnect: [{
|
|
5
|
+
url: "https://fonts.googleapis.com"
|
|
6
|
+
}, {
|
|
7
|
+
url: "https://fonts.gstatic.com",
|
|
8
|
+
crossorigin: !0
|
|
9
|
+
}]
|
|
10
|
+
}, o = "kuma-3997436555", e = "kuma-4178476647", n = "kuma-216224454";
|
|
11
|
+
export {
|
|
12
|
+
n as buttonResetStyles,
|
|
13
|
+
o as default,
|
|
14
|
+
s as font,
|
|
15
|
+
t as greenColor,
|
|
16
|
+
e as overflowProtectionStyles
|
|
17
|
+
};
|
package/package.json
ADDED
|
@@ -0,0 +1,190 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@kakadu/components",
|
|
3
|
+
"version": "0.1.0",
|
|
4
|
+
"description": "React components built with Kuma UI",
|
|
5
|
+
"license": "MIT",
|
|
6
|
+
"repository": {
|
|
7
|
+
"type": "git",
|
|
8
|
+
"url": "https://github.com/kakadu/components.git"
|
|
9
|
+
},
|
|
10
|
+
"keywords": [
|
|
11
|
+
"react",
|
|
12
|
+
"components",
|
|
13
|
+
"kuma-ui",
|
|
14
|
+
"ui",
|
|
15
|
+
"design-system"
|
|
16
|
+
],
|
|
17
|
+
"main": "./build/index.js",
|
|
18
|
+
"module": "./build/index.mjs",
|
|
19
|
+
"types": "./build/index.d.ts",
|
|
20
|
+
"scripts": {
|
|
21
|
+
"dev": "next dev",
|
|
22
|
+
"build": "rm -rf build && vite build && tsc --project tsconfig.build.json --emitDeclarationOnly --outDir build",
|
|
23
|
+
"build:next": "next build",
|
|
24
|
+
"start": "next start",
|
|
25
|
+
"storybook": "storybook dev -p 6006 --no-open",
|
|
26
|
+
"build-storybook": "storybook build",
|
|
27
|
+
"fix": "xo --fix --prettier",
|
|
28
|
+
"format": "prettier --write .",
|
|
29
|
+
"lint": "tsc --noEmit && xo --prettier",
|
|
30
|
+
"prepublishOnly": "npm run build"
|
|
31
|
+
},
|
|
32
|
+
"exports": {
|
|
33
|
+
".": {
|
|
34
|
+
"types": "./build/index.d.ts",
|
|
35
|
+
"import": "./build/index.mjs",
|
|
36
|
+
"require": "./build/index.js"
|
|
37
|
+
},
|
|
38
|
+
"./atom": {
|
|
39
|
+
"types": "./build/atom.d.ts",
|
|
40
|
+
"import": "./build/atom.mjs",
|
|
41
|
+
"require": "./build/atom.js"
|
|
42
|
+
},
|
|
43
|
+
"./box": {
|
|
44
|
+
"types": "./build/box.d.ts",
|
|
45
|
+
"import": "./build/box.mjs",
|
|
46
|
+
"require": "./build/box.js"
|
|
47
|
+
},
|
|
48
|
+
"./flex": {
|
|
49
|
+
"types": "./build/flex.d.ts",
|
|
50
|
+
"import": "./build/flex.mjs",
|
|
51
|
+
"require": "./build/flex.js"
|
|
52
|
+
},
|
|
53
|
+
"./text": {
|
|
54
|
+
"types": "./build/text.d.ts",
|
|
55
|
+
"import": "./build/text.mjs",
|
|
56
|
+
"require": "./build/text.js"
|
|
57
|
+
},
|
|
58
|
+
"./gauge": {
|
|
59
|
+
"types": "./build/gauge.d.ts",
|
|
60
|
+
"import": "./build/gauge.mjs",
|
|
61
|
+
"require": "./build/gauge.js"
|
|
62
|
+
},
|
|
63
|
+
"./skeleton": {
|
|
64
|
+
"types": "./build/skeleton.d.ts",
|
|
65
|
+
"import": "./build/skeleton.mjs",
|
|
66
|
+
"require": "./build/skeleton.js"
|
|
67
|
+
},
|
|
68
|
+
"./spinner": {
|
|
69
|
+
"types": "./build/spinner.d.ts",
|
|
70
|
+
"import": "./build/spinner.mjs",
|
|
71
|
+
"require": "./build/spinner.js"
|
|
72
|
+
},
|
|
73
|
+
"./theme": {
|
|
74
|
+
"types": "./build/theme.d.ts",
|
|
75
|
+
"import": "./build/theme.mjs",
|
|
76
|
+
"require": "./build/theme.js"
|
|
77
|
+
},
|
|
78
|
+
"./theme.tsx": {
|
|
79
|
+
"types": "./build/theme.d.ts",
|
|
80
|
+
"import": "./build/theme.mjs",
|
|
81
|
+
"require": "./build/theme.js"
|
|
82
|
+
},
|
|
83
|
+
"./components.css": "./build/components.css"
|
|
84
|
+
},
|
|
85
|
+
"files": [
|
|
86
|
+
"build",
|
|
87
|
+
"theme.tsx"
|
|
88
|
+
],
|
|
89
|
+
"publishConfig": {
|
|
90
|
+
"access": "public"
|
|
91
|
+
},
|
|
92
|
+
"sideEffects": [
|
|
93
|
+
"**/*.css"
|
|
94
|
+
],
|
|
95
|
+
"peerDependencies": {
|
|
96
|
+
"@kuma-ui/core": "^1.5.9",
|
|
97
|
+
"react": "^19.0.0",
|
|
98
|
+
"react-dom": "^19.0.0"
|
|
99
|
+
},
|
|
100
|
+
"dependencies": {
|
|
101
|
+
"@kuma-ui/vite": "^1.4.0",
|
|
102
|
+
"next": "^16.0.1"
|
|
103
|
+
},
|
|
104
|
+
"devDependencies": {
|
|
105
|
+
"@chromatic-com/storybook": "^4.1.2",
|
|
106
|
+
"@kuma-ui/core": "^1.5.9",
|
|
107
|
+
"@storybook/addon-a11y": "^10.0.0",
|
|
108
|
+
"@storybook/addon-docs": "^10.0.0",
|
|
109
|
+
"@storybook/addon-onboarding": "^10.0.0",
|
|
110
|
+
"@storybook/addon-vitest": "^10.0.0",
|
|
111
|
+
"@storybook/nextjs-vite": "^10.0.0",
|
|
112
|
+
"@types/node": "^20",
|
|
113
|
+
"@types/react": "^19",
|
|
114
|
+
"@types/react-dom": "^19",
|
|
115
|
+
"@vitejs/plugin-react": "^5.1.0",
|
|
116
|
+
"@vitest/browser-playwright": "^4.0.4",
|
|
117
|
+
"@vitest/coverage-v8": "^4.0.4",
|
|
118
|
+
"eslint-config-xo-react": "^0.27.0",
|
|
119
|
+
"eslint-plugin-storybook": "^10.0.0",
|
|
120
|
+
"playwright": "^1.56.1",
|
|
121
|
+
"prettier": "^3.6.2",
|
|
122
|
+
"react": "^19.2.0",
|
|
123
|
+
"react-dom": "^19.2.0",
|
|
124
|
+
"storybook": "^10.0.0",
|
|
125
|
+
"typescript": "^5",
|
|
126
|
+
"vite": "^6.0.0",
|
|
127
|
+
"vitest": "^4.0.4",
|
|
128
|
+
"xo": "^0.59.3"
|
|
129
|
+
},
|
|
130
|
+
"overrides": {
|
|
131
|
+
"react": "^19.2.0",
|
|
132
|
+
"react-dom": "^19.2.0",
|
|
133
|
+
"@types/react": "^19",
|
|
134
|
+
"@types/react-dom": "^19"
|
|
135
|
+
},
|
|
136
|
+
"xo": {
|
|
137
|
+
"extends": [
|
|
138
|
+
"xo-react"
|
|
139
|
+
],
|
|
140
|
+
"rules": {
|
|
141
|
+
"unicorn/expiring-todo-comments": 0,
|
|
142
|
+
"unicorn/prefer-top-level-await": 0,
|
|
143
|
+
"import/extensions": 0,
|
|
144
|
+
"n/prefer-global/process": 0,
|
|
145
|
+
"n/file-extension-in-import": 0,
|
|
146
|
+
"react/boolean-prop-naming": [
|
|
147
|
+
"error",
|
|
148
|
+
{
|
|
149
|
+
"rule": "^(is|has|show|hide|should)[A-Z]([A-Za-z0-9]?)+"
|
|
150
|
+
}
|
|
151
|
+
]
|
|
152
|
+
},
|
|
153
|
+
"overrides": [
|
|
154
|
+
{
|
|
155
|
+
"files": [
|
|
156
|
+
"**/*.{ts,tsx}"
|
|
157
|
+
],
|
|
158
|
+
"rules": {
|
|
159
|
+
"@typescript-eslint/no-unused-vars": 2,
|
|
160
|
+
"@typescript-eslint/no-unsafe-argument": 1,
|
|
161
|
+
"@typescript-eslint/no-unsafe-assignment": 1,
|
|
162
|
+
"@typescript-eslint/no-unsafe-call": 1,
|
|
163
|
+
"@typescript-eslint/triple-slash-reference": 0,
|
|
164
|
+
"@typescript-eslint/consistent-type-assertions": 0
|
|
165
|
+
}
|
|
166
|
+
},
|
|
167
|
+
{
|
|
168
|
+
"files": [
|
|
169
|
+
"recorder/manifest.ts"
|
|
170
|
+
],
|
|
171
|
+
"rules": {
|
|
172
|
+
"@typescript-eslint/naming-convention": 0
|
|
173
|
+
}
|
|
174
|
+
},
|
|
175
|
+
{
|
|
176
|
+
"files": [
|
|
177
|
+
"jest.config.js"
|
|
178
|
+
],
|
|
179
|
+
"rules": {
|
|
180
|
+
"unicorn/prefer-module": 0
|
|
181
|
+
}
|
|
182
|
+
}
|
|
183
|
+
],
|
|
184
|
+
"ignore": [
|
|
185
|
+
".vercel/",
|
|
186
|
+
"build/",
|
|
187
|
+
"public/**/*.js"
|
|
188
|
+
]
|
|
189
|
+
}
|
|
190
|
+
}
|
package/readme.md
ADDED
package/theme.tsx
ADDED
|
@@ -0,0 +1,130 @@
|
|
|
1
|
+
import {css} from '@kuma-ui/core';
|
|
2
|
+
|
|
3
|
+
export const greenColor = '#4ca486';
|
|
4
|
+
|
|
5
|
+
export const font = {
|
|
6
|
+
family: 'DM Sans, sans-serif',
|
|
7
|
+
stylesheet:
|
|
8
|
+
'https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap',
|
|
9
|
+
preconnect: [
|
|
10
|
+
{url: 'https://fonts.googleapis.com'},
|
|
11
|
+
{url: 'https://fonts.gstatic.com', crossorigin: true},
|
|
12
|
+
],
|
|
13
|
+
};
|
|
14
|
+
|
|
15
|
+
const theme = css`
|
|
16
|
+
--background-color: #fafcff;
|
|
17
|
+
--foreground-color: #000;
|
|
18
|
+
|
|
19
|
+
--blue-color: #2f455d;
|
|
20
|
+
--blue-dark-color: #32445b;
|
|
21
|
+
--blue-hover-color: #345882;
|
|
22
|
+
--blue-light-color: #b3c0d4;
|
|
23
|
+
--blue-pale-color: #e1efff;
|
|
24
|
+
|
|
25
|
+
--green-color: #4ca486;
|
|
26
|
+
--green-pale-color: #dceeec;
|
|
27
|
+
--green-dark-color: #3c6957;
|
|
28
|
+
--grey-color: #c6c6c6;
|
|
29
|
+
--grey-pale-color: #dfdfdf;
|
|
30
|
+
--red-color: #ff4d4d;
|
|
31
|
+
--red-pale-color: #ffe5e5;
|
|
32
|
+
--red-pale-hover-color: #ffd6d6;
|
|
33
|
+
--yellow-color: #f5c235;
|
|
34
|
+
--yellow-dark-color: #9f7605;
|
|
35
|
+
|
|
36
|
+
--flash-color: rgba(255, 216, 57, 0.5);
|
|
37
|
+
--font-weight-modifier: 50;
|
|
38
|
+
|
|
39
|
+
:where([data-theme='dark']) {
|
|
40
|
+
--font-weight-modifier: 0;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
--accent-font-family: 'Frank Ruhl Libre', serif;
|
|
44
|
+
--font-family: 'Inter', -apple-system, helvetica, arial, sans-serif;
|
|
45
|
+
|
|
46
|
+
--gap: 16px;
|
|
47
|
+
|
|
48
|
+
--quarter-gap: calc(var(--gap) / 4);
|
|
49
|
+
--third-gap: calc(var(--gap) / 3);
|
|
50
|
+
--half-gap: calc(var(--gap) / 2);
|
|
51
|
+
--sesquialteral-gap: calc(var(--gap) * 1.5);
|
|
52
|
+
--double-gap: calc(var(--gap) * 2);
|
|
53
|
+
--triple-gap: calc(var(--gap) * 3);
|
|
54
|
+
--quadruple-gap: calc(var(--gap) * 4);
|
|
55
|
+
|
|
56
|
+
--sidebar-z-index: 424242;
|
|
57
|
+
--modal-z-index: 424243;
|
|
58
|
+
|
|
59
|
+
font-family: var(--font-family);
|
|
60
|
+
font-optical-sizing: auto;
|
|
61
|
+
line-height: normal;
|
|
62
|
+
color: var(--foreground-color);
|
|
63
|
+
|
|
64
|
+
--8px: 0.5rem;
|
|
65
|
+
--9px: 0.5625rem;
|
|
66
|
+
--10px: 0.625rem;
|
|
67
|
+
--11px: 0.6875rem;
|
|
68
|
+
--12px: 0.75rem;
|
|
69
|
+
--13px: 0.8125rem;
|
|
70
|
+
--14px: 0.875rem;
|
|
71
|
+
--15px: 0.9375rem;
|
|
72
|
+
--16px: 1rem;
|
|
73
|
+
|
|
74
|
+
--17px: 1.0625rem;
|
|
75
|
+
--18px: 1.125rem;
|
|
76
|
+
--19px: 1.1875rem;
|
|
77
|
+
--20px: 1.25rem;
|
|
78
|
+
--21px: 1.3125rem;
|
|
79
|
+
--22px: 1.375rem;
|
|
80
|
+
--23px: 1.4375rem;
|
|
81
|
+
--24px: 1.5rem;
|
|
82
|
+
|
|
83
|
+
--25px: 1.5625rem;
|
|
84
|
+
--26px: 1.625rem;
|
|
85
|
+
--27px: 1.6875rem;
|
|
86
|
+
--28px: 1.75rem;
|
|
87
|
+
--29px: 1.8125rem;
|
|
88
|
+
--30px: 1.875rem;
|
|
89
|
+
--31px: 1.9375rem;
|
|
90
|
+
--32px: 2rem;
|
|
91
|
+
|
|
92
|
+
--33px: 2.0625rem;
|
|
93
|
+
--34px: 2.125rem;
|
|
94
|
+
--35px: 2.1875rem;
|
|
95
|
+
--36px: 2.25rem;
|
|
96
|
+
--37px: 2.3125rem;
|
|
97
|
+
--38px: 2.375rem;
|
|
98
|
+
--39px: 2.4375rem;
|
|
99
|
+
--40px: 2.5rem;
|
|
100
|
+
|
|
101
|
+
--41px: 2.5625rem;
|
|
102
|
+
--42px: 2.625rem;
|
|
103
|
+
--43px: 2.6875rem;
|
|
104
|
+
--44px: 2.75rem;
|
|
105
|
+
--45px: 2.8125rem;
|
|
106
|
+
--46px: 2.875rem;
|
|
107
|
+
--47px: 2.9375rem;
|
|
108
|
+
--48px: 3rem;
|
|
109
|
+
`;
|
|
110
|
+
|
|
111
|
+
export default theme;
|
|
112
|
+
|
|
113
|
+
export const overflowProtectionStyles = css`
|
|
114
|
+
overflow-wrap: anywhere;
|
|
115
|
+
hyphens: auto;
|
|
116
|
+
`;
|
|
117
|
+
|
|
118
|
+
export const buttonResetStyles = css`
|
|
119
|
+
appearance: none;
|
|
120
|
+
background: transparent;
|
|
121
|
+
text-align: left;
|
|
122
|
+
border: 0;
|
|
123
|
+
margin: 0;
|
|
124
|
+
padding: 0;
|
|
125
|
+
cursor: pointer;
|
|
126
|
+
|
|
127
|
+
[dir='rtl'] & {
|
|
128
|
+
text-align: right;
|
|
129
|
+
}
|
|
130
|
+
`;
|