@wallarm-org/design-system 0.71.4 → 0.72.0

package/dist/theme/fonts/geist.css

@@ -0,0 +1,21 @@
+/* Self-hosted Geist variable fonts (sans + mono).
+   Previously loaded via the `non.geist` npm package, which the design system
+   relied on consumers importing themselves — a v1→v2 family-name rename in that
+   package meant the webfont silently stopped matching for end users. Shipping the
+   variable woff2 files here (same pattern as geist-pixel.css) makes the design
+   system self-contained: the font travels with the tokens, no consumer setup. */
+@font-face {
+    font-family: 'Geist-Variable';
+    font-style: normal;
+    font-weight: 100 900;
+    font-display: swap;
+    src: url('./Geist-Variable.woff2') format('woff2');
+}
+
+@font-face {
+    font-family: 'GeistMono-Variable';
+    font-style: normal;
+    font-weight: 100 900;
+    font-display: swap;
+    src: url('./GeistMono-Variable.woff2') format('woff2');
+}

package/dist/theme/index.css

@@ -10,6 +10,7 @@
 @import './shadow.css';
 @import './spacing.css';
 @import './typography.css';
+@import './fonts/geist.css';
 @import './fonts/geist-pixel.css';
 @import './semantic.css';
 @import './focus.css';

package/dist/theme/typography.css

@@ -1,12 +1,14 @@
 @theme {
+    /* Geist variable fonts are self-hosted — see fonts/geist.css.
+       'Geist-Variable' / 'GeistMono-Variable' are the @font-face family names. */
     --font-sans:
-        'Geist Variable', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji',
+        'Geist-Variable', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji',
         'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
     --font-sans-display:
-        'Geist Variable', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji',
+        'Geist-Variable', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji',
         'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
     --font-mono:
-        'Geist Mono Variable', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
+        'GeistMono-Variable', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
         'Liberation Mono', 'Courier New', monospace;
     --font-pixel: 'Geist Pixel', ui-sans-serif, system-ui, sans-serif;
     --font-serif: 'Inter', ui-serif, Georgia, Cambria, 'Times New Roman', Times, serif;

package/dist/utils/Collapse.d.ts

@@ -0,0 +1,18 @@
+import type { FC, HTMLAttributes, ReactNode, Ref } from 'react';
+export interface CollapseProps extends HTMLAttributes<HTMLDivElement> {
+    ref?: Ref<HTMLDivElement>;
+    /** Whether the content is expanded. */
+    open: boolean;
+    children?: ReactNode;
+    /**
+     * Mark the collapsed content `inert` so hidden focusable elements are removed
+     * from tab and accessibility order while closed.
+     */
+    inertWhenClosed?: boolean;
+}
+/**
+ * Smoothly expands/collapses its content via a `grid-template-rows` transition
+ * (0fr ↔ 1fr) with an inner `overflow-hidden` wrapper. Shared by Tree and
+ * TreeView so the collapse animation lives in one place.
+ */
+export declare const Collapse: FC<CollapseProps>;

package/dist/utils/Collapse.js

@@ -0,0 +1,15 @@
+import { jsx } from "react/jsx-runtime";
+import { cn } from "./cn.js";
+const Collapse = ({ ref, open, children, className, inertWhenClosed = false, ...props })=>/*#__PURE__*/ jsx("div", {
+        ref: ref,
+        "data-state": open ? 'open' : 'closed',
+        className: cn('grid transition-[grid-template-rows] duration-[220ms] ease-[cubic-bezier(0.4,0,0.2,1)] motion-reduce:transition-none', open ? 'grid-rows-[1fr]' : 'grid-rows-[0fr]', className),
+        ...props,
+        children: /*#__PURE__*/ jsx("div", {
+            className: "overflow-hidden",
+            inert: inertWhenClosed && !open ? true : void 0,
+            children: children
+        })
+    });
+Collapse.displayName = 'Collapse';
+export { Collapse };

package/dist/utils/treeDepth.d.ts

@@ -0,0 +1,11 @@
+declare const TREE_DEFAULT_INDENT = 24;
+export interface TreeDepthContextValue {
+    depth: number;
+    indent: number;
+    gap: number | undefined;
+}
+export declare const TreeDepthProvider: import("react").Provider<TreeDepthContextValue>;
+export declare function useTreeDepth(): number;
+export declare function useTreeIndent(): number;
+export declare function useTreeGap(): number | undefined;
+export { TREE_DEFAULT_INDENT };

package/dist/utils/treeDepth.js

@@ -0,0 +1,18 @@
+import { createContext, useContext } from "react";
+const TREE_DEFAULT_INDENT = 24;
+const TreeDepthContext = createContext({
+    depth: 0,
+    indent: TREE_DEFAULT_INDENT,
+    gap: void 0
+});
+const TreeDepthProvider = TreeDepthContext.Provider;
+function useTreeDepth() {
+    return useContext(TreeDepthContext).depth;
+}
+function useTreeIndent() {
+    return useContext(TreeDepthContext).indent;
+}
+function useTreeGap() {
+    return useContext(TreeDepthContext).gap;
+}
+export { TREE_DEFAULT_INDENT, TreeDepthProvider, useTreeDepth, useTreeGap, useTreeIndent };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wallarm-org/design-system",
-  "version": "0.71.4",
+  "version": "0.72.0",
   "description": "Core design system library with React components and Storybook documentation",
   "publishConfig": {
     "access": "public",
@@ -111,7 +111,6 @@
     "@wallarm-org/vitest-config": "workspace:*",
     "glob": "^13.0.0",
     "lodash-es": "4.17.23",
-    "non.geist": "catalog:",
     "postcss": "8.5.6",
     "postcss-import": "16.1.1",
     "storybook": "catalog:",
@@ -149,7 +148,6 @@
   },
   "peerDependencies": {
     "@internationalized/date": "^3.12.0",
-    "non.geist": "^2.0.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
     "tailwindcss": "^4.0.0",