@nizivo/react 0.0.0-stage → 0.2.0

package/dist/choice-card/choice-card.client.js

@@ -0,0 +1,138 @@
+"use client";
+import { cx } from "../_internal/cx.js";
+import { mergeProps } from "../contracts/merge-props.js";
+import { renderElement } from "../contracts/render.js";
+import { details } from "../contracts/details.js";
+import { stateAttrs } from "../contracts/state.js";
+import { useFieldControl } from "../field/field-scope.client.js";
+import { clearFocus, definedProps, markFocus, markKeyDown } from "../_internal/nested-focus.js";
+import { createContext, use, useId, useMemo } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/choice-card/choice-card.client.tsx
+const GroupContext = createContext(null);
+function ChoiceCardGroup({ value, defaultValue, onValueChange, name, form, required, disabled, invalid, "aria-describedby": describedBy, "aria-labelledby": labelledBy, render, className, children, ...rest }) {
+	const field = useFieldControl({
+		name,
+		required,
+		disabled,
+		invalid,
+		"aria-describedby": describedBy
+	});
+	const generated = useId();
+	const { required: radioRequired, onInvalid, onInput, onBlur } = field.controlProps;
+	const groupName = field.name ?? generated;
+	const group = useMemo(() => ({
+		name: groupName,
+		value,
+		defaultValue,
+		disabled: field.disabled,
+		radio: definedProps({
+			required: radioRequired,
+			form,
+			onInvalid,
+			onInput,
+			onBlur
+		}),
+		onValueChange
+	}), [
+		groupName,
+		value,
+		defaultValue,
+		field.disabled,
+		radioRequired,
+		form,
+		onInvalid,
+		onInput,
+		onBlur,
+		onValueChange
+	]);
+	return /* @__PURE__ */ jsx(GroupContext, {
+		value: group,
+		children: renderElement("div", render, {
+			disabled: field.disabled,
+			invalid: field.invalid
+		}, {
+			"data-slot": "choice-card-group",
+			...stateAttrs({
+				disabled: field.disabled,
+				invalid: field.invalid,
+				required: field.required
+			}),
+			...rest,
+			role: "radiogroup",
+			"aria-labelledby": labelledBy ?? field.labelledBy,
+			"aria-describedby": field.describedBy,
+			"aria-invalid": field.invalid ? true : void 0,
+			"aria-required": field.required ? true : void 0,
+			className: cx("nz-choice-card-group", className),
+			children
+		})
+	});
+}
+function ChoiceCard({ value, disabled, leading, description, trailing, render, className, children, ...rest }) {
+	const group = use(GroupContext);
+	if (group === null) throw new Error("ChoiceCard must be inside ChoiceCardGroup");
+	const off = disabled === true || group.disabled;
+	const id = useId();
+	const labelId = `${id}-label`;
+	const descriptionId = description == null ? void 0 : `${id}-description`;
+	const trailingId = trailing == null ? void 0 : `${id}-trailing`;
+	const checked = group.value === void 0 ? { defaultChecked: group.defaultValue === value } : { checked: group.value === value };
+	const onChange = (event) => {
+		if (event.currentTarget.checked) group.onValueChange?.(value, details("input", event.nativeEvent));
+	};
+	return renderElement("label", render, { disabled: off }, {
+		"data-slot": "choice-card",
+		...stateAttrs({ disabled: off }),
+		...rest,
+		className: cx("nz-choice-card", className),
+		children: /* @__PURE__ */ jsxs(Fragment, { children: [
+			/* @__PURE__ */ jsx("input", {
+				...mergeProps(group.radio, {
+					onChange,
+					onFocus: markFocus,
+					onBlur: clearFocus,
+					onKeyDown: markKeyDown
+				}),
+				...checked,
+				type: "radio",
+				className: "nz-choice-card-input",
+				"data-slot": "choice-card-input",
+				name: group.name,
+				value,
+				disabled: off || void 0,
+				"aria-labelledby": trailingId === void 0 ? labelId : `${labelId} ${trailingId}`,
+				"aria-describedby": descriptionId
+			}),
+			leading != null && /* @__PURE__ */ jsx("span", {
+				className: "nz-choice-card-leading",
+				"data-slot": "choice-card-leading",
+				"aria-hidden": "true",
+				children: leading
+			}),
+			/* @__PURE__ */ jsxs("span", {
+				className: "nz-choice-card-content",
+				"data-slot": "choice-card-content",
+				children: [/* @__PURE__ */ jsx("span", {
+					className: "nz-choice-card-label",
+					"data-slot": "choice-card-label",
+					id: labelId,
+					children
+				}), description != null && /* @__PURE__ */ jsx("span", {
+					className: "nz-choice-card-description",
+					"data-slot": "choice-card-description",
+					id: descriptionId,
+					children: description
+				})]
+			}),
+			trailing != null && /* @__PURE__ */ jsx("span", {
+				className: "nz-choice-card-trailing",
+				"data-slot": "choice-card-trailing",
+				id: trailingId,
+				children: trailing
+			})
+		] })
+	});
+}
+//#endregion
+export { ChoiceCard, ChoiceCardGroup };

package/dist/choice-card/index.d.ts

@@ -0,0 +1,2 @@
+import { ChoiceCard, ChoiceCardChangeReason, ChoiceCardGroup, ChoiceCardGroupProps, ChoiceCardGroupState, ChoiceCardProps, ChoiceCardState } from "./choice-card.client.js";
+export { ChoiceCard, type ChoiceCardChangeReason, ChoiceCardGroup, type ChoiceCardGroupProps, type ChoiceCardGroupState, type ChoiceCardProps, type ChoiceCardState };

package/dist/choice-card/index.js

@@ -0,0 +1 @@
+export { ChoiceCard, ChoiceCardGroup } from "./choice-card.client.js";

package/dist/config/config.client.d.ts

@@ -0,0 +1,24 @@
+import { enUS } from "../locales/en-US.js";
+import { JSX, ReactNode } from "react";
+//#region src/config/config.client.d.ts
+/**
+ * Built-in strings for every client part in the scope, shaped like the `enUS` catalogue
+ * (`@nizivo/react/locales/en-US`): keyed by component, every key and every string optional, so a
+ * whole catalogue of another locale fits. Read by the client parts the Strings guide lists; the
+ * other keys (server parts such as Pagination, Button and Breadcrumb, which cannot read a context,
+ * and AlertDismiss) are ignored here, and those parts take `labels` per instance.
+ */
+export type NizivoLabels = { [K in keyof typeof enUS]?: Partial<(typeof enUS)[K]>; };
+export interface NizivoConfigProps {
+  /** BCP 47 tag used by engine-backed parts. @default 'en-US' */
+  locale?: string;
+  /**
+   * Built-in strings for the client parts in this scope. A part's own `labels` prop wins key by
+   * key; a key neither sets falls back to the English default. Keep the object stable (a module
+   * constant or memoised), as with any context value.
+   */
+  labels?: NizivoLabels;
+  children?: ReactNode;
+}
+export declare function NizivoConfig({ locale, labels, children }: NizivoConfigProps): JSX.Element;
+//#endregion

package/dist/config/config.client.js

@@ -0,0 +1,33 @@
+"use client";
+import { createContext, use, useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/config/config.client.tsx
+const ConfigContext = createContext({ locale: "en-US" });
+function NizivoConfig({ locale = "en-US", labels, children }) {
+	const value = useMemo(() => ({
+		locale,
+		labels
+	}), [locale, labels]);
+	return /* @__PURE__ */ jsx(ConfigContext, {
+		value,
+		children
+	});
+}
+/** The resolved locale. Internal: engine roots read it through EngineLocale. */
+function useResolvedLocale() {
+	return use(ConfigContext).locale;
+}
+/**
+* A client part's labels: its own `labels` prop over the scope's `NizivoConfig labels[key]`, key by
+* key. Undefined when neither sets anything, so the part's own English default applies.
+* Internal: server parts never call it (they cannot read a context).
+*/
+function useLabels(key, own) {
+	const scope = use(ConfigContext).labels?.[key];
+	return scope === void 0 ? own : {
+		...scope,
+		...own
+	};
+}
+//#endregion
+export { NizivoConfig, useLabels, useResolvedLocale };

package/dist/config/index.d.ts

@@ -0,0 +1,2 @@
+import { NizivoConfig, NizivoConfigProps, NizivoLabels } from "./config.client.js";
+export { NizivoConfig, type NizivoConfigProps, type NizivoLabels };

package/dist/config/index.js

@@ -0,0 +1 @@
+export { NizivoConfig } from "./config.client.js";

package/dist/container/container.d.ts

@@ -0,0 +1,13 @@
+import { RenderProp } from "../contracts/render.js";
+import { ComponentPropsWithRef, ReactElement } from "react";
+//#region src/container/container.d.ts
+export interface ContainerProps extends ComponentPropsWithRef<"div"> {
+  /** Another element, for example `render={<main />}`. */
+  render?: RenderProp<Record<string, never>>;
+}
+/**
+ * Centres page content: at most `--nz-layout-content-max` wide (358, 976, 1280 px by viewport), with
+ * the responsive page margin `--nz-grid-margin` (16, 24, 32 px) on both sides.
+ */
+export declare function Container({ render, className, ...rest }: ContainerProps): ReactElement;
+//#endregion

package/dist/container/container.js

@@ -0,0 +1,16 @@
+import { cx } from "../_internal/cx.js";
+import { renderElement } from "../contracts/render.js";
+//#region src/container/container.tsx
+/**
+* Centres page content: at most `--nz-layout-content-max` wide (358, 976, 1280 px by viewport), with
+* the responsive page margin `--nz-grid-margin` (16, 24, 32 px) on both sides.
+*/
+function Container({ render, className, ...rest }) {
+	return renderElement("div", render, {}, {
+		"data-slot": "container",
+		...rest,
+		className: cx("nz-container", className)
+	});
+}
+//#endregion
+export { Container };

package/dist/container/index.d.ts

@@ -0,0 +1,2 @@
+import { Container, ContainerProps } from "./container.js";
+export { Container, type ContainerProps };

package/dist/container/index.js

@@ -0,0 +1 @@
+export { Container } from "./container.js";

package/dist/contracts/details.d.ts

@@ -0,0 +1,13 @@
+//#region src/contracts/details.d.ts
+/**
+ * The second argument of every `on<X>Change(value, details)`. `reason` is Nizivo-owned: where the
+ * engine reports no cause, it is `'unknown'`, never a guess.
+ */
+export interface ChangeDetails<R extends string> {
+  reason: R | "unknown";
+  event?: Event;
+}
+/** Why an overlay opened or closed (§12.2). */
+export type OpenReason = "trigger" | "escape" | "outside-press" | "close-part" | "item-press" | "hidden" | "programmatic";
+export declare function details<R extends string = never>(reason: NoInfer<R> | "unknown", event?: Event): ChangeDetails<R>;
+//#endregion

package/dist/contracts/details.js

@@ -0,0 +1,9 @@
+//#region src/contracts/details.ts
+function details(reason, event) {
+	return event === void 0 ? { reason } : {
+		reason,
+		event
+	};
+}
+//#endregion
+export { details };

package/dist/contracts/index.d.ts

@@ -0,0 +1,5 @@
+import { RenderProp, renderElement, toRenderFn } from "./render.js";
+import { ChangeDetails, OpenReason, details } from "./details.js";
+import { Align, Orientation, STATE_ATTR_NAMES, Side, StateAttrs, StateInput, stateAttrs } from "./state.js";
+import { mergeProps } from "./merge-props.js";
+export { type Align, type ChangeDetails, type OpenReason, type Orientation, type RenderProp, STATE_ATTR_NAMES, type Side, type StateAttrs, type StateInput, details, mergeProps, renderElement, stateAttrs, toRenderFn };

package/dist/contracts/index.js

@@ -0,0 +1,5 @@
+import { mergeProps } from "./merge-props.js";
+import { renderElement, toRenderFn } from "./render.js";
+import { details } from "./details.js";
+import { STATE_ATTR_NAMES, stateAttrs } from "./state.js";
+export { STATE_ATTR_NAMES, details, mergeProps, renderElement, stateAttrs, toRenderFn };

package/dist/contracts/merge-props.d.ts

@@ -0,0 +1,16 @@
+//#region src/contracts/merge-props.d.ts
+type Props = Record<string, unknown>;
+/**
+ * Merges prop objects from left ("ours") to right ("theirs"):
+ * - `className` is concatenated, ours first, without repeating a class;
+ * - `style` is shallow-merged, theirs winning;
+ * - `on*` handlers are chained theirs-first, and ours skip when the event was `defaultPrevented`;
+ * - refs are merged into one callback ref;
+ * - any other key: the right-most defined value wins, and `undefined` never overrides.
+ *
+ * A function is created only when both sides supply one, so a server component that merges a
+ * consumer element never synthesises a handler or ref (functions cannot cross the RSC boundary).
+ */
+export declare function mergeProps(...sources: ReadonlyArray<Props | undefined>): Props;
+//#endregion
+export {};

package/dist/contracts/merge-props.js

@@ -0,0 +1,76 @@
+import { cx } from "../_internal/cx.js";
+//#region src/contracts/merge-props.ts
+/**
+* Merges prop objects from left ("ours") to right ("theirs"):
+* - `className` is concatenated, ours first, without repeating a class;
+* - `style` is shallow-merged, theirs winning;
+* - `on*` handlers are chained theirs-first, and ours skip when the event was `defaultPrevented`;
+* - refs are merged into one callback ref;
+* - any other key: the right-most defined value wins, and `undefined` never overrides.
+*
+* A function is created only when both sides supply one, so a server component that merges a
+* consumer element never synthesises a handler or ref (functions cannot cross the RSC boundary).
+*/
+function mergeProps(...sources) {
+	const out = {};
+	for (const source of sources) {
+		if (source === void 0) continue;
+		for (const key of Object.keys(source)) {
+			const theirs = source[key];
+			if (theirs === void 0) continue;
+			const ours = out[key];
+			out[key] = ours === void 0 ? theirs : mergeValue(key, ours, theirs);
+		}
+	}
+	return out;
+}
+function mergeValue(key, ours, theirs) {
+	if (key === "className" && typeof ours === "string" && typeof theirs === "string") return cx(ours, theirs);
+	if (key === "style" && isObject(ours) && isObject(theirs)) return {
+		...ours,
+		...theirs
+	};
+	if (key === "ref" && isRef(ours) && isRef(theirs)) return mergeRefs(ours, theirs);
+	if (/^on[A-Z]/.test(key) && isFunction(ours) && isFunction(theirs)) return chain(theirs, ours);
+	return theirs;
+}
+function chain(theirs, ours) {
+	return (...args) => {
+		theirs(...args);
+		if (!isPrevented(args[0])) ours(...args);
+	};
+}
+function isPrevented(event) {
+	return isObject(event) && event["defaultPrevented"] === true;
+}
+function isObject(value) {
+	return typeof value === "object" && value !== null;
+}
+function isFunction(value) {
+	return typeof value === "function";
+}
+function isRefObject(value) {
+	return isObject(value) && "current" in value;
+}
+function isRef(value) {
+	return isFunction(value) || isRefObject(value);
+}
+/** Assigns `node` and returns the ref's React 19 cleanup, if it returned one. */
+function assignRef(ref, node) {
+	if (isFunction(ref)) {
+		const cleanup = ref(node);
+		return isFunction(cleanup) ? cleanup : void 0;
+	}
+	ref.current = node;
+}
+/** One callback ref for both; honours React 19 ref cleanups. */
+function mergeRefs(a, b) {
+	return (node) => {
+		const cleanups = [assignRef(a, node), assignRef(b, node)];
+		return () => {
+			cleanups.forEach((cleanup, i) => cleanup ? cleanup() : assignRef(i === 0 ? a : b, null));
+		};
+	};
+}
+//#endregion
+export { mergeProps };

package/dist/contracts/render.d.ts

@@ -0,0 +1,17 @@
+import { ReactElement } from "react";
+//#region src/contracts/render.d.ts
+/**
+ * Composition without `asChild` or a polymorphic `as`:
+ * - element form: `render={<Link href="/orders" />}`, serializable from Server Components;
+ * - function form: `render={(props, state) => <a {...props} />}`, client code only.
+ */
+export type RenderProp<S> = ReactElement | ((props: Record<string, unknown>, state: S) => ReactElement);
+/**
+ * Renders `tag` with `props`, or the consumer's element/function with `props` merged in (ours first).
+ * Element form: `mergeProps` semantics (the element's props win), except that the part's own
+ * `PART_OWNED` attributes win over the element's.
+ */
+export declare function renderElement<S>(tag: string, render: RenderProp<S> | undefined, state: S, props: Record<string, unknown>): ReactElement;
+/** Normalises any render prop to the function form that engine adapters receive. */
+export declare function toRenderFn<S>(render: RenderProp<S> | undefined, tag: string): (props: Record<string, unknown>, state: S) => ReactElement;
+//#endregion

package/dist/contracts/render.js

@@ -0,0 +1,43 @@
+import { mergeProps } from "./merge-props.js";
+import { cloneElement, createElement, isValidElement } from "react";
+//#region src/contracts/render.ts
+/**
+* The presentational attributes (the `presentational` group of contracts/vocabulary.json). They
+* describe the part, so when a part renders through an element, the part's values win. That element
+* may be a server Button that RSC has already rendered to a host `<button data-slot="button">`.
+*/
+const PART_OWNED = [
+	"data-slot",
+	"data-variant",
+	"data-size",
+	"data-tone",
+	"data-full-width",
+	"data-padding",
+	"data-elevation",
+	"data-shape",
+	"data-gap",
+	"data-span",
+	"data-span-sm",
+	"data-span-lg",
+	"data-ratio"
+];
+/**
+* Renders `tag` with `props`, or the consumer's element/function with `props` merged in (ours first).
+* Element form: `mergeProps` semantics (the element's props win), except that the part's own
+* `PART_OWNED` attributes win over the element's.
+*/
+function renderElement(tag, render, state, props) {
+	if (typeof render === "function") return render(props, state);
+	if (isValidElement(render)) {
+		const merged = mergeProps(props, render.props);
+		for (const name of PART_OWNED) if (props[name] !== void 0) merged[name] = props[name];
+		return cloneElement(render, merged);
+	}
+	return createElement(tag, props);
+}
+/** Normalises any render prop to the function form that engine adapters receive. */
+function toRenderFn(render, tag) {
+	return (props, state) => renderElement(tag, render, state, props);
+}
+//#endregion
+export { PART_OWNED, renderElement, toRenderFn };

package/dist/contracts/state.d.ts

@@ -0,0 +1,42 @@
+//#region src/contracts/state.d.ts
+/** Value sets of the valued attributes, in contracts/vocabulary.json order (checked by the test). */
+export declare const SIDES: readonly ["top", "right", "bottom", "left"];
+export declare const ALIGNS: readonly ["start", "center", "end"];
+export declare const ORIENTATIONS: readonly ["horizontal", "vertical"];
+export declare const MIRRORS: readonly ["rtl"];
+export type Side = (typeof SIDES)[number];
+export type Align = (typeof ALIGNS)[number];
+export type Orientation = (typeof ORIENTATIONS)[number];
+/** Engine-independent state, as adapters derive it from the engine's render state. */
+export interface StateInput {
+  open?: boolean | undefined;
+  entering?: boolean | undefined;
+  exiting?: boolean | undefined;
+  side?: Side | undefined;
+  align?: Align | undefined;
+  nestedOpen?: boolean | undefined;
+  highlighted?: boolean | undefined;
+  selected?: boolean | undefined;
+  checked?: boolean | undefined;
+  indeterminate?: boolean | undefined;
+  pressed?: boolean | undefined;
+  focusVisible?: boolean | undefined;
+  disabled?: boolean | undefined;
+  readOnly?: boolean | undefined;
+  required?: boolean | undefined;
+  invalid?: boolean | undefined;
+  placeholder?: boolean | undefined;
+  orientation?: Orientation | undefined;
+  loading?: boolean | undefined;
+  pending?: boolean | undefined;
+  empty?: boolean | undefined;
+  error?: boolean | undefined;
+  mirror?: (typeof MIRRORS)[number] | undefined;
+}
+/** `data-*` attributes keyed by name; presence attributes carry `""`. */
+export type StateAttrs = Record<`data-${string}`, string>;
+/** Every attribute name `stateAttrs()` can emit. */
+export declare const STATE_ATTR_NAMES: readonly string[];
+/** Maps state to vocabulary attributes. False and absent states emit nothing. */
+export declare function stateAttrs(state: StateInput): StateAttrs;
+//#endregion

package/dist/contracts/state.js

@@ -0,0 +1,42 @@
+//#region src/contracts/state.ts
+const PRESENCE = [
+	["open", "data-open"],
+	["entering", "data-entering"],
+	["exiting", "data-exiting"],
+	["nestedOpen", "data-nested-open"],
+	["highlighted", "data-highlighted"],
+	["selected", "data-selected"],
+	["checked", "data-checked"],
+	["indeterminate", "data-indeterminate"],
+	["pressed", "data-pressed"],
+	["focusVisible", "data-focus-visible"],
+	["disabled", "data-disabled"],
+	["readOnly", "data-readonly"],
+	["required", "data-required"],
+	["invalid", "data-invalid"],
+	["placeholder", "data-placeholder"],
+	["loading", "data-loading"],
+	["pending", "data-pending"],
+	["empty", "data-empty"],
+	["error", "data-error"]
+];
+const VALUED = [
+	["side", "data-side"],
+	["align", "data-align"],
+	["orientation", "data-orientation"],
+	["mirror", "data-mirror"]
+];
+/** Every attribute name `stateAttrs()` can emit. */
+const STATE_ATTR_NAMES = [...PRESENCE, ...VALUED].map(([, name]) => name);
+/** Maps state to vocabulary attributes. False and absent states emit nothing. */
+function stateAttrs(state) {
+	const out = {};
+	for (const [key, name] of PRESENCE) if (state[key] === true) out[name] = "";
+	for (const [key, name] of VALUED) {
+		const value = state[key];
+		if (value !== void 0) out[name] = value;
+	}
+	return out;
+}
+//#endregion
+export { STATE_ATTR_NAMES, stateAttrs };

package/dist/css/alert.css

@@ -0,0 +1,2 @@
+@layer nz.tokens, nz.themes, nz.reset, nz.base, nz.components, nz.patterns, nz.utilities;
+@layer nz.components{.nz-alert{--_nz-alert-bg:var(--nz-bg-info-subtle);--_nz-alert-icon-fg:var(--nz-icon-info);align-items:flex-start;gap:var(--nz-alert-gap,var(--nz-space-3));padding-block:var(--nz-alert-padding-block,var(--nz-space-3));padding-inline:var(--nz-alert-padding-inline,var(--nz-space-4));border-radius:var(--nz-alert-radius,var(--nz-radius-lg));background:var(--nz-alert-bg,var(--_nz-alert-bg));color:var(--nz-text-primary);display:flex}.nz-alert-icon{inline-size:var(--nz-size-icon-md);block-size:var(--nz-size-icon-md);color:var(--nz-alert-icon-fg,var(--_nz-alert-icon-fg));font-size:var(--nz-size-icon-md);flex:none;display:inline-flex;&>svg{block-size:100%;inline-size:100%}}.nz-alert-content{gap:var(--nz-space-0-5);flex-direction:column;flex:1;min-inline-size:0;display:flex}.nz-alert-title{font:var(--nz-alert-title-font,var(--nz-font-label-m-strong))}.nz-alert-description{color:var(--nz-text-secondary);font:var(--nz-alert-description-font,var(--nz-font-body-m))}.nz-alert-action{gap:var(--nz-space-2);flex-wrap:wrap;margin-block-start:var(--nz-space-2);display:flex}.nz-alert-dismiss{flex:none}.nz-alert>.nz-icon-button.nz-alert-dismiss{--_nz-icon-button-fg:var(--nz-alert-dismiss-fg,var(--nz-icon-secondary));margin-block:calc((var(--nz-size-icon-md) - var(--nz-size-control-sm)) / 2);margin-inline:calc((var(--nz-size-icon-sm) - var(--nz-size-control-sm)) / 2)}.nz-alert[data-tone=success]{--_nz-alert-bg:var(--nz-bg-success-subtle);--_nz-alert-icon-fg:var(--nz-icon-success)}.nz-alert[data-tone=warning]{--_nz-alert-bg:var(--nz-bg-warning-subtle);--_nz-alert-icon-fg:var(--nz-icon-warning)}.nz-alert[data-tone=critical]{--_nz-alert-bg:var(--nz-bg-critical-subtle);--_nz-alert-icon-fg:var(--nz-icon-critical)}@media (forced-colors:active){.nz-alert{outline-offset:-1px;outline:1px solid canvastext}}}

package/dist/css/app-shell.css

@@ -0,0 +1,2 @@
+@layer nz.tokens, nz.themes, nz.reset, nz.base, nz.components, nz.patterns, nz.utilities;
+@layer nz.components{.nz-app-shell{background:var(--nz-app-shell-bg,var(--nz-bg-canvas));min-block-size:100dvh;color:var(--nz-text-primary);grid-template-columns:auto minmax(0,1fr);display:grid}.nz-app-shell-skip{z-index:var(--nz-z-overlay);padding:var(--nz-space-2) var(--nz-space-3);border-radius:var(--nz-radius-md);background:var(--nz-bg-inverse);color:var(--nz-text-inverse);font:var(--nz-font-label-m-strong);letter-spacing:var(--nz-tracking-label-m-strong);translate:0 calc(-100% - var(--nz-space-4));text-decoration:none;position:fixed;inset-block-start:var(--nz-space-2);inset-inline-start:var(--nz-space-2);&:focus-visible{translate:none}}.nz-app-shell-sidebar{grid-column:1}.nz-app-shell-frame{flex-direction:column;grid-column:2;min-inline-size:0;display:flex}.nz-app-shell-main{box-sizing:border-box;inline-size:100%;max-inline-size:calc(var(--nz-layout-content-max) + 2 * var(--nz-grid-margin));padding:var(--nz-app-shell-main-padding,var(--nz-section-gap) var(--nz-grid-margin));outline:none;flex:auto;margin-inline:auto;padding-block-end:calc(var(--nz-section-gap) + var(--nz-layout-bottom-inset,0px))}.nz-app-shell-sidebar,.nz-app-shell-top-bar{display:none}.nz-app-shell-tab-bar{z-index:var(--nz-z-chrome);position:fixed;inset-block-end:0;inset-inline:0}@media (width>=40rem){.nz-app-shell-sidebar,.nz-app-shell-top-bar{display:block}.nz-app-shell-mobile-top-bar,.nz-app-shell-tab-bar{display:none}}}

package/dist/css/avatar.css

@@ -0,0 +1,2 @@
+@layer nz.tokens, nz.themes, nz.reset, nz.base, nz.components, nz.patterns, nz.utilities;
+@layer nz.components{.nz-avatar{--_nz-avatar-size:var(--nz-space-8);--_nz-avatar-font:var(--nz-font-label-s);--_nz-avatar-tracking:var(--nz-tracking-label-s);box-sizing:border-box;inline-size:var(--nz-avatar-size,var(--_nz-avatar-size));block-size:var(--nz-avatar-size,var(--_nz-avatar-size));border-radius:var(--nz-avatar-radius,var(--nz-radius-full));background:var(--nz-avatar-bg,var(--nz-bg-brand-muted));color:var(--nz-avatar-fg,var(--nz-text-brand));font:var(--nz-avatar-font,var(--_nz-avatar-font));letter-spacing:var(--_nz-avatar-tracking);vertical-align:middle;flex:none;justify-content:center;align-items:center;display:inline-flex;position:relative;overflow:hidden}.nz-avatar[data-size=sm]{--_nz-avatar-size:var(--nz-space-6)}.nz-avatar[data-size=lg]{--_nz-avatar-size:var(--nz-space-10);--_nz-avatar-font:var(--nz-font-label-m);--_nz-avatar-tracking:var(--nz-tracking-label-m)}.nz-avatar[data-size=xl]{--_nz-avatar-size:calc(var(--nz-space-12) + var(--nz-space-2));--_nz-avatar-font:var(--nz-font-label-l);--_nz-avatar-tracking:var(--nz-tracking-label-l)}.nz-avatar-initials{white-space:nowrap}.nz-avatar-image{object-fit:cover;color:#0000;block-size:100%;inline-size:100%;display:block;position:absolute;inset:0}.nz-avatar-group{--_nz-avatar-group-size:var(--nz-space-8);--_nz-avatar-group-font:var(--nz-font-label-s);vertical-align:middle;align-items:center;display:inline-flex;&>.nz-avatar,&>.nz-avatar-group-more{box-shadow:0 0 0 var(--nz-border-width-focus) var(--nz-avatar-group-ring,var(--nz-bg-surface))}&>:not(:first-child){margin-inline-start:calc(-1 * var(--nz-space-2))}}.nz-avatar-group[data-size=sm]{--_nz-avatar-group-size:var(--nz-space-6)}.nz-avatar-group[data-size=lg]{--_nz-avatar-group-size:var(--nz-space-10);--_nz-avatar-group-font:var(--nz-font-label-m)}.nz-avatar-group[data-size=xl]{--_nz-avatar-group-size:calc(var(--nz-space-12) + var(--nz-space-2));--_nz-avatar-group-font:var(--nz-font-label-l)}.nz-avatar-group-more{box-sizing:border-box;inline-size:var(--_nz-avatar-group-size);block-size:var(--_nz-avatar-group-size);border-radius:var(--nz-radius-full);background:var(--nz-avatar-group-more-bg,var(--nz-bg-muted));color:var(--nz-avatar-group-more-fg,var(--nz-text-secondary));font:var(--_nz-avatar-group-font);font-variant-numeric:tabular-nums;white-space:nowrap;flex:none;justify-content:center;align-items:center;display:inline-flex}@media (forced-colors:active){.nz-avatar,.nz-avatar-group-more{outline-offset:-1px;outline:1px solid canvastext}}}

package/dist/css/badge.css

@@ -0,0 +1,2 @@
+@layer nz.tokens, nz.themes, nz.reset, nz.base, nz.components, nz.patterns, nz.utilities;
+@layer nz.components{.nz-badge{--_nz-badge-bg:var(--nz-bg-muted);--_nz-badge-fg:var(--nz-text-secondary);--_nz-badge-dot-bg:var(--nz-icon-secondary);align-items:center;gap:var(--nz-badge-gap,var(--nz-space-1-5));padding-block:var(--nz-space-0-5);padding-inline:var(--nz-badge-padding-inline,var(--nz-space-2));border-radius:var(--nz-badge-radius,var(--nz-radius-full));background:var(--nz-badge-bg,var(--_nz-badge-bg));color:var(--nz-badge-fg,var(--_nz-badge-fg));font:var(--nz-badge-font,var(--nz-font-label-m));white-space:nowrap;display:inline-flex}.nz-badge-dot{inline-size:var(--nz-space-1-5);block-size:var(--nz-space-1-5);border-radius:var(--nz-radius-full);background:var(--nz-badge-dot-bg,var(--_nz-badge-dot-bg));flex:none}.nz-badge[data-tone=success]{--_nz-badge-bg:var(--nz-bg-success-subtle);--_nz-badge-fg:var(--nz-text-success);--_nz-badge-dot-bg:var(--nz-icon-success)}.nz-badge[data-tone=warning]{--_nz-badge-bg:var(--nz-bg-warning-subtle);--_nz-badge-fg:var(--nz-text-warning);--_nz-badge-dot-bg:var(--nz-icon-warning)}.nz-badge[data-tone=critical]{--_nz-badge-bg:var(--nz-bg-critical-subtle);--_nz-badge-fg:var(--nz-text-critical);--_nz-badge-dot-bg:var(--nz-icon-critical)}.nz-badge[data-tone=info]{--_nz-badge-bg:var(--nz-bg-info-subtle);--_nz-badge-fg:var(--nz-text-info);--_nz-badge-dot-bg:var(--nz-icon-info)}.nz-badge[data-tone=brand]{--_nz-badge-bg:var(--nz-bg-brand);--_nz-badge-fg:var(--nz-text-on-brand);--_nz-badge-dot-bg:var(--nz-text-on-brand)}@media (forced-colors:active){.nz-badge{outline-offset:-1px;outline:1px solid canvastext}.nz-badge-dot{forced-color-adjust:none;background:canvastext}}}

package/dist/css/banner.css

@@ -0,0 +1,2 @@
+@layer nz.tokens, nz.themes, nz.reset, nz.base, nz.components, nz.patterns, nz.utilities;
+@layer nz.components{.nz-banner{--_nz-banner-bg:var(--nz-bg-brand-subtle);--_nz-banner-icon-fg:var(--nz-icon-brand);align-items:center;gap:var(--nz-banner-gap,var(--nz-space-5));padding-block:var(--nz-banner-padding-block,var(--nz-space-4));padding-inline:var(--nz-banner-padding-inline,var(--nz-space-6));border-radius:var(--nz-banner-radius,var(--nz-radius-xl));background:var(--nz-banner-bg,var(--_nz-banner-bg));color:var(--nz-text-primary);flex-wrap:wrap;display:flex}.nz-banner[data-tone=warning]{--_nz-banner-bg:var(--nz-bg-warning-subtle);--_nz-banner-icon-fg:var(--nz-icon-warning)}.nz-banner-icon{color:var(--nz-banner-icon-fg,var(--_nz-banner-icon-fg));font-size:var(--nz-size-icon-lg);flex:none;display:inline-flex;&>svg{block-size:1em;inline-size:1em}}.nz-banner-media{flex:none;block-size:4.5rem;inline-size:4.5rem;display:inline-flex;overflow:hidden;&>:is(img,svg,picture,video){object-fit:contain;block-size:100%;inline-size:100%}}.nz-banner-content{gap:var(--nz-space-0-5);flex-direction:column;flex:16rem;min-inline-size:0;display:flex}.nz-banner-title{font:var(--nz-banner-title-font,var(--nz-font-heading-h4));letter-spacing:var(--nz-tracking-heading-h4)}.nz-banner-description{color:var(--nz-text-secondary);font:var(--nz-banner-description-font,var(--nz-font-body-m));letter-spacing:var(--nz-tracking-body-m)}.nz-banner-action{gap:var(--nz-space-2);flex-wrap:wrap;flex:none;display:flex}.nz-banner-dismiss{flex:none;margin-inline-start:auto}.nz-banner>.nz-icon-button.nz-banner-dismiss{--_nz-icon-button-fg:var(--nz-banner-dismiss-fg,var(--nz-icon-secondary))}@media (forced-colors:active){.nz-banner{outline-offset:-1px;outline:1px solid canvastext}}}

package/dist/css/base.css

@@ -0,0 +1,2 @@
+@layer nz.tokens, nz.themes, nz.reset, nz.base, nz.components, nz.patterns, nz.utilities;
+@layer nz.base{:where(.nz-alert-dismiss,.nz-app-shell-skip,.nz-banner-dismiss,.nz-breadcrumb-link,.nz-button,.nz-checkbox-input,.nz-dialog-close,.nz-dialog-trigger,.nz-drawer-close,.nz-drawer-trigger,.nz-form-summary,.nz-form-summary-link,.nz-icon-button,.nz-menu-trigger,.nz-mobile-tab-bar-link,.nz-mobile-tab-bar-more-trigger,.nz-native-select-trigger,.nz-nav-item,.nz-pagination-next,.nz-pagination-page,.nz-pagination-previous,.nz-password-input-toggle,.nz-popover-close,.nz-popover-trigger,.nz-radio-input,.nz-ranked-list-action,.nz-select-trigger,.nz-sidebar-item,.nz-switch-input,.nz-tab-nav-link,.nz-table-row-link,.nz-table-sort-button,.nz-tabs-tab,.nz-textarea,.nz-toast,.nz-toast-action,.nz-toast-close,.nz-toast-region,.nz-tooltip-trigger):is(:focus-visible,[data-focus-visible]){outline:var(--nz-border-width-focus) solid var(--nz-border-focus);outline-offset:2px}:where(.nz-menu-checkbox-item,.nz-menu-item,.nz-menu-radio-item,.nz-select-item):focus-visible{outline:none}:where(.nz-menu-checkbox-item,.nz-menu-item,.nz-menu-radio-item,.nz-select-item)[data-focus-visible],:where(.nz-chip,.nz-choice-card,.nz-file-upload-dropzone,.nz-segmented-control-item):is(:has(>input:focus-visible),[data-focus-visible]),:where(.nz-input,.nz-password-input,.nz-search-field):focus-within{outline:var(--nz-border-width-focus) solid var(--nz-border-focus);outline-offset:2px}[data-focus-inset]:is(:focus-visible,[data-focus-visible],:focus-within),[data-focus-inset]:has(>input:focus-visible){outline-offset:-2px}:where(.nz-alert-dismiss,.nz-app-shell-skip,.nz-banner-dismiss,.nz-breadcrumb-link,.nz-button,.nz-checkbox-input,.nz-chip,.nz-choice-card,.nz-dialog-close,.nz-dialog-trigger,.nz-drawer-close,.nz-drawer-trigger,.nz-file-upload-dropzone,.nz-form-summary,.nz-form-summary-link,.nz-icon-button,.nz-menu-checkbox-item,.nz-menu-item,.nz-menu-radio-item,.nz-menu-trigger,.nz-mobile-tab-bar-link,.nz-mobile-tab-bar-more-trigger,.nz-native-select-trigger,.nz-nav-item,.nz-pagination-next,.nz-pagination-page,.nz-pagination-previous,.nz-password-input-toggle,.nz-popover-close,.nz-popover-trigger,.nz-radio-input,.nz-ranked-list-action,.nz-segmented-control-item,.nz-select-item,.nz-select-trigger,.nz-sidebar-item,.nz-switch-input,.nz-tab-nav-link,.nz-table-row-link,.nz-table-sort-button,.nz-tabs-tab,.nz-textarea,.nz-toast,.nz-toast-action,.nz-toast-close,.nz-toast-region,.nz-tooltip-trigger){touch-action:pan-x pan-y pinch-zoom}.nz-hit-target{position:relative}@media (pointer:coarse){.nz-hit-target:not([data-hit-inset]):after{content:"";inset:min(0px, calc((100% - var(--nz-size-touch-min)) / 2));position:absolute}}[data-nz-touch-targets=always] .nz-hit-target:not([data-hit-inset]):after{content:"";inset:min(0px, calc((100% - var(--nz-size-touch-min)) / 2));position:absolute}:dir(rtl) [data-mirror=rtl]{scale:-1 1}html{scroll-padding-block:var(--nz-layout-top-inset,0px) calc(var(--nz-layout-bottom-inset,0px) + var(--nz-toast-inset,0px))}@media (forced-colors:active){:where(.nz-checkbox-input,.nz-chip,.nz-choice-card,.nz-choice-card-input,.nz-dialog-popup,.nz-drawer-popup,.nz-menu-popup,.nz-popover-popup,.nz-radio-input,.nz-select-popup,.nz-switch-input,.nz-tooltip-popup){border:1px solid canvastext}:where(.nz-switch-thumb){forced-color-adjust:none;background:canvastext}:where(.nz-meter-track)::-moz-meter-bar{forced-color-adjust:none;background:highlight;outline-color:canvastext}:where(.nz-progress-bar-track)::-moz-progress-bar{forced-color-adjust:none;background:highlight;outline-color:canvastext}:where(.nz-meter-track)::-webkit-meter-even-less-good-value{forced-color-adjust:none;background:highlight;outline-color:canvastext}:where(.nz-meter-track)::-webkit-meter-optimum-value{forced-color-adjust:none;background:highlight;outline-color:canvastext}:where(.nz-meter-track)::-webkit-meter-suboptimum-value{forced-color-adjust:none;background:highlight;outline-color:canvastext}:where(.nz-progress-bar-track)::-webkit-progress-value{forced-color-adjust:none;background:highlight;outline-color:canvastext}:where(.nz-checkbox-input,.nz-choice-card-input,.nz-radio-input,.nz-switch-input):checked{forced-color-adjust:none;background:highlight;outline-color:canvastext}:where(.nz-chip,.nz-choice-card,.nz-segmented-control-item):has(>input:checked){outline:2px solid highlight}:where(.nz-checkbox-input):indeterminate{forced-color-adjust:none;background:highlight;outline-color:canvastext}:where(.nz-nav-item,.nz-pagination-page)[aria-current=page]{color:highlighttext;forced-color-adjust:none;background:highlight;outline-color:canvastext}:where(.nz-tab-nav-link)[aria-current=page]:before{forced-color-adjust:none;background:highlight;outline-color:canvastext}:where(.nz-icon-button)[aria-pressed=true],:where(.nz-menu-checkbox-item,.nz-menu-radio-item)[data-checked]{color:highlighttext;forced-color-adjust:none;background:highlight;outline-color:canvastext}:where(.nz-file-upload-dropzone)[data-drag-over]{outline:2px solid highlight}:where(.nz-select-item)[data-selected]{color:highlighttext;forced-color-adjust:none;background:highlight;outline-color:canvastext}:where(.nz-tabs-tab)[data-selected]:before{forced-color-adjust:none;background:highlight;outline-color:canvastext}}}@layer nz.utilities{.nz-visually-hidden{clip-path:inset(50%);white-space:nowrap;border:0;block-size:1px;inline-size:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}}

package/dist/css/breadcrumb.css

@@ -0,0 +1,2 @@
+@layer nz.tokens, nz.themes, nz.reset, nz.base, nz.components, nz.patterns, nz.utilities;
+@layer nz.components{.nz-breadcrumb-list{align-items:center;gap:0 var(--nz-breadcrumb-gap,var(--nz-space-1-5));font:var(--nz-font-label-m);letter-spacing:var(--nz-tracking-label-m);flex-wrap:wrap;margin:0;padding:0;list-style:none;display:flex}.nz-breadcrumb-item{align-items:center;gap:var(--nz-breadcrumb-gap,var(--nz-space-1-5));min-inline-size:0;display:inline-flex}.nz-breadcrumb-separator{inline-size:var(--nz-size-icon-sm);block-size:var(--nz-size-icon-sm);color:var(--nz-breadcrumb-separator-fg,var(--nz-icon-secondary));font-size:var(--nz-size-icon-sm);flex:none;justify-content:center;align-items:center;line-height:1;display:inline-flex;&>svg{block-size:100%;inline-size:100%}}.nz-breadcrumb-item:first-child>.nz-breadcrumb-separator{display:none}.nz-breadcrumb-link,.nz-breadcrumb-current{min-block-size:var(--nz-space-6);overflow-wrap:anywhere;align-items:center;display:inline-flex}.nz-breadcrumb-link{border-radius:var(--nz-radius-xs);color:var(--nz-breadcrumb-link-fg,var(--nz-text-secondary));transition:color var(--nz-duration-fast) var(--nz-easing-standard);text-decoration:none;@media (hover:hover){&:hover{color:var(--nz-breadcrumb-link-fg-hover,var(--nz-text-primary));text-underline-offset:var(--nz-space-1);text-decoration:underline}}}.nz-breadcrumb-current{color:var(--nz-breadcrumb-current-fg,var(--nz-text-primary));font-weight:var(--nz-font-label-m-strong-font-weight);letter-spacing:var(--nz-tracking-label-m-strong)}}

package/dist/css/button.css

@@ -0,0 +1,2 @@
+@layer nz.tokens, nz.themes, nz.reset, nz.base, nz.components, nz.patterns, nz.utilities;
+@layer nz.components{.nz-button{--_nz-button-bg:var(--nz-bg-surface);--_nz-button-bg-hover:var(--nz-bg-hover);--_nz-button-bg-pressed:var(--nz-bg-pressed);--_nz-button-fg:var(--nz-text-primary);--_nz-button-border:var(--nz-border-default);--_nz-button-border-hover:var(--nz-border-strong);--_nz-button-shadow:none;--_nz-button-height:var(--nz-size-control-md);--_nz-button-padding-inline:var(--nz-space-4);--_nz-button-gap:var(--nz-space-2);--_nz-button-radius:var(--nz-radius-md);--_nz-button-font:var(--nz-font-label-m);--_nz-button-icon-size:var(--nz-size-icon-sm);box-sizing:border-box;justify-content:center;align-items:center;gap:var(--nz-button-gap,var(--_nz-button-gap));block-size:var(--nz-button-height,var(--_nz-button-height));padding-inline:var(--nz-button-padding-inline,var(--_nz-button-padding-inline));border:var(--nz-border-width-default) solid var(--nz-button-border,var(--_nz-button-border));border-radius:var(--nz-button-radius,var(--_nz-button-radius));background:var(--nz-button-bg,var(--_nz-button-bg));color:var(--nz-button-fg,var(--_nz-button-fg));box-shadow:var(--nz-button-shadow,var(--_nz-button-shadow));font:var(--nz-button-font,var(--_nz-button-font));cursor:pointer;transition:background-color var(--nz-duration-fast) var(--nz-easing-standard), border-color var(--nz-duration-fast) var(--nz-easing-standard), scale var(--nz-duration-instant) var(--nz-easing-standard);text-decoration:none;display:inline-flex;@media (hover:hover){&:hover:not(:disabled,[data-disabled],[aria-disabled=true]){background:var(--nz-button-bg-hover,var(--_nz-button-bg-hover));border-color:var(--nz-button-border-hover,var(--_nz-button-border-hover))}}&:active:not(:disabled,[data-disabled],[aria-disabled=true]){background:var(--nz-button-bg-pressed,var(--_nz-button-bg-pressed));border-color:var(--nz-button-border-hover,var(--_nz-button-border-hover));scale:var(--nz-scale-press)}&:focus-visible{box-shadow:var(--nz-button-shadow,var(--_nz-button-shadow)), 0 0 0 calc(var(--nz-border-width-focus) + 4px) var(--nz-focus-halo)}&:is(:disabled,[data-disabled]){background:var(--nz-button-bg-disabled,var(--nz-bg-disabled));color:var(--nz-button-fg-disabled,var(--nz-text-disabled));border-color:var(--nz-border-subtle);box-shadow:none;cursor:not-allowed}&[data-pending]{cursor:progress}&[data-full-width]{inline-size:100%}}.nz-button[data-variant=primary]{--_nz-button-bg:var(--nz-bg-brand);--_nz-button-bg-hover:var(--nz-bg-brand-hover);--_nz-button-bg-pressed:var(--nz-bg-brand-pressed);--_nz-button-fg:var(--nz-text-on-brand);--_nz-button-border:transparent;--_nz-button-border-hover:transparent;--_nz-button-shadow:var(--nz-elevation-button)}.nz-button[data-variant=tertiary]{--_nz-button-bg:transparent;--_nz-button-border:transparent;--_nz-button-border-hover:transparent}.nz-button[data-variant=critical]{--_nz-button-bg:var(--nz-bg-critical);--_nz-button-bg-hover:var(--nz-bg-critical-hover);--_nz-button-bg-pressed:var(--nz-bg-critical-hover);--_nz-button-fg:var(--nz-text-on-critical);--_nz-button-border:transparent;--_nz-button-border-hover:transparent}.nz-button[data-variant=accent]{--_nz-button-bg:var(--nz-bg-accent);--_nz-button-bg-hover:var(--nz-bg-accent-hover);--_nz-button-bg-pressed:var(--nz-bg-accent-hover);--_nz-button-fg:var(--nz-text-on-accent);--_nz-button-border:transparent;--_nz-button-border-hover:transparent}.nz-button[data-size=sm]{--_nz-button-height:var(--nz-size-control-sm);--_nz-button-padding-inline:var(--nz-space-3);--_nz-button-gap:var(--nz-space-1-5);--_nz-button-radius:var(--nz-radius-sm)}.nz-button[data-size=lg]{--_nz-button-height:var(--nz-size-control-lg);--_nz-button-padding-inline:var(--nz-space-5);--_nz-button-font:var(--nz-font-label-l);--_nz-button-icon-size:var(--nz-size-icon-md)}.nz-button-icon{inline-size:var(--_nz-button-icon-size);block-size:var(--_nz-button-icon-size);font-size:var(--_nz-button-icon-size);display:inline-flex}.nz-button[data-pending] .nz-glyph-spinner{animation:nz-button-spin var(--nz-duration-spin) linear infinite}.nz-button-pending-label{white-space:nowrap;text-overflow:ellipsis;text-align:center;grid-area:1/2;display:none;overflow:hidden}.nz-button-pending-label+.nz-button-label{grid-area:1/2}@media (prefers-reduced-motion:reduce){.nz-button[data-pending]{grid-auto-flow:column;align-content:center;display:inline-grid}.nz-button-pending-label{display:block}.nz-button-pending-label+.nz-button-label{opacity:0}}[data-nz-motion=reduce] .nz-button[data-pending]{grid-auto-flow:column;align-content:center;display:inline-grid}[data-nz-motion=reduce] .nz-button-pending-label{display:block}[data-nz-motion=reduce] .nz-button-pending-label+.nz-button-label{opacity:0}@keyframes nz-button-spin{to{rotate:1turn}}@media (forced-colors:active){.nz-button{border-color:buttontext}}}

package/dist/css/card.css

@@ -0,0 +1,2 @@
+@layer nz.tokens, nz.themes, nz.reset, nz.base, nz.components, nz.patterns, nz.utilities;
+@layer nz.components{.nz-card{--_nz-card-bg:var(--nz-bg-surface);--_nz-card-border:var(--nz-border-subtle);--_nz-card-padding:var(--nz-space-6);--_nz-card-shadow:none;--_nz-card-pill:initial;gap:var(--nz-card-gap,var(--nz-space-5));padding:var(--nz-card-padding,var(--_nz-card-padding));border:var(--nz-border-width-default) solid var(--nz-card-border,var(--_nz-card-border));border-radius:var(--nz-card-radius,var(--nz-radius-xl));background:var(--nz-card-bg,var(--_nz-card-bg));--nz-surface:var(--nz-card-bg,var(--_nz-card-bg));box-shadow:var(--nz-card-shadow,var(--_nz-card-shadow));color:var(--nz-text-primary);flex-direction:column;display:flex}.nz-card[data-tone=subtle]{--_nz-card-bg:var(--nz-bg-subtle);--_nz-card-border:transparent}.nz-card[data-tone=brand]{--_nz-card-bg:var(--nz-bg-brand-subtle);--_nz-card-border:transparent;--_nz-card-pill:var(--nz-bg-surface)}.nz-card[data-tone=accent]{--_nz-card-bg:var(--nz-bg-accent-subtle);--_nz-card-border:transparent;--_nz-card-pill:var(--nz-bg-surface)}.nz-card:is([data-tone=brand],[data-tone=accent]) .nz-delta{--_nz-delta-fill:var(--_nz-card-pill)}.nz-card[data-padding=sm]{--_nz-card-padding:var(--nz-space-5)}.nz-card[data-elevation="1"]{--_nz-card-shadow:var(--nz-elevation-1)}.nz-card[data-tone=inverse]{--_nz-card-border:transparent}.nz-card-header{align-items:center;gap:var(--nz-space-1) var(--nz-space-3);grid-template-columns:minmax(0,1fr);display:grid}.nz-card-title{font:var(--nz-card-title-font,var(--nz-font-heading-h4));letter-spacing:var(--nz-tracking-heading-h4);grid-column:1;margin:0}.nz-card-description{color:var(--nz-text-secondary);font:var(--nz-font-body-m);grid-column:1;margin:0}.nz-card-action{align-items:center;gap:var(--nz-space-2);color:var(--nz-icon-secondary);grid-area:1/2;display:flex}.nz-card-body{min-inline-size:0}.nz-card-footer{align-items:center;gap:var(--nz-space-3);flex-wrap:wrap;display:flex}@media (forced-colors:active){.nz-card{border-color:canvastext}}}

package/dist/css/checkbox.css

@@ -0,0 +1,2 @@
+@layer nz.tokens, nz.themes, nz.reset, nz.base, nz.components, nz.patterns, nz.utilities;
+@layer nz.components{.nz-checkbox{--_nz-checkbox-size:1.25rem;justify-content:start;align-items:start;column-gap:var(--nz-checkbox-gap,var(--nz-space-2));color:var(--nz-text-primary);font:var(--nz-font-body-m);cursor:pointer;grid-template-columns:auto auto;display:inline-grid}.nz-checkbox-input,.nz-checkbox-indicator{grid-area:1/1;margin-block-start:calc((1lh - var(--nz-checkbox-size,var(--_nz-checkbox-size))) / 2)}.nz-checkbox-input{--_nz-checkbox-bg:var(--nz-bg-surface);--_nz-checkbox-border:var(--nz-border-control);appearance:none;box-sizing:border-box;inline-size:var(--nz-checkbox-size,var(--_nz-checkbox-size));block-size:var(--nz-checkbox-size,var(--_nz-checkbox-size));border:var(--nz-border-width-default) solid var(--_nz-checkbox-border);border-radius:var(--nz-checkbox-radius,var(--nz-radius-xs));background:var(--_nz-checkbox-bg);font:inherit;cursor:inherit;transition:background-color var(--nz-duration-fast) var(--nz-easing-standard), border-color var(--nz-duration-fast) var(--nz-easing-standard);margin-block-end:0;margin-inline:0}.nz-checkbox-input[aria-invalid=true]:not(:checked,:indeterminate){--_nz-checkbox-border:var(--nz-border-critical)}.nz-checkbox-input:is(:checked,:indeterminate){--_nz-checkbox-bg:var(--nz-checkbox-accent,var(--nz-bg-brand));--_nz-checkbox-border:transparent}@media (hover:hover){.nz-checkbox:hover>.nz-checkbox-input:not(:disabled,:checked,:indeterminate){--_nz-checkbox-border:var(--nz-border-control-hover)}}.nz-checkbox-input:disabled{--_nz-checkbox-bg:var(--nz-bg-disabled);--_nz-checkbox-border:var(--nz-border-subtle)}.nz-checkbox-input:disabled:is(:checked,:indeterminate){--_nz-checkbox-bg:var(--nz-bg-muted);--_nz-checkbox-border:transparent}.nz-checkbox-indicator{inline-size:var(--nz-checkbox-size,var(--_nz-checkbox-size));block-size:var(--nz-checkbox-size,var(--_nz-checkbox-size));color:var(--nz-text-on-brand);pointer-events:none;visibility:hidden;place-items:center;font-size:.875rem;display:grid;&>*{grid-area:1/1}}.nz-checkbox-input:is(:checked,:indeterminate)+.nz-checkbox-indicator{visibility:visible}.nz-checkbox-input:indeterminate+.nz-checkbox-indicator>.nz-glyph-check,.nz-checkbox-input:not(:indeterminate)+.nz-checkbox-indicator>.nz-glyph-minus{display:none}.nz-checkbox-input:disabled+.nz-checkbox-indicator{color:var(--nz-text-disabled)}.nz-checkbox-label{grid-area:1/2}.nz-checkbox:is([data-disabled],:has(>.nz-checkbox-input:disabled)){color:var(--nz-text-disabled);cursor:not-allowed}@media (forced-colors:active){.nz-checkbox-input:is(:checked,:indeterminate){forced-color-adjust:none;background:highlight}.nz-checkbox-input:disabled:is(:checked,:indeterminate){background:graytext}.nz-checkbox-indicator{color:highlighttext;forced-color-adjust:none}}}

package/dist/css/chip-group.css

@@ -0,0 +1,2 @@
+@layer nz.tokens, nz.themes, nz.reset, nz.base, nz.components, nz.patterns, nz.utilities;
+@layer nz.components{.nz-chip-group{gap:var(--nz-chip-group-gap,var(--nz-space-2));flex-wrap:wrap;display:flex}.nz-chip{--_nz-chip-edge:var(--nz-border-default);--_nz-chip-edge-width:var(--nz-border-width-default);justify-content:center;align-items:center;gap:var(--nz-space-2);box-sizing:border-box;min-inline-size:var(--nz-size-control-lg);block-size:var(--nz-chip-height,var(--nz-size-control-md));padding-inline:var(--nz-space-4);border-radius:var(--nz-chip-radius,var(--nz-radius-full));background:var(--nz-chip-bg,var(--nz-bg-surface));box-shadow:inset 0 0 0 var(--_nz-chip-edge-width) var(--_nz-chip-edge);color:var(--nz-chip-fg,var(--nz-text-primary));font:var(--nz-font-label-m);letter-spacing:var(--nz-tracking-label-m);white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color var(--nz-duration-fast) var(--nz-easing-standard), box-shadow var(--nz-duration-fast) var(--nz-easing-standard), color var(--nz-duration-fast) var(--nz-easing-standard);flex:none;display:inline-flex;position:relative;@media (hover:hover){&:hover:not(:has(>input:disabled,>input:checked)){--_nz-chip-edge:var(--nz-border-strong)}}&:has(>input:checked){--_nz-chip-edge:var(--nz-chip-edge-selected,var(--nz-border-brand));--_nz-chip-edge-width:var(--nz-border-width-focus)}&:has(>input:disabled){--_nz-chip-edge:var(--nz-border-subtle);background:var(--nz-bg-disabled);color:var(--nz-text-disabled);cursor:not-allowed}&:has(>input:checked:disabled){--_nz-chip-edge:var(--nz-border-strong)}}.nz-chip:has(>.nz-chip-leading){padding-inline:var(--nz-space-2) var(--nz-space-3)}.nz-chip-group[data-invalid]>.nz-chip:not(:has(>input:checked)){--_nz-chip-edge:var(--nz-border-critical)}.nz-chip-input{opacity:0;appearance:none;cursor:inherit;margin:0;position:absolute;inset:0}.nz-chip-leading{inline-size:var(--nz-chip-leading-size,var(--nz-size-icon-lg));block-size:var(--nz-chip-leading-size,var(--nz-size-icon-lg));border-radius:var(--nz-radius-full);outline:var(--nz-border-width-default) solid var(--nz-border-subtle);outline-offset:calc(var(--nz-border-width-default) * -1);flex:none;display:inline-flex;position:relative;overflow:hidden;&>:not(.nz-chip-strike){object-fit:cover;block-size:100%;inline-size:100%}}.nz-chip-label{text-overflow:ellipsis;overflow:hidden}.nz-chip-strike{border-radius:inherit;background:linear-gradient(to top right, transparent calc(50% - var(--nz-border-width-default)), var(--nz-chip-strike,var(--nz-border-strong)) calc(50% - var(--nz-border-width-default)), var(--nz-chip-strike,var(--nz-border-strong)) calc(50% + var(--nz-border-width-default)), transparent calc(50% + var(--nz-border-width-default)));pointer-events:none;position:absolute;inset:0}.nz-chip:has(.nz-chip-strike):not(:has(>input:disabled)){color:var(--nz-text-secondary)}@media (forced-colors:active){.nz-chip:has(>input:disabled){color:graytext}.nz-chip-strike{forced-color-adjust:none;background:linear-gradient(to top right,#0000 calc(50% - 1px),canvastext calc(50% - 1px) calc(50% + 1px),#0000 calc(50% + 1px))}}}