@vjdesigns/vjdesigns-ui 0.0.0-stage → 2.0.0

package/dist/components/layout/Box/Box.mjs

@@ -0,0 +1,158 @@
+import { cx as e } from "../../../utils/cx.mjs";
+import t from "./Box.module.css.mjs";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/layout/Box/Box.tsx
+var r = {
+	bg: t.surfaceBg,
+	surface: t.surfaceSurface,
+	raised: t.surfaceRaised,
+	sunken: t.surfaceSunken
+}, i = {
+	soft: {
+		neutral: t.softNeutral,
+		primary: t.softPrimary,
+		accent: t.softAccent,
+		success: t.softSuccess,
+		warning: t.softWarning,
+		danger: t.softDanger,
+		info: t.softInfo
+	},
+	solid: {
+		neutral: t.solidNeutral,
+		primary: t.solidPrimary,
+		accent: t.solidAccent,
+		success: t.solidSuccess,
+		warning: t.solidWarning,
+		danger: t.solidDanger,
+		info: t.solidInfo
+	}
+}, a = {
+	none: t.radiusNone,
+	xs: t.radiusXs,
+	sm: t.radiusSm,
+	md: t.radiusMd,
+	lg: t.radiusLg,
+	xl: t.radiusXl,
+	"2xl": t.radius2xl,
+	pill: t.radiusPill
+}, o = {
+	none: t.shadowNone,
+	xs: t.shadowXs,
+	sm: t.shadowSm,
+	md: t.shadowMd,
+	lg: t.shadowLg,
+	xl: t.shadowXl
+}, ee = {
+	default: t.borderDefault,
+	strong: t.borderStrong
+}, te = {
+	block: t.displayBlock,
+	inline: t.displayInline,
+	"inline-block": t.displayInlineBlock,
+	flex: t.displayFlex,
+	"inline-flex": t.displayInlineFlex,
+	grid: t.displayGrid,
+	"inline-grid": t.displayInlineGrid,
+	contents: t.displayContents,
+	none: t.displayNone
+}, s = {
+	static: t.positionStatic,
+	relative: t.positionRelative,
+	absolute: t.positionAbsolute,
+	fixed: t.positionFixed,
+	sticky: t.positionSticky
+}, c = {
+	visible: t.overflowVisible,
+	hidden: t.overflowHidden,
+	auto: t.overflowAuto,
+	scroll: t.overflowScroll,
+	clip: t.overflowClip
+}, l = {
+	start: t.textStart,
+	center: t.textCenter,
+	end: t.textEnd,
+	justify: t.textJustify
+};
+function u(e) {
+	return e === "auto" ? "auto" : `var(--space-${e})`;
+}
+function d(e) {
+	return typeof e == "number" ? `${e}px` : e;
+}
+var f = [
+	"p",
+	"px",
+	"py",
+	"pt",
+	"pr",
+	"pb",
+	"pl",
+	"m",
+	"mx",
+	"my",
+	"mt",
+	"mr",
+	"mb",
+	"ml"
+], p = /* @__PURE__ */ new Set([
+	"img",
+	"video",
+	"canvas",
+	"svg",
+	"iframe"
+]), ne = [
+	"width",
+	"height",
+	"minWidth",
+	"maxWidth",
+	"minHeight",
+	"maxHeight"
+];
+function m(m) {
+	let { as: h, surface: g, tone: _, variant: v = "soft", radius: y, shadow: b, border: x, display: S, position: C, overflow: w, textAlign: T, p: E, px: D, py: O, pt: k, pr: A, pb: j, pl: M, m: N, mx: P, my: re, mt: F, mr: I, mb: L, ml: R, width: z, height: B, minWidth: V, maxWidth: H, minHeight: U, maxHeight: W, className: G, style: K, ...q } = m, J = h ?? "div", Y = {
+		p: E,
+		px: D,
+		py: O,
+		pt: k,
+		pr: A,
+		pb: j,
+		pl: M,
+		m: N,
+		mx: P,
+		my: re,
+		mt: F,
+		mr: I,
+		mb: L,
+		ml: R
+	}, X = {
+		width: z,
+		height: B,
+		minWidth: V,
+		maxWidth: H,
+		minHeight: U,
+		maxHeight: W
+	}, Z = {}, Q = [];
+	for (let e of f) {
+		let n = Y[e];
+		n !== void 0 && (Z[`--box-${e}`] = u(n), Q.push(t[e]));
+	}
+	for (let e of ne) {
+		let n = X[e];
+		n !== void 0 && (Z[`--box-${e}`] = d(n), Q.push(t[e]));
+	}
+	let $ = x === !0 ? "default" : x || void 0, ie = typeof J == "string" && p.has(J) ? {
+		...typeof z == "number" ? { width: z } : null,
+		...typeof B == "number" ? { height: B } : null
+	} : null;
+	return /* @__PURE__ */ n(J, {
+		className: e(t.root, _ ? i[v][_] : g && r[g], y && a[y], b && o[b], $ && ee[$], S && te[S], C && s[C], w && c[w], T && l[T], ...Q, G),
+		style: {
+			...Z,
+			...K
+		},
+		...ie,
+		...q
+	});
+}
+//#endregion
+export { m as Box, d as sizeValue, u as spaceVar };

package/dist/components/layout/Box/Box.module.css.cjs.js

@@ -0,0 +1 @@
+var e=`_root_j2f2v_11`,t=`_p_j2f2v_35`,n=`_px_j2f2v_37`,r=`_py_j2f2v_39`,i=`_pt_j2f2v_41`,a=`_pr_j2f2v_45`,o=`_pb_j2f2v_47`,s=`_pl_j2f2v_49`,c=`_m_j2f2v_55`,l=`_mx_j2f2v_57`,u=`_my_j2f2v_59`,d=`_mt_j2f2v_61`,f=`_mr_j2f2v_63`,p=`_mb_j2f2v_65`,m=`_ml_j2f2v_67`,h=`_width_j2f2v_73`,g=`_height_j2f2v_75`,_=`_minWidth_j2f2v_77`,v=`_maxWidth_j2f2v_79`,y=`_minHeight_j2f2v_81`,b=`_maxHeight_j2f2v_83`,x=`_surfaceBg_j2f2v_89`,S=`_surfaceSurface_j2f2v_91`,C=`_surfaceRaised_j2f2v_93`,w=`_surfaceSunken_j2f2v_95`,T=`_softNeutral_j2f2v_103`,E=`_softPrimary_j2f2v_105`,D=`_softAccent_j2f2v_107`,O=`_softSuccess_j2f2v_109`,k=`_softWarning_j2f2v_111`,A=`_softDanger_j2f2v_113`,j=`_softInfo_j2f2v_115`,M=`_solidNeutral_j2f2v_123`,N=`_solidPrimary_j2f2v_125`,P=`_solidAccent_j2f2v_127`,F=`_solidSuccess_j2f2v_129`,I=`_solidWarning_j2f2v_131`,L=`_solidDanger_j2f2v_133`,R=`_solidInfo_j2f2v_135`,z=`_radiusNone_j2f2v_141`,B=`_radiusXs_j2f2v_143`,V=`_radiusSm_j2f2v_145`,H=`_radiusMd_j2f2v_147`,U=`_radiusLg_j2f2v_149`,W=`_radiusXl_j2f2v_151`,G=`_radius2xl_j2f2v_153`,K=`_radiusPill_j2f2v_155`,q=`_shadowNone_j2f2v_161`,J=`_shadowXs_j2f2v_163`,Y=`_shadowSm_j2f2v_165`,X=`_shadowMd_j2f2v_167`,Z=`_shadowLg_j2f2v_169`,Q=`_shadowXl_j2f2v_171`,$=`_borderDefault_j2f2v_177`,ee=`_borderStrong_j2f2v_179`,te=`_displayBlock_j2f2v_197`,ne=`_displayInline_j2f2v_199`,re=`_displayInlineBlock_j2f2v_201`,ie=`_displayFlex_j2f2v_203`,ae=`_displayInlineFlex_j2f2v_205`,oe=`_displayGrid_j2f2v_207`,se=`_displayInlineGrid_j2f2v_209`,ce=`_displayContents_j2f2v_211`,le=`_displayNone_j2f2v_213`,ue=`_positionStatic_j2f2v_219`,de=`_positionRelative_j2f2v_221`,fe=`_positionAbsolute_j2f2v_223`,pe=`_positionFixed_j2f2v_225`,me=`_positionSticky_j2f2v_227`,he=`_overflowVisible_j2f2v_233`,ge=`_overflowHidden_j2f2v_235`,_e=`_overflowAuto_j2f2v_237`,ve=`_overflowScroll_j2f2v_239`,ye=`_overflowClip_j2f2v_241`,be=`_textStart_j2f2v_247`,xe=`_textCenter_j2f2v_249`,Se=`_textEnd_j2f2v_251`,Ce=`_textJustify_j2f2v_253`,we={root:e,p:t,px:n,py:r,pt:i,pr:a,pb:o,pl:s,m:c,mx:l,my:u,mt:d,mr:f,mb:p,ml:m,width:h,height:g,minWidth:_,maxWidth:v,minHeight:y,maxHeight:b,surfaceBg:x,surfaceSurface:S,surfaceRaised:C,surfaceSunken:w,softNeutral:T,softPrimary:E,softAccent:D,softSuccess:O,softWarning:k,softDanger:A,softInfo:j,solidNeutral:M,solidPrimary:N,solidAccent:P,solidSuccess:F,solidWarning:I,solidDanger:L,solidInfo:R,radiusNone:z,radiusXs:B,radiusSm:V,radiusMd:H,radiusLg:U,radiusXl:W,radius2xl:G,radiusPill:K,shadowNone:q,shadowXs:J,shadowSm:Y,shadowMd:X,shadowLg:Z,shadowXl:Q,borderDefault:$,borderStrong:ee,displayBlock:te,displayInline:ne,displayInlineBlock:re,displayFlex:ie,displayInlineFlex:ae,displayGrid:oe,displayInlineGrid:se,displayContents:ce,displayNone:le,positionStatic:ue,positionRelative:de,positionAbsolute:fe,positionFixed:pe,positionSticky:me,overflowVisible:he,overflowHidden:ge,overflowAuto:_e,overflowScroll:ve,overflowClip:ye,textStart:be,textCenter:xe,textEnd:Se,textJustify:Ce};exports.borderDefault=$,exports.borderStrong=ee,exports.default=we,exports.displayBlock=te,exports.displayContents=ce,exports.displayFlex=ie,exports.displayGrid=oe,exports.displayInline=ne,exports.displayInlineBlock=re,exports.displayInlineFlex=ae,exports.displayInlineGrid=se,exports.displayNone=le,exports.height=g,exports.m=c,exports.maxHeight=b,exports.maxWidth=v,exports.mb=p,exports.minHeight=y,exports.minWidth=_,exports.ml=m,exports.mr=f,exports.mt=d,exports.mx=l,exports.my=u,exports.overflowAuto=_e,exports.overflowClip=ye,exports.overflowHidden=ge,exports.overflowScroll=ve,exports.overflowVisible=he,exports.p=t,exports.pb=o,exports.pl=s,exports.positionAbsolute=fe,exports.positionFixed=pe,exports.positionRelative=de,exports.positionStatic=ue,exports.positionSticky=me,exports.pr=a,exports.pt=i,exports.px=n,exports.py=r,exports.radius2xl=G,exports.radiusLg=U,exports.radiusMd=H,exports.radiusNone=z,exports.radiusPill=K,exports.radiusSm=V,exports.radiusXl=W,exports.radiusXs=B,exports.root=e,exports.shadowLg=Z,exports.shadowMd=X,exports.shadowNone=q,exports.shadowSm=Y,exports.shadowXl=Q,exports.shadowXs=J,exports.softAccent=D,exports.softDanger=A,exports.softInfo=j,exports.softNeutral=T,exports.softPrimary=E,exports.softSuccess=O,exports.softWarning=k,exports.solidAccent=P,exports.solidDanger=L,exports.solidInfo=R,exports.solidNeutral=M,exports.solidPrimary=N,exports.solidSuccess=F,exports.solidWarning=I,exports.surfaceBg=x,exports.surfaceRaised=C,exports.surfaceSunken=w,exports.surfaceSurface=S,exports.textCenter=xe,exports.textEnd=Se,exports.textJustify=Ce,exports.textStart=be,exports.width=h;

package/dist/components/layout/Box/Box.module.css.mjs

@@ -0,0 +1,83 @@
+//#region src/components/layout/Box/Box.module.css
+var e = "_root_j2f2v_11", t = "_p_j2f2v_35", n = "_px_j2f2v_37", r = "_py_j2f2v_39", i = "_pt_j2f2v_41", a = "_pr_j2f2v_45", o = "_pb_j2f2v_47", s = "_pl_j2f2v_49", c = "_m_j2f2v_55", l = "_mx_j2f2v_57", u = "_my_j2f2v_59", d = "_mt_j2f2v_61", f = "_mr_j2f2v_63", p = "_mb_j2f2v_65", m = "_ml_j2f2v_67", h = "_width_j2f2v_73", g = "_height_j2f2v_75", _ = "_minWidth_j2f2v_77", v = "_maxWidth_j2f2v_79", y = "_minHeight_j2f2v_81", b = "_maxHeight_j2f2v_83", x = "_surfaceBg_j2f2v_89", S = "_surfaceSurface_j2f2v_91", C = "_surfaceRaised_j2f2v_93", w = "_surfaceSunken_j2f2v_95", T = "_softNeutral_j2f2v_103", E = "_softPrimary_j2f2v_105", D = "_softAccent_j2f2v_107", O = "_softSuccess_j2f2v_109", k = "_softWarning_j2f2v_111", A = "_softDanger_j2f2v_113", j = "_softInfo_j2f2v_115", M = "_solidNeutral_j2f2v_123", N = "_solidPrimary_j2f2v_125", P = "_solidAccent_j2f2v_127", F = "_solidSuccess_j2f2v_129", I = "_solidWarning_j2f2v_131", L = "_solidDanger_j2f2v_133", R = "_solidInfo_j2f2v_135", z = "_radiusNone_j2f2v_141", B = "_radiusXs_j2f2v_143", V = "_radiusSm_j2f2v_145", H = "_radiusMd_j2f2v_147", U = "_radiusLg_j2f2v_149", W = "_radiusXl_j2f2v_151", G = "_radius2xl_j2f2v_153", K = "_radiusPill_j2f2v_155", q = "_shadowNone_j2f2v_161", J = "_shadowXs_j2f2v_163", Y = "_shadowSm_j2f2v_165", X = "_shadowMd_j2f2v_167", Z = "_shadowLg_j2f2v_169", Q = "_shadowXl_j2f2v_171", $ = "_borderDefault_j2f2v_177", ee = "_borderStrong_j2f2v_179", te = "_displayBlock_j2f2v_197", ne = "_displayInline_j2f2v_199", re = "_displayInlineBlock_j2f2v_201", ie = "_displayFlex_j2f2v_203", ae = "_displayInlineFlex_j2f2v_205", oe = "_displayGrid_j2f2v_207", se = "_displayInlineGrid_j2f2v_209", ce = "_displayContents_j2f2v_211", le = "_displayNone_j2f2v_213", ue = "_positionStatic_j2f2v_219", de = "_positionRelative_j2f2v_221", fe = "_positionAbsolute_j2f2v_223", pe = "_positionFixed_j2f2v_225", me = "_positionSticky_j2f2v_227", he = "_overflowVisible_j2f2v_233", ge = "_overflowHidden_j2f2v_235", _e = "_overflowAuto_j2f2v_237", ve = "_overflowScroll_j2f2v_239", ye = "_overflowClip_j2f2v_241", be = "_textStart_j2f2v_247", xe = "_textCenter_j2f2v_249", Se = "_textEnd_j2f2v_251", Ce = "_textJustify_j2f2v_253", we = {
+	root: e,
+	p: t,
+	px: n,
+	py: r,
+	pt: i,
+	pr: a,
+	pb: o,
+	pl: s,
+	m: c,
+	mx: l,
+	my: u,
+	mt: d,
+	mr: f,
+	mb: p,
+	ml: m,
+	width: h,
+	height: g,
+	minWidth: _,
+	maxWidth: v,
+	minHeight: y,
+	maxHeight: b,
+	surfaceBg: x,
+	surfaceSurface: S,
+	surfaceRaised: C,
+	surfaceSunken: w,
+	softNeutral: T,
+	softPrimary: E,
+	softAccent: D,
+	softSuccess: O,
+	softWarning: k,
+	softDanger: A,
+	softInfo: j,
+	solidNeutral: M,
+	solidPrimary: N,
+	solidAccent: P,
+	solidSuccess: F,
+	solidWarning: I,
+	solidDanger: L,
+	solidInfo: R,
+	radiusNone: z,
+	radiusXs: B,
+	radiusSm: V,
+	radiusMd: H,
+	radiusLg: U,
+	radiusXl: W,
+	radius2xl: G,
+	radiusPill: K,
+	shadowNone: q,
+	shadowXs: J,
+	shadowSm: Y,
+	shadowMd: X,
+	shadowLg: Z,
+	shadowXl: Q,
+	borderDefault: $,
+	borderStrong: ee,
+	displayBlock: te,
+	displayInline: ne,
+	displayInlineBlock: re,
+	displayFlex: ie,
+	displayInlineFlex: ae,
+	displayGrid: oe,
+	displayInlineGrid: se,
+	displayContents: ce,
+	displayNone: le,
+	positionStatic: ue,
+	positionRelative: de,
+	positionAbsolute: fe,
+	positionFixed: pe,
+	positionSticky: me,
+	overflowVisible: he,
+	overflowHidden: ge,
+	overflowAuto: _e,
+	overflowScroll: ve,
+	overflowClip: ye,
+	textStart: be,
+	textCenter: xe,
+	textEnd: Se,
+	textJustify: Ce
+};
+//#endregion
+export { $ as borderDefault, ee as borderStrong, we as default, te as displayBlock, ce as displayContents, ie as displayFlex, oe as displayGrid, ne as displayInline, re as displayInlineBlock, ae as displayInlineFlex, se as displayInlineGrid, le as displayNone, g as height, c as m, b as maxHeight, v as maxWidth, p as mb, y as minHeight, _ as minWidth, m as ml, f as mr, d as mt, l as mx, u as my, _e as overflowAuto, ye as overflowClip, ge as overflowHidden, ve as overflowScroll, he as overflowVisible, t as p, o as pb, s as pl, fe as positionAbsolute, pe as positionFixed, de as positionRelative, ue as positionStatic, me as positionSticky, a as pr, i as pt, n as px, r as py, G as radius2xl, U as radiusLg, H as radiusMd, z as radiusNone, K as radiusPill, V as radiusSm, W as radiusXl, B as radiusXs, e as root, Z as shadowLg, X as shadowMd, q as shadowNone, Y as shadowSm, Q as shadowXl, J as shadowXs, D as softAccent, A as softDanger, j as softInfo, T as softNeutral, E as softPrimary, O as softSuccess, k as softWarning, P as solidAccent, L as solidDanger, R as solidInfo, M as solidNeutral, N as solidPrimary, F as solidSuccess, I as solidWarning, x as surfaceBg, C as surfaceRaised, w as surfaceSunken, S as surfaceSurface, xe as textCenter, Se as textEnd, Ce as textJustify, be as textStart, h as width };

package/dist/components/layout/Box/index.d.ts

@@ -0,0 +1 @@
+export * from './Box';

package/dist/components/layout/Container/Container.cjs.js

@@ -0,0 +1 @@
+const e=require("../../../utils/cx.cjs.js"),t=require("./Container.module.css.cjs.js");let n=require("react/jsx-runtime");var r={xs:t.default[`size-xs`],sm:t.default[`size-sm`],md:t.default[`size-md`],lg:t.default[`size-lg`],xl:t.default[`size-xl`],"2xl":t.default[`size-2xl`],full:t.default[`size-full`],prose:t.default[`size-prose`]},i={responsive:t.default[`gutter-responsive`],0:t.default[`gutter-0`],1:t.default[`gutter-1`],2:t.default[`gutter-2`],3:t.default[`gutter-3`],4:t.default[`gutter-4`],5:t.default[`gutter-5`],6:t.default[`gutter-6`],8:t.default[`gutter-8`],10:t.default[`gutter-10`],12:t.default[`gutter-12`],16:t.default[`gutter-16`],20:t.default[`gutter-20`],24:t.default[`gutter-24`]},a={0:t.default[`py-0`],1:t.default[`py-1`],2:t.default[`py-2`],3:t.default[`py-3`],4:t.default[`py-4`],5:t.default[`py-5`],6:t.default[`py-6`],8:t.default[`py-8`],10:t.default[`py-10`],12:t.default[`py-12`],16:t.default[`py-16`],20:t.default[`py-20`],24:t.default[`py-24`]},o=({as:o,size:s=`xl`,gutter:c=`responsive`,fluid:l=!1,centerContent:u=!1,py:d,className:f,...p})=>(0,n.jsx)(o??`div`,{...p,className:e.cx(t.default.root,r[s],l&&t.default.fluid,i[c],d!==void 0&&a[d],u&&t.default.centerContent,f)});exports.Container=o;

package/dist/components/layout/Container/Container.d.ts

@@ -0,0 +1,30 @@
+import { ComponentPropsWithRef, ReactNode } from 'react';
+import { Space } from '../../../types/common';
+/** Max-width step for a Container. */
+export type ContainerSize = "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "full" | "prose";
+/** Side gutter: a spacing step, or `"responsive"` (16px phone, 24px from 640px, 32px from 1024px). */
+export type ContainerGutter = Space | "responsive";
+/** Elements a Container can render as. Landmark elements give page structure to assistive tech. */
+export type ContainerElement = "div" | "main" | "section" | "header" | "footer" | "article";
+interface ContainerOwnProps<E extends ContainerElement> {
+    /** Element to render. Use `main`, `header`, `footer`, `section`, or `article` for landmarks and structure. */
+    as?: E;
+    /** Max width of the content: xs 480px, sm 640px, md 768px, lg 1024px, xl 1280px, 2xl 1536px, full 100%, prose 65ch. */
+    size?: ContainerSize;
+    /** Horizontal padding on both sides. `"responsive"` grows with the viewport. */
+    gutter?: ContainerGutter;
+    /** Removes the max width, keeping only the gutters. Overrides `size`. */
+    fluid?: boolean;
+    /** Stacks children in a column and centers them horizontally. */
+    centerContent?: boolean;
+    /** Vertical padding (top and bottom), as a spacing step. */
+    py?: Space;
+    children?: ReactNode;
+}
+export type ContainerProps<E extends ContainerElement = "div"> = ContainerOwnProps<E> & Omit<ComponentPropsWithRef<E>, keyof ContainerOwnProps<E>>;
+/**
+ * Centers content with a max width and responsive side gutters.
+ * Never overflows its parent, so content reflows down to 320px wide.
+ */
+export declare const Container: <E extends ContainerElement = "div">({ as, size, gutter, fluid, centerContent, py, className, ...rest }: ContainerProps<E>) => import("react").JSX.Element;
+export {};

package/dist/components/layout/Container/Container.mjs

@@ -0,0 +1,48 @@
+import { cx as e } from "../../../utils/cx.mjs";
+import t from "./Container.module.css.mjs";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/layout/Container/Container.tsx
+var r = {
+	xs: t["size-xs"],
+	sm: t["size-sm"],
+	md: t["size-md"],
+	lg: t["size-lg"],
+	xl: t["size-xl"],
+	"2xl": t["size-2xl"],
+	full: t["size-full"],
+	prose: t["size-prose"]
+}, i = {
+	responsive: t["gutter-responsive"],
+	0: t["gutter-0"],
+	1: t["gutter-1"],
+	2: t["gutter-2"],
+	3: t["gutter-3"],
+	4: t["gutter-4"],
+	5: t["gutter-5"],
+	6: t["gutter-6"],
+	8: t["gutter-8"],
+	10: t["gutter-10"],
+	12: t["gutter-12"],
+	16: t["gutter-16"],
+	20: t["gutter-20"],
+	24: t["gutter-24"]
+}, a = {
+	0: t["py-0"],
+	1: t["py-1"],
+	2: t["py-2"],
+	3: t["py-3"],
+	4: t["py-4"],
+	5: t["py-5"],
+	6: t["py-6"],
+	8: t["py-8"],
+	10: t["py-10"],
+	12: t["py-12"],
+	16: t["py-16"],
+	20: t["py-20"],
+	24: t["py-24"]
+}, o = ({ as: o, size: s = "xl", gutter: c = "responsive", fluid: l = !1, centerContent: u = !1, py: d, className: f, ...p }) => /* @__PURE__ */ n(o ?? "div", {
+	...p,
+	className: e(t.root, r[s], l && t.fluid, i[c], d !== void 0 && a[d], u && t.centerContent, f)
+});
+//#endregion
+export { o as Container };

package/dist/components/layout/Container/Container.module.css.cjs.js

@@ -0,0 +1 @@
+var e=`_root_ck5mc_15`,t=`_fluid_ck5mc_65`,n=`_centerContent_ck5mc_155`,r={root:e,"size-xs":`_size-xs_ck5mc_41`,"size-sm":`_size-sm_ck5mc_43`,"size-md":`_size-md_ck5mc_45`,"size-lg":`_size-lg_ck5mc_47`,"size-xl":`_size-xl_ck5mc_49`,"size-2xl":`_size-2xl_ck5mc_51`,"size-full":`_size-full_ck5mc_57`,"size-prose":`_size-prose_ck5mc_59`,fluid:t,"gutter-responsive":`_gutter-responsive_ck5mc_75`,"gutter-0":`_gutter-0_ck5mc_95`,"gutter-1":`_gutter-1_ck5mc_97`,"gutter-2":`_gutter-2_ck5mc_99`,"gutter-3":`_gutter-3_ck5mc_101`,"gutter-4":`_gutter-4_ck5mc_103`,"gutter-5":`_gutter-5_ck5mc_105`,"gutter-6":`_gutter-6_ck5mc_107`,"gutter-8":`_gutter-8_ck5mc_109`,"gutter-10":`_gutter-10_ck5mc_111`,"gutter-12":`_gutter-12_ck5mc_113`,"gutter-16":`_gutter-16_ck5mc_115`,"gutter-20":`_gutter-20_ck5mc_117`,"gutter-24":`_gutter-24_ck5mc_119`,"py-0":`_py-0_ck5mc_125`,"py-1":`_py-1_ck5mc_127`,"py-2":`_py-2_ck5mc_129`,"py-3":`_py-3_ck5mc_131`,"py-4":`_py-4_ck5mc_133`,"py-5":`_py-5_ck5mc_135`,"py-6":`_py-6_ck5mc_137`,"py-8":`_py-8_ck5mc_139`,"py-10":`_py-10_ck5mc_141`,"py-12":`_py-12_ck5mc_143`,"py-16":`_py-16_ck5mc_145`,"py-20":`_py-20_ck5mc_147`,"py-24":`_py-24_ck5mc_149`,centerContent:n};exports.centerContent=n,exports.default=r,exports.fluid=t,exports.root=e;

package/dist/components/layout/Container/Container.module.css.mjs

@@ -0,0 +1,43 @@
+//#region src/components/layout/Container/Container.module.css
+var e = "_root_ck5mc_15", t = "_fluid_ck5mc_65", n = "_centerContent_ck5mc_155", r = {
+	root: e,
+	"size-xs": "_size-xs_ck5mc_41",
+	"size-sm": "_size-sm_ck5mc_43",
+	"size-md": "_size-md_ck5mc_45",
+	"size-lg": "_size-lg_ck5mc_47",
+	"size-xl": "_size-xl_ck5mc_49",
+	"size-2xl": "_size-2xl_ck5mc_51",
+	"size-full": "_size-full_ck5mc_57",
+	"size-prose": "_size-prose_ck5mc_59",
+	fluid: t,
+	"gutter-responsive": "_gutter-responsive_ck5mc_75",
+	"gutter-0": "_gutter-0_ck5mc_95",
+	"gutter-1": "_gutter-1_ck5mc_97",
+	"gutter-2": "_gutter-2_ck5mc_99",
+	"gutter-3": "_gutter-3_ck5mc_101",
+	"gutter-4": "_gutter-4_ck5mc_103",
+	"gutter-5": "_gutter-5_ck5mc_105",
+	"gutter-6": "_gutter-6_ck5mc_107",
+	"gutter-8": "_gutter-8_ck5mc_109",
+	"gutter-10": "_gutter-10_ck5mc_111",
+	"gutter-12": "_gutter-12_ck5mc_113",
+	"gutter-16": "_gutter-16_ck5mc_115",
+	"gutter-20": "_gutter-20_ck5mc_117",
+	"gutter-24": "_gutter-24_ck5mc_119",
+	"py-0": "_py-0_ck5mc_125",
+	"py-1": "_py-1_ck5mc_127",
+	"py-2": "_py-2_ck5mc_129",
+	"py-3": "_py-3_ck5mc_131",
+	"py-4": "_py-4_ck5mc_133",
+	"py-5": "_py-5_ck5mc_135",
+	"py-6": "_py-6_ck5mc_137",
+	"py-8": "_py-8_ck5mc_139",
+	"py-10": "_py-10_ck5mc_141",
+	"py-12": "_py-12_ck5mc_143",
+	"py-16": "_py-16_ck5mc_145",
+	"py-20": "_py-20_ck5mc_147",
+	"py-24": "_py-24_ck5mc_149",
+	centerContent: n
+};
+//#endregion
+export { n as centerContent, r as default, t as fluid, e as root };

package/dist/components/layout/Container/index.d.ts

@@ -0,0 +1 @@
+export * from './Container';

package/dist/components/layout/Divider/Divider.cjs.js

@@ -0,0 +1 @@
+const e=require("../../../utils/cx.cjs.js"),t=require("./Divider.module.css.cjs.js");let n=require("react/jsx-runtime");var r={solid:t.default.solid,dashed:t.default.dashed,dotted:t.default.dotted},i={thin:t.default.thin,thick:t.default.thick},a={neutral:t.default.toneNeutral,strong:t.default.toneStrong,primary:t.default.tonePrimary,accent:t.default.toneAccent,success:t.default.toneSuccess,warning:t.default.toneWarning,danger:t.default.toneDanger,info:t.default.toneInfo},o={none:void 0,start:t.default.insetStart,end:t.default.insetEnd,both:t.default.insetBoth},s={start:t.default.labelStart,center:t.default.labelCenter,end:t.default.labelEnd};function c({orientation:c=`horizontal`,variant:l=`solid`,thickness:u=`thin`,tone:d=`neutral`,spacing:f=4,inset:p=`none`,label:m,children:h,labelPosition:g=`center`,decorative:_=!1,className:v,style:y,ref:b,...x}){let S=m??h,C=S!=null&&S!==!1&&S!==``,w=c===`vertical`,T=e.cx(t.default.root,w?t.default.vertical:t.default.horizontal,r[l],i[u],a[d],o[p],C?t.default.labeled:t.default.plain,C&&s[g],v),E={"--divider-spacing":`var(--space-${f})`,...y};return C?(0,n.jsxs)(`div`,{..._?{"aria-hidden":!0}:{},...x,ref:b,className:T,style:E,children:[(0,n.jsx)(`span`,{className:t.default.line,"aria-hidden":`true`}),(0,n.jsx)(`span`,{className:t.default.label,children:S}),(0,n.jsx)(`span`,{className:t.default.line,"aria-hidden":`true`})]}):_?(0,n.jsx)(`div`,{"aria-hidden":`true`,...x,ref:b,className:T,style:E}):w?(0,n.jsx)(`div`,{role:`separator`,"aria-orientation":`vertical`,...x,ref:b,className:T,style:E}):(0,n.jsx)(`hr`,{...x,ref:b,className:T,style:E})}exports.Divider=c;

package/dist/components/layout/Divider/Divider.d.ts

@@ -0,0 +1,65 @@
+import { ComponentPropsWithRef, ReactNode, Ref } from 'react';
+import { Orientation, Space, Tone } from '../../../types/common';
+/** Line style of a Divider. */
+export type DividerVariant = "solid" | "dashed" | "dotted";
+/** Line thickness: `thin` uses `--border-width`, `thick` uses `--border-width-thick`. */
+export type DividerThickness = "thin" | "thick";
+/**
+ * Line color.
+ * - `neutral` (default): the standard hairline, `--color-border`.
+ * - `strong`: a more visible neutral line, `--color-border-strong`.
+ * - Any other `Tone`: `--color-{tone}-border`.
+ */
+export type DividerTone = Tone | "strong";
+/**
+ * Shortens the line from one or both ends (by `--space-6`), e.g. to line up
+ * with text that sits after an icon or avatar.
+ */
+export type DividerInset = "none" | "start" | "end" | "both";
+/** Where the inline label sits along the line. */
+export type DividerLabelPosition = "start" | "center" | "end";
+export interface DividerProps extends Omit<ComponentPropsWithRef<"div">, "children" | "ref"> {
+    /** Direction of the line. Vertical dividers stretch to the height of a flex row. */
+    orientation?: Orientation;
+    /** Line style. */
+    variant?: DividerVariant;
+    /** Line thickness. */
+    thickness?: DividerThickness;
+    /** Line color. `neutral` is the standard hairline; `strong` is a darker neutral; other tones use `--color-{tone}-border`. */
+    tone?: DividerTone;
+    /** Space around the line on the cross axis (block margin when horizontal, inline margin when vertical), as a `--space-*` step. */
+    spacing?: Space;
+    /** Shorten the line from its start, end, or both ends. */
+    inset?: DividerInset;
+    /**
+     * Inline label shown in the line (e.g. "or", "Second half"). Rendered as
+     * readable text, not inside an `<hr>`. `children` works the same way;
+     * `label` wins when both are set.
+     */
+    label?: ReactNode;
+    /** Label content, as an alternative to `label`. */
+    children?: ReactNode;
+    /** Where the label sits along the line. Ignored without a label. */
+    labelPosition?: DividerLabelPosition;
+    /**
+     * Purely visual line. Hides the whole divider (including any label) from
+     * assistive technology with `aria-hidden="true"` and no separator role.
+     */
+    decorative?: boolean;
+    /** Ref to the root element (`<hr>` for a plain horizontal divider, otherwise a `<div>`). */
+    ref?: Ref<HTMLElement>;
+}
+/**
+ * A line that separates content, horizontally or vertically, with an
+ * optional inline label.
+ *
+ * Semantics:
+ * - Horizontal, no label: a native `<hr>` (implicit `role="separator"`).
+ * - Vertical, no label: `<div role="separator" aria-orientation="vertical">`.
+ * - With a label: a `<div>` whose line segments are hidden and whose label is
+ *   plain, readable text. A `separator`'s children are presentational in ARIA,
+ *   so putting the label inside one risks it not being announced; reading it
+ *   as text in document order is the most reliable.
+ * - `decorative`: `aria-hidden="true"`, no role; hidden from assistive tech.
+ */
+export declare function Divider({ orientation, variant, thickness, tone, spacing, inset, label, children, labelPosition, decorative, className, style, ref, ...rest }: DividerProps): import("react").JSX.Element;

package/dist/components/layout/Divider/Divider.mjs

@@ -0,0 +1,77 @@
+import { cx as e } from "../../../utils/cx.mjs";
+import t from "./Divider.module.css.mjs";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region src/components/layout/Divider/Divider.tsx
+var i = {
+	solid: t.solid,
+	dashed: t.dashed,
+	dotted: t.dotted
+}, a = {
+	thin: t.thin,
+	thick: t.thick
+}, o = {
+	neutral: t.toneNeutral,
+	strong: t.toneStrong,
+	primary: t.tonePrimary,
+	accent: t.toneAccent,
+	success: t.toneSuccess,
+	warning: t.toneWarning,
+	danger: t.toneDanger,
+	info: t.toneInfo
+}, s = {
+	none: void 0,
+	start: t.insetStart,
+	end: t.insetEnd,
+	both: t.insetBoth
+}, c = {
+	start: t.labelStart,
+	center: t.labelCenter,
+	end: t.labelEnd
+};
+function l({ orientation: l = "horizontal", variant: u = "solid", thickness: d = "thin", tone: f = "neutral", spacing: p = 4, inset: m = "none", label: h, children: g, labelPosition: _ = "center", decorative: v = !1, className: y, style: b, ref: x, ...S }) {
+	let C = h ?? g, w = C != null && C !== !1 && C !== "", T = l === "vertical", E = e(t.root, T ? t.vertical : t.horizontal, i[u], a[d], o[f], s[m], w ? t.labeled : t.plain, w && c[_], y), D = {
+		"--divider-spacing": `var(--space-${p})`,
+		...b
+	};
+	return w ? /* @__PURE__ */ r("div", {
+		...v ? { "aria-hidden": !0 } : {},
+		...S,
+		ref: x,
+		className: E,
+		style: D,
+		children: [
+			/* @__PURE__ */ n("span", {
+				className: t.line,
+				"aria-hidden": "true"
+			}),
+			/* @__PURE__ */ n("span", {
+				className: t.label,
+				children: C
+			}),
+			/* @__PURE__ */ n("span", {
+				className: t.line,
+				"aria-hidden": "true"
+			})
+		]
+	}) : v ? /* @__PURE__ */ n("div", {
+		"aria-hidden": "true",
+		...S,
+		ref: x,
+		className: E,
+		style: D
+	}) : T ? /* @__PURE__ */ n("div", {
+		role: "separator",
+		"aria-orientation": "vertical",
+		...S,
+		ref: x,
+		className: E,
+		style: D
+	}) : /* @__PURE__ */ n("hr", {
+		...S,
+		ref: x,
+		className: E,
+		style: D
+	});
+}
+//#endregion
+export { l as Divider };

package/dist/components/layout/Divider/Divider.module.css.cjs.js

@@ -0,0 +1 @@
+var e=`_root_z4fkr_9`,t=`_horizontal_z4fkr_47`,n=`_vertical_z4fkr_61`,r=`_plain_z4fkr_77`,i=`_solid_z4fkr_99`,a=`_dashed_z4fkr_105`,o=`_dotted_z4fkr_111`,s=`_thin_z4fkr_121`,c=`_thick_z4fkr_127`,l=`_toneNeutral_z4fkr_143`,u=`_toneStrong_z4fkr_151`,d=`_tonePrimary_z4fkr_159`,f=`_toneAccent_z4fkr_167`,p=`_toneSuccess_z4fkr_175`,m=`_toneWarning_z4fkr_183`,h=`_toneDanger_z4fkr_191`,g=`_toneInfo_z4fkr_199`,_=`_insetStart_z4fkr_211`,v=`_insetEnd_z4fkr_217`,y=`_insetBoth_z4fkr_223`,b=`_labeled_z4fkr_255`,x=`_line_z4fkr_285`,S=`_labelStart_z4fkr_319`,C=`_labelEnd_z4fkr_325`,w=`_labelCenter_z4fkr_331`,T=`_label_z4fkr_255`,E={root:e,horizontal:t,vertical:n,plain:r,solid:i,dashed:a,dotted:o,thin:s,thick:c,toneNeutral:l,toneStrong:u,tonePrimary:d,toneAccent:f,toneSuccess:p,toneWarning:m,toneDanger:h,toneInfo:g,insetStart:_,insetEnd:v,insetBoth:y,labeled:b,line:x,labelStart:S,labelEnd:C,labelCenter:w,label:T};exports.dashed=a,exports.default=E,exports.dotted=o,exports.horizontal=t,exports.insetBoth=y,exports.insetEnd=v,exports.insetStart=_,exports.label=T,exports.labelCenter=w,exports.labelEnd=C,exports.labelStart=S,exports.labeled=b,exports.line=x,exports.plain=r,exports.root=e,exports.solid=i,exports.thick=c,exports.thin=s,exports.toneAccent=f,exports.toneDanger=h,exports.toneInfo=g,exports.toneNeutral=l,exports.tonePrimary=d,exports.toneStrong=u,exports.toneSuccess=p,exports.toneWarning=m,exports.vertical=n;

package/dist/components/layout/Divider/Divider.module.css.mjs

@@ -0,0 +1,31 @@
+//#region src/components/layout/Divider/Divider.module.css
+var e = "_root_z4fkr_9", t = "_horizontal_z4fkr_47", n = "_vertical_z4fkr_61", r = "_plain_z4fkr_77", i = "_solid_z4fkr_99", a = "_dashed_z4fkr_105", o = "_dotted_z4fkr_111", s = "_thin_z4fkr_121", c = "_thick_z4fkr_127", l = "_toneNeutral_z4fkr_143", u = "_toneStrong_z4fkr_151", d = "_tonePrimary_z4fkr_159", f = "_toneAccent_z4fkr_167", p = "_toneSuccess_z4fkr_175", m = "_toneWarning_z4fkr_183", h = "_toneDanger_z4fkr_191", g = "_toneInfo_z4fkr_199", _ = "_insetStart_z4fkr_211", v = "_insetEnd_z4fkr_217", y = "_insetBoth_z4fkr_223", b = "_labeled_z4fkr_255", x = "_line_z4fkr_285", S = "_labelStart_z4fkr_319", C = "_labelEnd_z4fkr_325", w = "_labelCenter_z4fkr_331", T = "_label_z4fkr_255", E = {
+	root: e,
+	horizontal: t,
+	vertical: n,
+	plain: r,
+	solid: i,
+	dashed: a,
+	dotted: o,
+	thin: s,
+	thick: c,
+	toneNeutral: l,
+	toneStrong: u,
+	tonePrimary: d,
+	toneAccent: f,
+	toneSuccess: p,
+	toneWarning: m,
+	toneDanger: h,
+	toneInfo: g,
+	insetStart: _,
+	insetEnd: v,
+	insetBoth: y,
+	labeled: b,
+	line: x,
+	labelStart: S,
+	labelEnd: C,
+	labelCenter: w,
+	label: T
+};
+//#endregion
+export { a as dashed, E as default, o as dotted, t as horizontal, y as insetBoth, v as insetEnd, _ as insetStart, T as label, w as labelCenter, C as labelEnd, S as labelStart, b as labeled, x as line, r as plain, e as root, i as solid, c as thick, s as thin, f as toneAccent, h as toneDanger, g as toneInfo, l as toneNeutral, d as tonePrimary, u as toneStrong, p as toneSuccess, m as toneWarning, n as vertical };

package/dist/components/layout/Divider/index.d.ts

@@ -0,0 +1 @@
+export * from './Divider';

package/dist/components/layout/Flex/Flex.cjs.js

@@ -0,0 +1 @@
+const e=require("../../../utils/responsive.cjs.js"),t=require("../../../utils/cx.cjs.js"),n=require("./Flex.module.css.cjs.js");let r=require("react/jsx-runtime");var i={start:`flex-start`,center:`center`,end:`flex-end`,stretch:`stretch`,baseline:`baseline`},a={start:`flex-start`,center:`center`,end:`flex-end`,between:`space-between`,around:`space-around`,evenly:`space-evenly`},o={start:`flex-start`,center:`center`,end:`flex-end`,between:`space-between`,around:`space-around`,evenly:`space-evenly`,stretch:`stretch`},s={auto:n.default.selfAuto,start:n.default.selfStart,center:n.default.selfCenter,end:n.default.selfEnd,stretch:n.default.selfStretch,baseline:n.default.selfBaseline},c=e.responsiveClasses(n.default,`dir`),l=e.responsiveClasses(n.default,`wrap`),u=e.responsiveClasses(n.default,`align`),d=e.responsiveClasses(n.default,`justify`),f=e.responsiveClasses(n.default,`content`),p=e.responsiveClasses(n.default,`rowGap`),m=e.responsiveClasses(n.default,`columnGap`),h=e=>`var(--space-${e})`;function g({as:s,direction:g,wrap:_,align:v,justify:y,alignContent:b,gap:x,rowGap:S,columnGap:C,inline:w=!1,fullWidth:T=!1,className:E,style:D,...O}){let k=s??`div`,A={},j=[];return e.responsiveVars(`flex-dir`,g,String,c,A,j),e.responsiveVars(`flex-wrap`,_,String,l,A,j),e.responsiveVars(`flex-align`,v,e=>i[e],u,A,j),e.responsiveVars(`flex-justify`,y,e=>a[e],d,A,j),e.responsiveVars(`flex-content`,b,e=>o[e],f,A,j),e.cascadedVars(`flex-row-gap`,e.mapCascaded(e.firstCascaded(S,x),h),p,A,j),e.cascadedVars(`flex-column-gap`,e.mapCascaded(e.firstCascaded(C,x),h),m,A,j),(0,r.jsx)(k,{className:t.cx(n.default.root,w&&n.default.inline,T&&n.default.fullWidth,...j,E),style:{...A,...D},...O})}var _=e=>String(typeof e==`boolean`?+!!e:e);function v({as:e,grow:i,shrink:a,basis:o,order:c,alignSelf:l,className:u,style:d,...f}){let p=e??`div`,m={};return i!==void 0&&(m[`--flex-item-grow`]=_(i)),a!==void 0&&(m[`--flex-item-shrink`]=_(a)),o!==void 0&&(m[`--flex-item-basis`]=typeof o==`number`?`${o}px`:o),c!==void 0&&(m[`--flex-item-order`]=String(c)),(0,r.jsx)(p,{className:t.cx(i!==void 0&&n.default.itemGrow,a!==void 0&&n.default.itemShrink,o!==void 0&&n.default.itemBasis,c!==void 0&&n.default.itemOrder,l&&s[l],u)||void 0,style:{...m,...d},...f})}g.Item=v,exports.Flex=g,exports.FlexItem=v;