@veevarts/design-system 1.17.0-beta.6 → 1.17.0-beta.7

package/dist/tokens/admin-surface.d.ts

@@ -0,0 +1,58 @@
+/**
+ * The admin-surface palette, as CSS custom properties.
+ *
+ * WHY A SECOND OUTPUT FORMAT. The rest of the Design System reaches its colours
+ * through Tailwind utilities, which only works when the consuming app scans the
+ * DS `dist` in its Tailwind `content` globs. The domain packages that render
+ * back-office screens cannot rely on that: `@veevart/accounting` is absent from
+ * the portal's globs, so any utility class written there is purged from the
+ * bundle, and the Salesforce Canvas embed builds its CSS separately again. Those
+ * surfaces therefore style through inline styles over a scoped `<style>` block,
+ * and what they need from us is custom properties, not classes.
+ *
+ * The values come from `colors` — the same object that feeds the Tailwind
+ * preset. That is the whole point: before this existed, the admin palette lived
+ * inside `@veevart/accounting` as a hand-written block, got copied to a second
+ * screen, then a third and a fourth, and had already lost a token in one copy
+ * and forked `warning` away from ours. A palette owned by a domain package is a
+ * palette that forks.
+ *
+ * ```ts
+ * <style dangerouslySetInnerHTML={{ __html: adminSurfaceCss() }} />
+ * <div className="acct">…</div>
+ * ```
+ */
+/** Token name → value. Exported so tests and tooling can assert on it directly. */
+export declare const adminSurfaceTokens: Record<string, string>;
+/**
+ * Pairs whose contrast is NOT yet at WCAG AA, with the reason each is tolerated.
+ *
+ * `--info` on its tint measures 4.45:1 against the 4.5 threshold. It predates
+ * this module and no one has agreed to change it; raising the text to the
+ * scale's 700 would fix it the same way `--warn` was fixed, but that is a
+ * separate design call on a separate set of screens. Listed here rather than
+ * left to be rediscovered, so the guard below stays meaningful for the rest.
+ */
+export declare const KNOWN_CONTRAST_DEBT: readonly ["--info"];
+/**
+ * The same palette as a Tailwind colour scale, namespaced under `acct`.
+ *
+ * This is what the admin primitives actually style with — `text-acct-ink`,
+ * `bg-acct-surface`, `border-acct-hair`. Feeding it into the preset from the
+ * same object as {@link adminSurfaceTokens} is what keeps the utility and the
+ * custom property from ever disagreeing.
+ *
+ * Namespaced deliberately. Several of these names (`border`, `page`, `info`)
+ * would collide with Tailwind's own utility grammar unprefixed: a colour
+ * literally called `border` produces `border-border`, and `text-info` would
+ * read as a size to anyone skimming.
+ */
+export declare const adminSurfaceTailwindColors: Record<string, string>;
+export interface AdminSurfaceCssOptions {
+    /** Class the properties are scoped to. Defaults to `.acct`. */
+    scope?: string;
+    /** Base font stack for the surface. Pass `false` to leave typography alone. */
+    fontFamily?: string | false;
+}
+/** The palette as a `<style>`-ready rule. */
+export declare function adminSurfaceCss({ scope, fontFamily, }?: AdminSurfaceCssOptions): string;

package/dist/tokens/index.d.ts

@@ -1,4 +1,6 @@
 export { colors } from './colors';
 export { spacing } from './spacing';
 export { typography } from './typography';
+export { adminSurfaceCss, adminSurfaceTokens } from './admin-surface';
 export type { ColorToken } from './colors';
+export type { AdminSurfaceCssOptions } from './admin-surface';

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@veevarts/design-system",
     "private": false,
-    "version": "1.17.0-beta.6",
+    "version": "1.17.0-beta.7",
     "type": "module",
     "main": "dist/index.js",
     "module": "dist/index.js",

package/dist/patterns/CheckboxCardGroup/CheckboxCardGroup.d.ts

@@ -1,53 +0,0 @@
-import { default as React } from 'react';
-export interface CheckboxCardOption {
-    /** Stable identifier surfaced through `onChange`. */
-    key: string;
-    /** Visible label. */
-    label: string;
-    /** Optional secondary line under the label. */
-    description?: string;
-    /** Iconify name (`'solar:ticket-outline'`) or a custom node. */
-    icon?: string | React.ReactNode;
-    /** Disable just this card. */
-    isDisabled?: boolean;
-    /** Override per-card test id; defaults to `${dataTestId}-${key}`. */
-    'data-testid'?: string;
-}
-export interface CheckboxCardGroupClassNames {
-    base?: string;
-    grid?: string;
-    card?: string;
-    hint?: string;
-}
-export interface CheckboxCardGroupProps {
-    /** Options to render in order. */
-    options: readonly CheckboxCardOption[];
-    /** Currently selected option keys. */
-    selectedKeys: readonly string[];
-    /** Fires with the next full selection whenever a card is toggled. Keys are emitted in the original option order (not selection order); any selected key not present in `options` is preserved. */
-    onChange: (keys: string[]) => void;
-    /** Optional heading rendered above the grid (labels the group). */
-    heading?: string;
-    /** `aria-label` for the group when `heading` is omitted. Default `'Select options'`. */
-    ariaLabel?: string;
-    /** Grid columns on >= sm. Default `2`. */
-    columnsDesktop?: 2 | 3 | 4;
-    /** Grid columns on mobile. Default `1`. */
-    columnsMobile?: 1 | 2;
-    /**
-     * Minimum number of selections. When set, the group auto-derives its
-     * invalid state (`selectedKeys.length < minSelected`) and a default hint,
-     * unless `isInvalid` / `hint` are explicitly supplied.
-     */
-    minSelected?: number;
-    /** Helper text under the grid. Overrides the `minSelected` default hint. */
-    hint?: React.ReactNode;
-    /** Error styling + `aria-invalid`. Overrides the `minSelected`-derived state. */
-    isInvalid?: boolean;
-    /** Disable every card. */
-    isDisabled?: boolean;
-    className?: string;
-    classNames?: CheckboxCardGroupClassNames;
-    'data-testid'?: string;
-}
-export declare const CheckboxCardGroup: React.FC<CheckboxCardGroupProps>;

package/dist/patterns/CheckboxCardGroup/index.d.ts

@@ -1,2 +0,0 @@
-export { CheckboxCardGroup } from './CheckboxCardGroup';
-export type { CheckboxCardGroupProps, CheckboxCardGroupClassNames, CheckboxCardOption, } from './CheckboxCardGroup';