braid-design-system 32.1.0 → 32.2.0

package/dist/index.mjs

@@ -1,166 +1,166 @@
-import { B, m } from "./side-effects/lib/components/BraidProvider/BraidProvider.mjs";
-import { c, P, B as B2, d, e, C, f, g, D, H, n, o, p, I, h, S, T, i, j, k, m as m2, b, a, u, l } from "./ToastContext.chunk.mjs";
-import { A, b as b2, c as c2, d as d2, e as e2, B as B3, g as g2, h as h2, C as C2, i as i2, j as j2, D as D2, k as k2, l as l2, m as m3, F, n as n2, H as H2, o as o2, a1, a2, a3, a4, a5, a6, a7, a8, a9, aa, ab, ac, ad, ae, af, ag, ah, ai, aj, ak, al, am, an, ao, ap, aq, ar, as, at, au, av, aw, ax, ay, az, aA, aB, aC, aD, aE, aF, aG, aH, aI, aJ, aK, aL, aM, aN, aO, aP, aQ, aR, aS, aT, aU, aV, aW, aX, aY, aZ, a_, a$, b0, b1, b2 as b22, b3, b4, b5, b6, b7, b8, b9, ba, bb, bc, bd, be, bf, L, p as p2, q, r, s, t, v, M, w, N, O, P as P2, x, R, y, z, E, S as S2, G, I as I2, J, K, W, V, U, Q, X, Z, _, Y, T as T2, $, a0, f as f2, a as a10, u as u2 } from "./Toggle.chunk.mjs";
+import { BraidProvider, makeLinkComponent } from "./side-effects/lib/components/BraidProvider/BraidProvider.mjs";
+import { Bleed, PublicBox, BraidPortal, Button, ButtonIcon, Column, Columns, ContentBlock, Divider, Hidden, IconClear, IconCritical, IconPositive, IconRenderer, Inline, Stack, Text, TextLink, TextLinkButton, ToastProvider, TooltipRenderer, useResponsiveValue, useSpace, useThemeName, useToast } from "./ToastContext.chunk.mjs";
+import { Accordion, AccordionItem, Actions, Alert, Autosuggest, Badge, BoxRenderer, ButtonLink, Card, Checkbox, CheckboxStandalone, Dialog, Disclosure, Drawer, Dropdown, FieldLabel, FieldMessage, Heading, HiddenVisually, IconAdd, IconArrow, IconBookmark, IconCaution, IconChevron, IconCompany, IconCompose, IconCopy, IconCreditCard, IconDate, IconDelete, IconDesktop, IconDocument, IconDocumentBroken, IconDownload, IconEdit, IconEducation, IconFilter, IconFlag, IconGrid, IconHeart, IconHelp, IconHistory, IconHome, IconImage, IconInfo, IconInvoice, IconLanguage, IconLink, IconLinkBroken, IconList, IconLocation, IconMail, IconMinus, IconMobile, IconMoney, IconNewWindow, IconNote, IconNotification, IconOverflow, IconPeople, IconPersonAdd, IconPersonVerified, IconPhone, IconPlatformAndroid, IconPlatformApple, IconPrint, IconProfile, IconPromote, IconRecommended, IconRefresh, IconResume, IconSearch, IconSecurity, IconSend, IconSent, IconSettings, IconShare, IconSocialFacebook, IconSocialGitHub, IconSocialInstagram, IconSocialLinkedIn, IconSocialMedium, IconSocialTwitter, IconSocialYouTube, IconStar, IconStatistics, IconSubCategory, IconTag, IconThumb, IconTick, IconTime, IconTip, IconUpload, IconVideo, IconVisibility, IconWorkExperience, IconZoomIn, IconZoomOut, Link, List, Loader, MenuItem, MenuItemCheckbox, MenuItemDivider, MenuItemLink, MenuRenderer, MonthPicker, Notice, OverflowMenu, Pagination, PasswordField, Radio, RadioGroup, RadioItem, Rating, Secondary, Step, Stepper, Strong, Tab, TabPanel, TabPanels, Tabs, TabsProvider, Tag, TextDropdown, TextField, Textarea, ThemeNameConsumer, Tiles, Toggle, filterSuggestions, useBreakpoint, useColor } from "./Toggle.chunk.mjs";
 export {
-  A as Accordion,
-  b2 as AccordionItem,
-  c2 as Actions,
-  d2 as Alert,
-  e2 as Autosuggest,
-  B3 as Badge,
-  c as Bleed,
-  P as Box,
-  g2 as BoxRenderer,
-  B2 as BraidPortal,
-  B as BraidProvider,
-  d as Button,
-  e as ButtonIcon,
-  h2 as ButtonLink,
-  C2 as Card,
-  i2 as Checkbox,
-  j2 as CheckboxStandalone,
-  C as Column,
-  f as Columns,
-  g as ContentBlock,
-  D2 as Dialog,
-  k2 as Disclosure,
-  D as Divider,
-  l2 as Drawer,
-  m3 as Dropdown,
-  F as FieldLabel,
-  n2 as FieldMessage,
-  H2 as Heading,
-  H as Hidden,
-  o2 as HiddenVisually,
-  a1 as IconAdd,
-  a2 as IconArrow,
-  a3 as IconBookmark,
-  a4 as IconCaution,
-  a5 as IconChevron,
-  n as IconClear,
-  a6 as IconCompany,
-  a7 as IconCompose,
-  a8 as IconCopy,
-  a9 as IconCreditCard,
-  o as IconCritical,
-  aa as IconDate,
-  ab as IconDelete,
-  ac as IconDesktop,
-  ad as IconDocument,
-  ae as IconDocumentBroken,
-  af as IconDownload,
-  ag as IconEdit,
-  ah as IconEducation,
-  ai as IconFilter,
-  aj as IconFlag,
-  ak as IconGrid,
-  al as IconHeart,
-  am as IconHelp,
-  an as IconHistory,
-  ao as IconHome,
-  ap as IconImage,
-  aq as IconInfo,
-  ar as IconInvoice,
-  as as IconLanguage,
-  at as IconLink,
-  au as IconLinkBroken,
-  av as IconList,
-  aw as IconLocation,
-  ax as IconMail,
-  ay as IconMinus,
-  az as IconMobile,
-  aA as IconMoney,
-  aB as IconNewWindow,
-  aC as IconNote,
-  aD as IconNotification,
-  aE as IconOverflow,
-  aF as IconPeople,
-  aG as IconPersonAdd,
-  aH as IconPersonVerified,
-  aI as IconPhone,
-  aJ as IconPlatformAndroid,
-  aK as IconPlatformApple,
-  p as IconPositive,
-  aL as IconPrint,
-  aM as IconProfile,
-  aN as IconPromote,
-  aO as IconRecommended,
-  aP as IconRefresh,
-  I as IconRenderer,
-  aQ as IconResume,
-  aR as IconSearch,
-  aS as IconSecurity,
-  aT as IconSend,
-  aU as IconSent,
-  aV as IconSettings,
-  aW as IconShare,
-  aX as IconSocialFacebook,
-  aY as IconSocialGitHub,
-  aZ as IconSocialInstagram,
-  a_ as IconSocialLinkedIn,
-  a$ as IconSocialMedium,
-  b0 as IconSocialTwitter,
-  b1 as IconSocialYouTube,
-  b22 as IconStar,
-  b3 as IconStatistics,
-  b4 as IconSubCategory,
-  b5 as IconTag,
-  b6 as IconThumb,
-  b7 as IconTick,
-  b8 as IconTime,
-  b9 as IconTip,
-  ba as IconUpload,
-  bb as IconVideo,
-  bc as IconVisibility,
-  bd as IconWorkExperience,
-  be as IconZoomIn,
-  bf as IconZoomOut,
-  h as Inline,
-  L as Link,
-  p2 as List,
-  q as Loader,
-  r as MenuItem,
-  s as MenuItemCheckbox,
-  t as MenuItemDivider,
-  v as MenuItemLink,
-  M as MenuRenderer,
-  w as MonthPicker,
-  N as Notice,
-  O as OverflowMenu,
-  P2 as Pagination,
-  x as PasswordField,
-  R as Radio,
-  y as RadioGroup,
-  z as RadioItem,
-  E as Rating,
-  S2 as Secondary,
-  S as Stack,
-  G as Step,
-  I2 as Stepper,
-  J as Strong,
-  K as Tab,
-  W as TabPanel,
-  V as TabPanels,
-  U as Tabs,
-  Q as TabsProvider,
-  X as Tag,
-  T as Text,
-  Z as TextDropdown,
-  _ as TextField,
-  i as TextLink,
-  j as TextLinkButton,
-  Y as Textarea,
-  T2 as ThemeNameConsumer,
-  $ as Tiles,
-  k as ToastProvider,
-  a0 as Toggle,
-  m2 as TooltipRenderer,
-  f2 as filterSuggestions,
-  m as makeLinkComponent,
-  a10 as useBreakpoint,
-  u2 as useColor,
-  b as useResponsiveValue,
-  a as useSpace,
-  u as useThemeName,
-  l as useToast
+  Accordion,
+  AccordionItem,
+  Actions,
+  Alert,
+  Autosuggest,
+  Badge,
+  Bleed,
+  PublicBox as Box,
+  BoxRenderer,
+  BraidPortal,
+  BraidProvider,
+  Button,
+  ButtonIcon,
+  ButtonLink,
+  Card,
+  Checkbox,
+  CheckboxStandalone,
+  Column,
+  Columns,
+  ContentBlock,
+  Dialog,
+  Disclosure,
+  Divider,
+  Drawer,
+  Dropdown,
+  FieldLabel,
+  FieldMessage,
+  Heading,
+  Hidden,
+  HiddenVisually,
+  IconAdd,
+  IconArrow,
+  IconBookmark,
+  IconCaution,
+  IconChevron,
+  IconClear,
+  IconCompany,
+  IconCompose,
+  IconCopy,
+  IconCreditCard,
+  IconCritical,
+  IconDate,
+  IconDelete,
+  IconDesktop,
+  IconDocument,
+  IconDocumentBroken,
+  IconDownload,
+  IconEdit,
+  IconEducation,
+  IconFilter,
+  IconFlag,
+  IconGrid,
+  IconHeart,
+  IconHelp,
+  IconHistory,
+  IconHome,
+  IconImage,
+  IconInfo,
+  IconInvoice,
+  IconLanguage,
+  IconLink,
+  IconLinkBroken,
+  IconList,
+  IconLocation,
+  IconMail,
+  IconMinus,
+  IconMobile,
+  IconMoney,
+  IconNewWindow,
+  IconNote,
+  IconNotification,
+  IconOverflow,
+  IconPeople,
+  IconPersonAdd,
+  IconPersonVerified,
+  IconPhone,
+  IconPlatformAndroid,
+  IconPlatformApple,
+  IconPositive,
+  IconPrint,
+  IconProfile,
+  IconPromote,
+  IconRecommended,
+  IconRefresh,
+  IconRenderer,
+  IconResume,
+  IconSearch,
+  IconSecurity,
+  IconSend,
+  IconSent,
+  IconSettings,
+  IconShare,
+  IconSocialFacebook,
+  IconSocialGitHub,
+  IconSocialInstagram,
+  IconSocialLinkedIn,
+  IconSocialMedium,
+  IconSocialTwitter,
+  IconSocialYouTube,
+  IconStar,
+  IconStatistics,
+  IconSubCategory,
+  IconTag,
+  IconThumb,
+  IconTick,
+  IconTime,
+  IconTip,
+  IconUpload,
+  IconVideo,
+  IconVisibility,
+  IconWorkExperience,
+  IconZoomIn,
+  IconZoomOut,
+  Inline,
+  Link,
+  List,
+  Loader,
+  MenuItem,
+  MenuItemCheckbox,
+  MenuItemDivider,
+  MenuItemLink,
+  MenuRenderer,
+  MonthPicker,
+  Notice,
+  OverflowMenu,
+  Pagination,
+  PasswordField,
+  Radio,
+  RadioGroup,
+  RadioItem,
+  Rating,
+  Secondary,
+  Stack,
+  Step,
+  Stepper,
+  Strong,
+  Tab,
+  TabPanel,
+  TabPanels,
+  Tabs,
+  TabsProvider,
+  Tag,
+  Text,
+  TextDropdown,
+  TextField,
+  TextLink,
+  TextLinkButton,
+  Textarea,
+  ThemeNameConsumer,
+  Tiles,
+  ToastProvider,
+  Toggle,
+  TooltipRenderer,
+  filterSuggestions,
+  makeLinkComponent,
+  useBreakpoint,
+  useColor,
+  useResponsiveValue,
+  useSpace,
+  useThemeName,
+  useToast
 };

package/dist/playroom/FrameComponent.d.ts

@@ -1,323 +1 @@
-import { ReactNode } from 'react';
-import { FontMetrics } from '@capsizecss/core';
-
-declare const breakpoints: {
-    readonly mobile: 0;
-    readonly tablet: 740;
-    readonly desktop: 992;
-    readonly wide: 1200;
-};
-type Breakpoint = keyof typeof breakpoints;
-
-type TextBreakpoint = Exclude<Breakpoint, 'desktop' | 'wide'>;
-type FontSizeText = {
-    fontSize: number;
-    rows: number;
-};
-type TextDefinition = Record<TextBreakpoint, FontSizeText>;
-type FontWeight = 'regular' | 'medium' | 'strong';
-interface BraidTokens {
-    name: string;
-    displayName: string;
-    typography: {
-        fontFamily: string;
-        webFont: string | null;
-        fontMetrics: Pick<FontMetrics, 'capHeight' | 'ascent' | 'descent' | 'lineGap' | 'unitsPerEm'>;
-        fontWeight: Record<FontWeight, 400 | 500 | 600 | 700 | 800>;
-        heading: {
-            weight: {
-                weak: FontWeight;
-                regular: FontWeight;
-            };
-            level: {
-                '1': TextDefinition;
-                '2': TextDefinition;
-                '3': TextDefinition;
-                '4': TextDefinition;
-            };
-        };
-        text: {
-            xsmall: TextDefinition;
-            small: TextDefinition;
-            standard: TextDefinition;
-            large: TextDefinition;
-        };
-    };
-    contentWidth: {
-        xsmall: number;
-        small: number;
-        medium: number;
-        large: number;
-    };
-    grid: number;
-    touchableSize: number;
-    space: {
-        gutter: number;
-        xxsmall: number;
-        xsmall: number;
-        small: number;
-        medium: number;
-        large: number;
-        xlarge: number;
-        xxlarge: number;
-    };
-    transforms: {
-        touchable: string;
-    };
-    transitions: {
-        fast: string;
-        touchable: string;
-    };
-    border: {
-        radius: {
-            standard: string;
-            large: string;
-            xlarge: string;
-        };
-        width: {
-            standard: number;
-            large: number;
-        };
-        color: {
-            brandAccent: string;
-            brandAccentLight: string;
-            caution: string;
-            cautionLight: string;
-            critical: string;
-            criticalLight: string;
-            field: string;
-            focus: string;
-            formAccent: string;
-            formAccentLight: string;
-            info: string;
-            infoLight: string;
-            neutral: string;
-            neutralInverted: string;
-            neutralLight: string;
-            positive: string;
-            positiveLight: string;
-            promote: string;
-            promoteLight: string;
-        };
-    };
-    focusRingSize: number;
-    shadows: {
-        small: string;
-        medium: string;
-        large: string;
-    };
-    color: {
-        foreground: {
-            brandAccentLight: string;
-            brandAccent: string;
-            cautionLight: string;
-            caution: string;
-            criticalLight: string;
-            critical: string;
-            formAccentLight: string;
-            formAccent: string;
-            infoLight: string;
-            info: string;
-            linkLight: string;
-            link: string;
-            linkHover: string;
-            linkVisited: string;
-            linkLightVisited: string;
-            neutral: string;
-            neutralInverted: string;
-            positiveLight: string;
-            positive: string;
-            promoteLight: string;
-            promote: string;
-            rating: string;
-            secondary: string;
-            secondaryInverted: string;
-        };
-        background: {
-            body: string;
-            bodyDark: string;
-            brand: string;
-            brandAccent: string;
-            brandAccentActive: string;
-            brandAccentHover: string;
-            brandAccentSoft: string;
-            brandAccentSoftActive: string;
-            brandAccentSoftHover: string;
-            caution: string;
-            cautionLight: string;
-            critical: string;
-            criticalActive: string;
-            criticalHover: string;
-            criticalLight: string;
-            criticalSoft: string;
-            criticalSoftActive: string;
-            criticalSoftHover: string;
-            formAccent: string;
-            formAccentActive: string;
-            formAccentHover: string;
-            formAccentSoft: string;
-            formAccentSoftActive: string;
-            formAccentSoftHover: string;
-            info: string;
-            infoLight: string;
-            neutral: string;
-            neutralActive: string;
-            neutralHover: string;
-            neutralLight: string;
-            neutralSoft: string;
-            neutralSoftActive: string;
-            neutralSoftHover: string;
-            positive: string;
-            positiveLight: string;
-            promote: string;
-            promoteLight: string;
-            surface: string;
-            surfaceDark: string;
-        };
-    };
-}
-
-declare const makeBraidTheme: (tokens: BraidTokens) => {
-    vanillaTheme: string;
-    name: string;
-    displayName: string;
-    background: {
-        lightMode: string;
-        darkMode: string;
-    };
-    webFonts: {
-        linkTag: string;
-    }[];
-    space: {
-        grid: number;
-        space: {
-            gutter: number;
-            xxsmall: number;
-            xsmall: number;
-            small: number;
-            medium: number;
-            large: number;
-            xlarge: number;
-            xxlarge: number;
-        };
-    };
-    color: {
-        foreground: {
-            brandAccentLight: string;
-            brandAccent: string;
-            cautionLight: string;
-            caution: string;
-            criticalLight: string;
-            critical: string;
-            formAccentLight: string;
-            formAccent: string;
-            infoLight: string;
-            info: string;
-            linkLight: string;
-            link: string;
-            linkHover: string;
-            linkVisited: string;
-            linkLightVisited: string;
-            neutral: string;
-            neutralInverted: string;
-            positiveLight: string;
-            positive: string;
-            promoteLight: string;
-            promote: string;
-            rating: string;
-            secondary: string;
-            secondaryInverted: string;
-        };
-        background: {
-            body: string;
-            bodyDark: string;
-            brand: string;
-            brandAccent: string;
-            brandAccentActive: string;
-            brandAccentHover: string;
-            brandAccentSoft: string;
-            brandAccentSoftActive: string;
-            brandAccentSoftHover: string;
-            caution: string;
-            cautionLight: string;
-            critical: string;
-            criticalActive: string;
-            criticalHover: string;
-            criticalLight: string;
-            criticalSoft: string;
-            criticalSoftActive: string;
-            criticalSoftHover: string;
-            formAccent: string;
-            formAccentActive: string;
-            formAccentHover: string;
-            formAccentSoft: string;
-            formAccentSoftActive: string;
-            formAccentSoftHover: string;
-            info: string;
-            infoLight: string;
-            neutral: string;
-            neutralActive: string;
-            neutralHover: string;
-            neutralLight: string;
-            neutralSoft: string;
-            neutralSoftActive: string;
-            neutralSoftHover: string;
-            positive: string;
-            positiveLight: string;
-            promote: string;
-            promoteLight: string;
-            surface: string;
-            surfaceDark: string;
-        };
-    };
-    backgroundLightness: {
-        body: "light" | "dark";
-        bodyDark: "light" | "dark";
-        brand: "light" | "dark";
-        brandAccent: "light" | "dark";
-        brandAccentActive: "light" | "dark";
-        brandAccentHover: "light" | "dark";
-        brandAccentSoft: "light" | "dark";
-        brandAccentSoftActive: "light" | "dark";
-        brandAccentSoftHover: "light" | "dark";
-        caution: "light" | "dark";
-        cautionLight: "light" | "dark";
-        critical: "light" | "dark";
-        criticalActive: "light" | "dark";
-        criticalHover: "light" | "dark";
-        criticalLight: "light" | "dark";
-        criticalSoft: "light" | "dark";
-        criticalSoftActive: "light" | "dark";
-        criticalSoftHover: "light" | "dark";
-        formAccent: "light" | "dark";
-        formAccentActive: "light" | "dark";
-        formAccentHover: "light" | "dark";
-        formAccentSoft: "light" | "dark";
-        formAccentSoftActive: "light" | "dark";
-        formAccentSoftHover: "light" | "dark";
-        info: "light" | "dark";
-        infoLight: "light" | "dark";
-        neutral: "light" | "dark";
-        neutralActive: "light" | "dark";
-        neutralHover: "light" | "dark";
-        neutralLight: "light" | "dark";
-        neutralSoft: "light" | "dark";
-        neutralSoftActive: "light" | "dark";
-        neutralSoftHover: "light" | "dark";
-        positive: "light" | "dark";
-        positiveLight: "light" | "dark";
-        promote: "light" | "dark";
-        promoteLight: "light" | "dark";
-        surface: "light" | "dark";
-        surfaceDark: "light" | "dark";
-    };
-};
-type BraidTheme = ReturnType<typeof makeBraidTheme>;
-
-interface Props {
-    theme: BraidTheme;
-    children: ReactNode;
-}
-declare const _default: ({ theme, children }: Props) => JSX.Element;
-
-export { _default as default };
+export { _default as default } from '../reset.js';

package/dist/playroom/FrameComponent.mjs

@@ -1,10 +1,10 @@
 import { jsxs, jsx, Fragment as Fragment$1 } from "react/jsx-runtime";
 import "../side-effects/lib/css/reset/index.mjs";
 import { useEffect, Fragment } from "react";
-import { P as PlayroomStateProvider } from "../playroomState.chunk.mjs";
-import { d as darkMode } from "../styles/lib/css/atoms/sprinkles.css.mjs";
-import { B as BraidProvider, m as makeLinkComponent } from "../side-effects/lib/components/BraidProvider/BraidProvider.mjs";
-import { k as ToastProvider, b as useResponsiveValue } from "../ToastContext.chunk.mjs";
+import { PlayroomStateProvider } from "../playroomState.chunk.mjs";
+import { darkMode } from "../styles/lib/css/atoms/sprinkles.css.mjs";
+import { BraidProvider, makeLinkComponent } from "../side-effects/lib/components/BraidProvider/BraidProvider.mjs";
+import { ToastProvider, useResponsiveValue } from "../ToastContext.chunk.mjs";
 const PlayroomLink = makeLinkComponent(
   ({ href, onClick, ...restProps }, ref) => /* @__PURE__ */ jsx(
     "a",