@dxos/ui-theme 0.0.0 → 0.8.4-main.05e74ebcff

package/dist/types/src/theme/components/treegrid.d.ts

@@ -0,0 +1,10 @@
+import type { ComponentFunction, Theme } from '@dxos/ui-types';
+export type TreegridStyleProps = Partial<{
+    level: number;
+    indent: boolean;
+}>;
+export declare const treegridRoot: ComponentFunction<TreegridStyleProps>;
+export declare const treegridRow: ComponentFunction<TreegridStyleProps>;
+export declare const treegridCell: ComponentFunction<TreegridStyleProps>;
+export declare const treegridTheme: Theme<TreegridStyleProps>;
+//# sourceMappingURL=treegrid.d.ts.map

package/dist/types/src/theme/components/treegrid.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"treegrid.d.ts","sourceRoot":"","sources":["../../../../../src/theme/components/treegrid.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAI/D,MAAM,MAAM,kBAAkB,GAAG,OAAO,CAAC;IACvC,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,OAAO,CAAC;CACjB,CAAC,CAAC;AAaH,eAAO,MAAM,YAAY,EAAE,iBAAiB,CAAC,kBAAkB,CAAqC,CAAC;AAErG,eAAO,MAAM,WAAW,EAAE,iBAAiB,CAAC,kBAAkB,CACY,CAAC;AAE3E,eAAO,MAAM,YAAY,EAAE,iBAAiB,CAAC,kBAAkB,CAC/B,CAAC;AAEjC,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,kBAAkB,CAInD,CAAC"}

package/dist/types/src/theme/index.d.ts

@@ -0,0 +1,4 @@
+export * from './components';
+export * from './primitives';
+export * from './theme';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/src/theme/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/theme/index.ts"],"names":[],"mappings":"AAIA,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC"}

package/dist/types/src/theme/primitives/column.d.ts

@@ -0,0 +1,29 @@
+import { type ComponentFunction } from '@dxos/ui-types';
+/**
+ * Column-aware theme utilities.
+ * Components apply these in their theme functions to participate in the Column grid
+ * without importing Column React components.
+ *
+ * CSS custom property cascade:
+ * - Column.Root sets `--dx-col: 2 / span 1` (center column placement).
+ * - ScrollArea.Viewport resets `--dx-col: auto` after consuming `--gutter`.
+ * - Components apply `grid-column: var(--dx-col, auto)` to auto-center in Column
+ *   or do nothing outside Column / inside ScrollArea.
+ */
+export declare const withColumn: {
+    /** Centers element in the Column grid via --dx-col. No-op outside Column or inside ScrollArea. */
+    center: () => string;
+    /** Propagates the Column grid to children via subgrid. No-op outside Column.
+     *  Direct children default to center column unless they are a dx-container (ScrollArea). */
+    propagate: () => string;
+    /** Resets --dx-col after consuming --gutter. Applied by ScrollArea.Viewport. */
+    consumed: () => string;
+};
+export type ColumnStyleProps = {};
+export declare const columnTheme: {
+    root: ComponentFunction<ColumnStyleProps>;
+    row: ComponentFunction<ColumnStyleProps>;
+    bleed: ComponentFunction<ColumnStyleProps>;
+    center: ComponentFunction<ColumnStyleProps>;
+};
+//# sourceMappingURL=column.d.ts.map

package/dist/types/src/theme/primitives/column.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"column.d.ts","sourceRoot":"","sources":["../../../../../src/theme/primitives/column.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAIxD;;;;;;;;;;GAUG;AACH,eAAO,MAAM,UAAU;IACrB,kGAAkG;IAClG,MAAM;IAEN;gGAC4F;IAC5F,SAAS;IAGT,gFAAgF;IAChF,QAAQ;CACT,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG,EAAE,CAAC;AAiClC,eAAO,MAAM,WAAW;IACtB,IAAI;IACJ,GAAG;IACH,KAAK;IACL,MAAM;CACP,CAAC"}

package/dist/types/src/theme/primitives/index.d.ts

@@ -0,0 +1,3 @@
+export * from './column';
+export * from './panel';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/src/theme/primitives/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/theme/primitives/index.ts"],"names":[],"mappings":"AAIA,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC"}

package/dist/types/src/theme/primitives/panel.d.ts

@@ -0,0 +1,13 @@
+import { type ComponentFunction } from '@dxos/ui-types';
+type Size = 'lg' | 'md' | 'sm';
+export type PanelStyleProps = {
+    size?: Size;
+};
+export declare const panelTheme: {
+    root: ComponentFunction<PanelStyleProps>;
+    toolbar: ComponentFunction<PanelStyleProps>;
+    content: ComponentFunction<PanelStyleProps>;
+    statusbar: ComponentFunction<PanelStyleProps>;
+};
+export {};
+//# sourceMappingURL=panel.d.ts.map

package/dist/types/src/theme/primitives/panel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"panel.d.ts","sourceRoot":"","sources":["../../../../../src/theme/primitives/panel.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAIxD,KAAK,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE/B,MAAM,MAAM,eAAe,GAAG;IAC5B,IAAI,CAAC,EAAE,IAAI,CAAC;CACb,CAAC;AAyBF,eAAO,MAAM,UAAU;IACrB,IAAI;IACJ,OAAO;IACP,OAAO;IACP,SAAS;CACV,CAAC"}

package/dist/types/src/theme/theme.d.ts

@@ -0,0 +1,5 @@
+import { type Theme, type ThemeFunction } from '@dxos/ui-types';
+export declare const defaultTheme: Theme<Record<string, any>>;
+export declare const bindTheme: <P extends Record<string, any>>(theme: Theme<Record<string, any>>) => ThemeFunction<P>;
+export declare const defaultTx: ThemeFunction<Record<string, any>>;
+//# sourceMappingURL=theme.d.ts.map

package/dist/types/src/theme/theme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../../src/theme/theme.ts"],"names":[],"mappings":"AAIA,OAAO,EAA+C,KAAK,KAAK,EAAE,KAAK,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAiC7G,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAwCnD,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,SAAS,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,KAAG,aAAa,CAAC,CAAC,CAK3G,CAAC;AAEF,eAAO,MAAM,SAAS,oCAA0B,CAAC"}

package/dist/types/src/util/elevation.d.ts

@@ -0,0 +1,9 @@
+import { type ComponentFragment, type Elevation, type SurfaceLevel } from '@dxos/ui-types';
+export declare const surfaceShadow: ComponentFragment<{
+    elevation?: Elevation;
+}>;
+export declare const surfaceZIndex: ComponentFragment<{
+    level?: SurfaceLevel;
+    elevation?: Elevation;
+}>;
+//# sourceMappingURL=elevation.d.ts.map

package/dist/types/src/util/elevation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"elevation.d.ts","sourceRoot":"","sources":["../../../../src/util/elevation.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,iBAAiB,EAAE,KAAK,SAAS,EAAE,KAAK,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAE3F,eAAO,MAAM,aAAa,EAAE,iBAAiB,CAAC;IAAE,SAAS,CAAC,EAAE,SAAS,CAAA;CAAE,CAMtE,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,iBAAiB,CAAC;IAAE,KAAK,CAAC,EAAE,YAAY,CAAC;IAAC,SAAS,CAAC,EAAE,SAAS,CAAA;CAAE,CAY5F,CAAC"}

package/dist/types/src/util/hash-styles.d.ts

@@ -0,0 +1,18 @@
+import { type ChromaticPalette } from '@dxos/ui-types';
+export type Hue = ChromaticPalette | 'neutral';
+export type ColorStyles = {
+    hue: Hue;
+    fill: string;
+    surface: string;
+    foreground: string;
+    text: string;
+    border: string;
+};
+export declare const palette: {
+    neutral: ColorStyles;
+    hues: ColorStyles[];
+};
+export declare const getStyles: (hue: string) => ColorStyles;
+export declare const getHashStyles: (id: string | undefined) => ColorStyles;
+export declare const getHashHue: (id: string | undefined) => Hue;
+//# sourceMappingURL=hash-styles.d.ts.map

package/dist/types/src/util/hash-styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hash-styles.d.ts","sourceRoot":"","sources":["../../../../src/util/hash-styles.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAEvD,MAAM,MAAM,GAAG,GAAG,gBAAgB,GAAG,SAAS,CAAC;AAG/C,MAAM,MAAM,WAAW,GAAG;IACxB,GAAG,EAAE,GAAG,CAAC;IACT,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC;AAwJF,eAAO,MAAM,OAAO;;;CAGnB,CAAC;AAGF,eAAO,MAAM,SAAS,QAAS,MAAM,KAAG,WAEvC,CAAC;AAGF,eAAO,MAAM,aAAa,OAAQ,MAAM,GAAG,SAAS,KAAG,WAEtD,CAAC;AAEF,eAAO,MAAM,UAAU,OAAQ,MAAM,GAAG,SAAS,KAAG,GAEnD,CAAC"}

package/dist/types/src/util/index.d.ts

@@ -0,0 +1,6 @@
+export * from './elevation';
+export * from './hash-styles';
+export * from './mx';
+export * from './size';
+export * from './valence';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/src/util/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/util/index.ts"],"names":[],"mappings":"AAIA,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,MAAM,CAAC;AACrB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC"}

package/dist/types/src/util/mx.d.ts

@@ -0,0 +1,58 @@
+import { type ForwardRefExoticComponent, type ForwardedRef, type HTMLAttributes, type ReactNode, type RefAttributes, CSSProperties } from 'react';
+import { ThemedClassName, type ComposableProps, type SlottableProps } from '@dxos/ui-types';
+export declare const mx: (...classLists: import("tailwind-merge").ClassNameValue[]) => string;
+/**
+ * Reconciles className properties from a parent slot.
+ * - `className` is set by the Slot merge mechanism.
+ * - `classNames` is the consumer-facing prop for theming overrides.
+ * Use `composableProps` to reconcile both into a single `className`.
+ */
+export declare const composableProps: <P extends HTMLElement = HTMLElement>({ className, classNames, role, style, ...props }: ComposableProps, { classNames: defaultClassNames, ...defaults }?: ThemedClassName<Partial<HTMLAttributes<P>>> | undefined) => {
+    children?: ReactNode | undefined;
+    role: import("react").AriaRole;
+    style: CSSProperties;
+    className: string;
+};
+/**
+ * Factory for slottable components.
+ * The implementation receives full `HTMLAttributes<E>` so it can destructure `role`, `style`, etc.
+ * Consumers see only `SlottableProps<P>` — a narrow type exposing `classNames`, `className`,
+ * `children`, `asChild`, and the custom props `P`.
+ *
+ * @example
+ * ```tsx
+ * const MyPanel = slottable<HTMLDivElement, { border?: boolean }>(
+ *   ({ children, asChild, border, ...props }, forwardedRef) => {
+ *     const Comp = asChild ? Slot : Primitive.div;
+ *     return (
+ *       <Comp {...composableProps(props, { classNames: border && 'border' })} ref={forwardedRef}>
+ *         {children}
+ *       </Comp>
+ *     );
+ *   },
+ * );
+ * ```
+ */
+export declare function slottable<E extends HTMLElement, P extends object = {}>(render: (props: SlottableProps<P> & HTMLAttributes<E>, forwardedRef: ForwardedRef<E>) => ReactNode): ForwardRefExoticComponent<SlottableProps<P> & RefAttributes<E>>;
+/**
+ * Factory for composable (leaf) components.
+ * The implementation receives full `HTMLAttributes<E>` so it can destructure `role`, `style`, etc.
+ * Consumers see only `ComposableProps<P>` — a narrow type exposing `classNames`, `className`,
+ * `children`, and the custom props `P`.
+ *
+ * For generic components, use `any` for the type parameter inside `composable` and
+ * cast the result to restore the generic signature for consumers.
+ *
+ * @example
+ * ```tsx
+ * const Leaf = composable<HTMLButtonElement>(({ children, ...props }, forwardedRef) => {
+ *   return (
+ *     <button {...composableProps(props, { classNames: 'btn' })} ref={forwardedRef}>
+ *       {children}
+ *     </button>
+ *   );
+ * });
+ * ```
+ */
+export declare function composable<E extends HTMLElement, P extends object = {}>(render: (props: ComposableProps<P> & HTMLAttributes<E>, forwardedRef: ForwardedRef<E>) => ReactNode): ForwardRefExoticComponent<ComposableProps<P> & RefAttributes<E>>;
+//# sourceMappingURL=mx.d.ts.map

package/dist/types/src/util/mx.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mx.d.ts","sourceRoot":"","sources":["../../../../src/util/mx.ts"],"names":[],"mappings":"AAIA,OAAO,EAIL,KAAK,yBAAyB,EAC9B,KAAK,YAAY,EACjB,KAAK,cAAc,EAEnB,KAAK,SAAS,EACd,KAAK,aAAa,EAClB,aAAa,EACd,MAAM,OAAO,CAAC;AAIf,OAAO,EAAE,eAAe,EAAE,KAAK,eAAe,EAAE,KAAK,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAI5F,eAAO,MAAM,EAAE,sEAuCb,CAAC;AAEH;;;;;GAKG;AAEH,eAAO,MAAM,eAAe,GAAI,CAAC,SAAS,WAAW,kEACD,eAAe,mDACjB,eAAe,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,SAAS;;;WAY7D,aAAa;;CAIvD,CAAC;AAKH;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,SAAS,CAAC,CAAC,SAAS,WAAW,EAAE,CAAC,SAAS,MAAM,GAAG,EAAE,EACpE,MAAM,EAAE,CAAC,KAAK,EAAE,cAAc,CAAC,CAAC,CAAC,GAAG,cAAc,CAAC,CAAC,CAAC,EAAE,YAAY,EAAE,YAAY,CAAC,CAAC,CAAC,KAAK,SAAS,GACjG,yBAAyB,CAAC,cAAc,CAAC,CAAC,CAAC,GAAG,aAAa,CAAC,CAAC,CAAC,CAAC,CA4BjE;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,UAAU,CAAC,CAAC,SAAS,WAAW,EAAE,CAAC,SAAS,MAAM,GAAG,EAAE,EACrE,MAAM,EAAE,CAAC,KAAK,EAAE,eAAe,CAAC,CAAC,CAAC,GAAG,cAAc,CAAC,CAAC,CAAC,EAAE,YAAY,EAAE,YAAY,CAAC,CAAC,CAAC,KAAK,SAAS,GAClG,yBAAyB,CAAC,eAAe,CAAC,CAAC,CAAC,GAAG,aAAa,CAAC,CAAC,CAAC,CAAC,CAIlE"}

package/dist/types/src/util/size.d.ts

@@ -0,0 +1,27 @@
+import { type CSSProperties } from 'react';
+import { type Size } from '@dxos/ui-types';
+export declare const getHeight: (size: Size) => string;
+export declare const getWidth: (size: Size) => string;
+export declare const getSize: (size: Size) => string;
+export declare const sizeValue: (size: Size) => number;
+export declare const sizeToRem: (size: Size) => string;
+export declare const iconSize: (size: Size | null) => CSSProperties;
+/**
+ * Snaps an arbitrary numeric value to the nearest valid Tailwind size token.
+ *
+ * The function tries progressively coarser series in order until a match is found:
+ * 1. Exact match — returns the value as-is if it is already a valid `Size`.
+ * 2. Zero or negative — clamps to `0`.
+ * 3. Sub-half values (`< 0.5`) — maps to the `'px'` token (1 px).
+ * 4. Half-step series (0.5 increments, e.g. 1.5, 2.5 …).
+ * 5. Whole-number series (1, 2, 3 …).
+ * 6. Double series (even numbers: 2, 4, 6 …).
+ * 7. Quadruple series (multiples of 4: 4, 8, 12 …).
+ * 8. Falls back to `defaultSize` if no series matches.
+ *
+ * @param value - Numeric size to snap (in Tailwind spacing units, where 1 unit = 0.25 rem).
+ * @param defaultSize - Fallback `Size` token used when no series produces a valid match.
+ * @returns The nearest valid `Size` token.
+ */
+export declare const snapSize: (value: number, defaultSize: Size) => Size;
+//# sourceMappingURL=size.d.ts.map

package/dist/types/src/util/size.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"size.d.ts","sourceRoot":"","sources":["../../../../src/util/size.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,aAAa,EAAE,MAAM,OAAO,CAAC;AAE3C,OAAO,EAAE,KAAK,IAAI,EAAE,MAAM,gBAAgB,CAAC;AA6C3C,eAAO,MAAM,SAAS,SAAU,IAAI,WAAqB,CAAC;AAC1D,eAAO,MAAM,QAAQ,SAAU,IAAI,WAAqB,CAAC;AACzD,eAAO,MAAM,OAAO,SAAU,IAAI,WAAwC,CAAC;AAE3E,eAAO,MAAM,SAAS,SAAU,IAAI,KAAG,MAAoC,CAAC;AAC5E,eAAO,MAAM,SAAS,SAAU,IAAI,KAAG,MAAmE,CAAC;AAE3G,eAAO,MAAM,QAAQ,SAAU,IAAI,GAAG,IAAI,KAAG,aAC6B,CAAC;AAE3E;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,QAAQ,UAAW,MAAM,eAAe,IAAI,KAAG,IAwB3D,CAAC"}

package/dist/types/src/util/valence.d.ts

@@ -0,0 +1,4 @@
+import { type MessageValence } from '@dxos/ui-types';
+export declare const textValence: (valence?: MessageValence) => "font-medium text-error-text" | "font-medium text-info-text" | "font-medium text-success-text" | "font-medium text-warning-text" | undefined;
+export declare const messageValence: (valence?: MessageValence) => "font-medium text-error-text border-error-text bg-error-surface" | "font-medium text-info-text border-info-text bg-info-surface" | "font-medium text-neutral-text border-neutral-text bg-neutral-surface" | "font-medium text-success-text border-success-text bg-success-surface" | "font-medium text-warning-text border-warning-text bg-warning-surface";
+//# sourceMappingURL=valence.d.ts.map

package/dist/types/src/util/valence.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"valence.d.ts","sourceRoot":"","sources":["../../../../src/util/valence.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAErD,eAAO,MAAM,WAAW,aAAc,cAAc,iJAWnD,CAAC;AAEF,eAAO,MAAM,cAAc,aAAc,cAAc,gWAatD,CAAC"}