@omni-design/components 0.11.0 → 0.13.0

package/dist/types/components/BackgroundPicker.d.ts

@@ -1,5 +1,5 @@
 export function BackgroundPicker({ theme, onThemeChange, surface, onSurfaceChange, surfaces, size, }: {
-    theme?: any;
+    theme?: string;
     onThemeChange: any;
     surface?: string;
     onSurfaceChange: any;

package/dist/types/components/BrandIcon/BrandIcon.d.ts

@@ -0,0 +1,20 @@
+/**
+ * @param name   lowercase, hyphenated, as Figma's text layer holds it:
+ *               'github', 'x-twitter', 'linkedin', 'dribbble', 'instagram'
+ * @param icon   a Font Awesome icon object, if you would rather import it
+ *               yourself. Takes precedence over `name`.
+ * @param size   any CSS length. Defaults to 1em so it rides the text beside it.
+ * @param color  any CSS color or token. Defaults to currentColor.
+ * @param title  accessible name. Omit for decoration beside a visible label —
+ *               the icon is then aria-hidden, which is the common case in a
+ *               footer where the link text already says "GitHub".
+ */
+export function BrandIcon({ name, icon, size, color, title, ...props }: {
+    [x: string]: any;
+    name: any;
+    icon: any;
+    size?: string;
+    color?: string;
+    title: any;
+}): JSX.Element;
+export default BrandIcon;

package/dist/types/components/BrandIcon/index.d.ts

@@ -0,0 +1 @@
+export { BrandIcon, default } from "./BrandIcon";

package/dist/types/components/Button/Button.d.ts

@@ -1,5 +1,5 @@
 export function normalizeButtonVariant(variant: any): string;
-export function Button({ variant, size, elevated, selected, fullWidth, disabled, iconOnly, letterNumber, avatar, swatch, swatchColor, startIcon, endIcon, startDecorator, endDecorator, badge, badgeContent, badgeVariant, badgeSize, badgeDot, badgeMax, badgeAnchorOrigin, children, className, sx, ...props }: {
+export function Button({ variant, size, elevated, selected, fullWidth, disabled, contentType, iconOnly, letterNumber, avatar, swatch, swatchColor, startIcon, endIcon, startDecorator, endDecorator, badge, badgeContent, badgeVariant, badgeSize, badgeDot, badgeMax, badgeAnchorOrigin, children, className, sx, ...props }: {
     [x: string]: any;
     variant?: string;
     size?: string;
@@ -7,6 +7,7 @@ export function Button({ variant, size, elevated, selected, fullWidth, disabled,
     selected?: boolean;
     fullWidth?: boolean;
     disabled?: boolean;
+    contentType: any;
     iconOnly?: boolean;
     letterNumber?: boolean;
     avatar?: boolean;
@@ -30,6 +31,7 @@ export function Button({ variant, size, elevated, selected, fullWidth, disabled,
     className?: string;
     sx?: {};
 }): JSX.Element;
+export const BUTTON_CONTENT_TYPES: string[];
 export function DefaultButton(p: any): JSX.Element;
 export function DefaultOutlineButton(p: any): JSX.Element;
 export function PrimaryButton(p: any): JSX.Element;

package/dist/types/components/ButtonGroup/ButtonGroup.d.ts

@@ -1,11 +1,12 @@
-export function ButtonGroup({ variant, color, size, disabled, orientation, spacing, fit, fullWidth, equalWidth, multiple, value: controlledValue, defaultValue, onChange, children, className, sx, "aria-label": ariaLabel, ...props }: {
+export function ButtonGroup({ variant, color, size, disabled, orientation, separated, spacing, fit, fullWidth, equalWidth, multiple, value: controlledValue, defaultValue, onChange, children, className, sx, "aria-label": ariaLabel, ...props }: {
     [x: string]: any;
     variant?: string;
     color?: string;
     size?: string;
     disabled?: boolean;
     orientation?: string;
-    spacing?: number;
+    separated?: boolean;
+    spacing: any;
     fit: any;
     fullWidth?: boolean;
     equalWidth?: boolean;

package/dist/types/components/Charts/tokens.d.ts

@@ -16,7 +16,7 @@ export namespace CHART_TOKENS {
  *
  * Brand accents lead, because a category has no inherent meaning and should
  * not borrow one — a green wedge next to a red one reads as pass/fail whether
- * or not that is what the data says. The state colours are still available for
+ * or not that is what the data says. The state colors are still available for
  * charts with more categories than accents, and a caller can pass its own
  * subset (or reorder it) via the `colors` prop when the categories DO carry
  * semantics: `colors={['Success', 'Warning', 'Error']}`.

package/dist/types/components/Chip/Chip.d.ts

@@ -2,7 +2,7 @@ export function normalizeChipVariant(variant: any): string;
 export function Chip({ variant, size: sizeProp, label, clickable, disabled, selected, selectionMode, onDelete, onClick, startDecorator, endDecorator, children, className, sx, ...props }: {
     [x: string]: any;
     variant?: string;
-    size?: string;
+    size: any;
     label: any;
     clickable?: boolean;
     disabled?: boolean;

package/dist/types/components/Footer/Footer.d.ts

@@ -1,10 +1,12 @@
-export function Footer({ color, brand, address, columns, socialLinks, subscribe, copyrightName, copyrightYear, className, style, ...rest }: {
+export function Footer({ color, brand, address, columns, socialLinks, copyright, children, subscribe, copyrightName, copyrightYear, className, style, ...rest }: {
     [x: string]: any;
     color?: string;
     brand: any;
     address: any;
     columns?: any[];
     socialLinks?: any[];
+    copyright?: boolean;
+    children: any;
     subscribe: any;
     copyrightName: any;
     copyrightYear: any;

package/dist/types/components/Foundations/FoundationTopic.d.ts

@@ -0,0 +1,4 @@
+export function FoundationTopic({ topic }: {
+    topic: any;
+}): JSX.Element;
+export default FoundationTopic;

package/dist/types/components/Foundations/HowToSlot.d.ts

@@ -0,0 +1,16 @@
+/**
+ * @param src     path under public/, e.g. "/images/figma-surface-mode.png".
+ *                Omit it to render the placeholder. A .mp4/.mov/.webm plays.
+ * @param title   what the shot should show, in a few words.
+ * @param shows   one line on what the viewer should come away knowing.
+ * @param aspect  placeholder shape. Panel crops are tall; default suits them.
+ * @param maxWidth cap in px. Panel crops are narrow, so the default is too.
+ */
+export function HowToSlot({ src, title, shows, aspect, maxWidth }: {
+    src: any;
+    title: any;
+    shows: any;
+    aspect?: string;
+    maxWidth?: number;
+}): JSX.Element;
+export default HowToSlot;

package/dist/types/components/Foundations/TokenRoles.d.ts

@@ -0,0 +1,19 @@
+/**
+ * One swatch per role, painted from the token itself.
+ *
+ * The chip renders the REAL variable rather than a copy of its value, so it
+ * re-resolves with the theme and surface pickers above — which is the only way
+ * to show that these are roles and not colors.
+ */
+export function RoleSwatches({ title, note, roles, tokenFor }: {
+    title: any;
+    note: any;
+    roles: any;
+    tokenFor: any;
+}): JSX.Element;
+export function StyleTable({ styles, tokensFor, defaultColorFor, render }: {
+    styles: any;
+    tokensFor: any;
+    defaultColorFor: any;
+    render: any;
+}): JSX.Element;

package/dist/types/components/Foundations/TypographySummary.d.ts

@@ -0,0 +1,2 @@
+export function TypographySummary(): JSX.Element;
+export default TypographySummary;

package/dist/types/components/IconBadge/IconBadge.d.ts

@@ -3,7 +3,7 @@ export function IconBadge({ children, color, variant, size, className, sx, ...pr
     children: any;
     color?: string;
     variant?: string;
-    size?: string;
+    size: any;
     className?: string;
     sx?: {};
 }): JSX.Element;

package/dist/types/components/Loader/Loader.d.ts

@@ -0,0 +1,66 @@
+export function Loader({ theme, surface, size, color, message, sx, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, ...props }: {
+    [x: string]: any;
+    theme: any;
+    surface: any;
+    size?: string;
+    color?: string;
+    message?: string;
+    sx?: {};
+    "aria-label"?: string;
+    "aria-labelledby": any;
+}): JSX.Element;
+/**
+ * LinearLoader Component
+ * Linear progress bar
+ *
+ * @param {number} value - Progress value 0-100
+ * @param {string} label - Optional label
+ * @param {object} props - Additional props
+ */
+export function LinearLoader({ value, label, sx, ...props }: number): JSX.Element;
+/**
+ * SkeletonLoader Component
+ * Skeleton placeholder for loading content
+ *
+ * @param {number} rows - Number of skeleton rows
+ * @param {number} height - Height of each skeleton
+ * @param {object} props - Additional props
+ */
+export function SkeletonLoader({ rows, height, spacing, sx, ...props }: number): JSX.Element;
+/**
+ * DotsLoader Component
+ * Animated dots loader
+ *
+ * @param {string} message - Loading message
+ * @param {object} props - Additional props
+ */
+export function DotsLoader({ message, sx, ...props }: string): JSX.Element;
+/**
+ * PageLoader Component
+ * Full page loader overlay
+ *
+ * @param {string} message - Loading message
+ * @param {number} size - Loader size
+ * @param {object} props - Additional props
+ */
+export function PageLoader({ message, size, sx, ...props }: string): JSX.Element;
+/**
+ * SkeletonCard Component
+ * Skeleton loading state for cards
+ *
+ * @param {number} lines - Number of text lines
+ * @param {boolean} showImage - Show image skeleton
+ * @param {object} props - Additional props
+ */
+export function SkeletonCard({ lines, showImage, sx, ...props }: number): JSX.Element;
+/**
+ * OverlayLoader Component
+ * Loader overlay for async operations
+ *
+ * @param {boolean} isLoading - Show loader
+ * @param {string} message - Loading message
+ * @param {ReactNode} children - Content to overlay
+ * @param {object} props - Additional props
+ */
+export function OverlayLoader({ isLoading, message, children, sx, ...props }: boolean): JSX.Element;
+export default Loader;

package/dist/types/components/Loader/index.d.ts

@@ -0,0 +1 @@
+export { Loader, LinearLoader, SkeletonLoader, DotsLoader, PageLoader, SkeletonCard, OverlayLoader, default } from "./Loader";

package/dist/types/components/MiniSwatch/MiniSwatch.d.ts

@@ -0,0 +1,7 @@
+export function MiniSwatch({ color, className, sx, ...props }: {
+    [x: string]: any;
+    color: any;
+    className?: string;
+    sx?: {};
+}): JSX.Element;
+export default MiniSwatch;

package/dist/types/components/MiniSwatch/index.d.ts

@@ -0,0 +1 @@
+export { MiniSwatch, default } from "./MiniSwatch";

package/dist/types/components/ShowcaseHeader.d.ts

@@ -0,0 +1,5 @@
+export function ShowcaseHeader({ title, component }: {
+    title: any;
+    component: any;
+}): JSX.Element;
+export default ShowcaseHeader;

package/dist/types/components/Swatch/Swatch.d.ts

@@ -0,0 +1,14 @@
+export function Swatch({ color, label, size, selected, disabled, radio, onClick, className, sx, "aria-label": ariaLabel, ...props }: {
+    [x: string]: any;
+    color: any;
+    label: any;
+    size?: string;
+    selected?: boolean;
+    disabled?: boolean;
+    radio?: boolean;
+    onClick: any;
+    className?: string;
+    sx?: {};
+    "aria-label": any;
+}): JSX.Element;
+export default Swatch;

package/dist/types/components/Swatch/index.d.ts

@@ -0,0 +1 @@
+export { Swatch, default } from "./Swatch";

package/dist/types/components/Switch/Switch.d.ts

@@ -1,3 +1,27 @@
+export function themedStyles(): {
+    type: string;
+    trackOff: string;
+    trackOffBorder: string;
+    trackOn: string;
+    trackOnBorder: string;
+    dotOff: string;
+    dotOn: string;
+    iconOff: string;
+    iconOn: string;
+};
+export function outlineStyles(color: any): {
+    type: string;
+    color: any;
+    trackOff: string;
+    trackOffBorder: string;
+    trackOn: string;
+    trackOnBorder: string;
+    dotOff: string;
+    dotOn: string;
+    iconOff: string;
+    iconOn: string;
+};
+export function normalizeSwitchVariant(variant: any): string;
 export function Switch({ variant, size, checked, defaultChecked, onChange, disabled, label, labelPlacement, name, value, icon, iconOn, iconOff, className, sx, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, ...props }: {
     [x: string]: any;
     variant?: string;
@@ -34,14 +58,6 @@ export function InfoOutlineSwitch(p: any): JSX.Element;
 export function SuccessOutlineSwitch(p: any): JSX.Element;
 export function WarningOutlineSwitch(p: any): JSX.Element;
 export function ErrorOutlineSwitch(p: any): JSX.Element;
-export function PrimaryLightSwitch(p: any): JSX.Element;
-export function SecondaryLightSwitch(p: any): JSX.Element;
-export function TertiaryLightSwitch(p: any): JSX.Element;
-export function NeutralLightSwitch(p: any): JSX.Element;
-export function InfoLightSwitch(p: any): JSX.Element;
-export function SuccessLightSwitch(p: any): JSX.Element;
-export function WarningLightSwitch(p: any): JSX.Element;
-export function ErrorLightSwitch(p: any): JSX.Element;
 export function SwitchInput({ variant, size, checked, defaultChecked, onChange, disabled, label, labelPlacement, name, value, icon, iconOn, iconOff, className, sx, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, ...props }: {
     [x: string]: any;
     variant?: string;

package/dist/types/components/Switch/index.d.ts

@@ -1,2 +1,2 @@
 export { SwitchShowcase } from "./SwitchShowcase";
-export { Switch, SwitchInput, PrimarySwitch, SecondarySwitch, TertiarySwitch, NeutralSwitch, InfoSwitch, SuccessSwitch, WarningSwitch, ErrorSwitch, PrimaryOutlineSwitch, SecondaryOutlineSwitch, TertiaryOutlineSwitch, NeutralOutlineSwitch, InfoOutlineSwitch, SuccessOutlineSwitch, WarningOutlineSwitch, ErrorOutlineSwitch, PrimaryLightSwitch, SecondaryLightSwitch, TertiaryLightSwitch, NeutralLightSwitch, InfoLightSwitch, SuccessLightSwitch, WarningLightSwitch, ErrorLightSwitch, default } from "./Switch";
+export { Switch, SwitchInput, PrimarySwitch, SecondarySwitch, TertiarySwitch, NeutralSwitch, InfoSwitch, SuccessSwitch, WarningSwitch, ErrorSwitch, PrimaryOutlineSwitch, SecondaryOutlineSwitch, TertiaryOutlineSwitch, NeutralOutlineSwitch, InfoOutlineSwitch, SuccessOutlineSwitch, WarningOutlineSwitch, ErrorOutlineSwitch, default } from "./Switch";

package/dist/types/components/TextField/TextField.d.ts

@@ -92,7 +92,7 @@ export function URLTextField({ label, placeholder, ...props }: {
  *   - error / errorMessage where Input has validation / validationMessage, so
  *     the same state was spelled two ways depending on which control you
  *     reached for.
- *   - No size, no variant, no colour, no adornments, no floating label.
+ *   - No size, no variant, no color, no adornments, no floating label.
  *
  * Input already takes multiline / rows / maxRows and renders a <textarea>, so
  * there was never a second thing to build — only a second thing to maintain.

package/dist/types/components/Typography/Typography.d.ts

@@ -1,8 +1,9 @@
-export function Typography({ children, textStyle, color, width, component, noWrap, gutterBottom, className, sx, ...props }: {
+export function Typography({ children, textStyle, color, altMode, width, component, noWrap, gutterBottom, className, sx, ...props }: {
     [x: string]: any;
     children: any;
     textStyle?: string;
     color: any;
+    altMode: any;
     width: any;
     component: any;
     noWrap?: boolean;
@@ -11,6 +12,39 @@ export function Typography({ children, textStyle, color, width, component, noWra
     sx?: {};
 }): JSX.Element;
 export const STYLE_MAP: {
+    'alt-display-large': {
+        component: string;
+        fontFamily: string;
+        fontSize: string;
+        fontWeight: string;
+        lineHeight: string;
+        letterSpacing: string;
+        defaultColor: string;
+        defaultWidth: string;
+        altDisplay: boolean;
+    };
+    'alt-display-medium': {
+        component: string;
+        fontFamily: string;
+        fontSize: string;
+        fontWeight: string;
+        lineHeight: string;
+        letterSpacing: string;
+        defaultColor: string;
+        defaultWidth: string;
+        altDisplay: boolean;
+    };
+    'alt-display-small': {
+        component: string;
+        fontFamily: string;
+        fontSize: string;
+        fontWeight: string;
+        lineHeight: string;
+        letterSpacing: string;
+        defaultColor: string;
+        defaultWidth: string;
+        altDisplay: boolean;
+    };
     'display-large': {
         component: string;
         fontFamily: string;
@@ -427,6 +461,22 @@ export const STYLE_ALIASES: {
     'subtitle-medium': string;
 };
 export const TYPOGRAPHY_STYLES: string[];
+/**
+ * Every CSS variable each style reads, derived from the style's own config.
+ *
+ * Generated rather than listed, because a hand-kept table is a second source
+ * of truth that drifts the first time someone adds a style — and the docs in
+ * this repo have been wrong about bindings often enough today to make that a
+ * real cost rather than a theoretical one. The config strings already contain
+ * the token names; this just reads them back out.
+ */
+export const STYLE_TOKENS: {
+    [k: string]: string[];
+};
+/** 'header' or 'standard' — which color role a style takes by default. */
+export const STYLE_DEFAULT_COLOR: {
+    [k: string]: string;
+};
 export const HEADER_COLORS: string[];
 export const TEXT_COLORS: string[];
 export const CAP_HEIGHT_TRIM: {
@@ -440,6 +490,9 @@ export const CAP_HEIGHT_TRIM: {
 export function DisplayLarge(p: any): JSX.Element;
 export function DisplayMedium(p: any): JSX.Element;
 export function DisplaySmall(p: any): JSX.Element;
+export function AltDisplayLarge(p: any): JSX.Element;
+export function AltDisplayMedium(p: any): JSX.Element;
+export function AltDisplaySmall(p: any): JSX.Element;
 export function H1(p: any): JSX.Element;
 export function H2(p: any): JSX.Element;
 export function H3(p: any): JSX.Element;

package/dist/types/components/Typography/index.d.ts

@@ -1,2 +1,2 @@
 export { TypographyShowcase } from "./TypographyShowcase";
-export { Typography, TYPOGRAPHY_STYLES, CAP_HEIGHT_TRIM, H1, H2, H3, H4, H5, H6, Heading, DisplayLarge, DisplayMedium, DisplaySmall, Subtitle, SubtitleSmall, SubtitleMedium, SubtitleLarge, Subtitle1, Subtitle2, Body, BodySmall, BodyLarge, BodySemibold, BodyBold, BodySmallSemibold, BodySmallBold, BodyLargeSemibold, BodyLargeBold, Body1, Body2, Label, LabelSmall, LabelLarge, LabelExtraSmall, Caption, CaptionBold, Legal, LegalSemibold, Button, ButtonSmall, ButtonExtraSmall, Eyebrow, EyebrowSmall, EyebrowMedium, EyebrowLarge, Overline, OverlineSmall, OverlineMedium, OverlineLarge, NumberLarge, NumberMedium, NumberSmall, default } from "./Typography";
+export { TEXT_COLORS, HEADER_COLORS, Typography, TYPOGRAPHY_STYLES, STYLE_TOKENS, STYLE_DEFAULT_COLOR, CAP_HEIGHT_TRIM, H1, H2, H3, H4, H5, H6, Heading, DisplayLarge, DisplayMedium, DisplaySmall, AltDisplayLarge, AltDisplayMedium, AltDisplaySmall, Subtitle, SubtitleSmall, SubtitleMedium, SubtitleLarge, Subtitle1, Subtitle2, Body, BodySmall, BodyLarge, BodySemibold, BodyBold, BodySmallSemibold, BodySmallBold, BodyLargeSemibold, BodyLargeBold, Body1, Body2, Label, LabelSmall, LabelLarge, LabelExtraSmall, Caption, CaptionBold, Legal, LegalSemibold, Button, ButtonSmall, ButtonExtraSmall, Eyebrow, EyebrowSmall, EyebrowMedium, EyebrowLarge, Overline, OverlineSmall, OverlineMedium, OverlineLarge, NumberLarge, NumberMedium, NumberSmall, default } from "./Typography";

package/dist/types/components/_states.d.ts

@@ -3,7 +3,7 @@
  *
  * @param {object}  [opts]
  * @param {string}  [opts.selectedBg]    resting fill when selected
- * @param {string}  [opts.selectedText]  text colour when selected
+ * @param {string}  [opts.selectedText]  text color when selected
  * @param {string}  [opts.selectedHover] fill on hover while selected
  * @param {string}  [opts.selectedPressed] fill on press while selected
  * @param {string}  [opts.muiPrefix]     'Mui' to use MUI's class-based

package/dist/types/components/a11yPanel.d.ts

@@ -0,0 +1,37 @@
+export function ContrastBadge({ ratio, threshold }: {
+    ratio: any;
+    threshold?: number;
+}): JSX.Element;
+export function A11yRow({ label, ratio, threshold, note }: {
+    label: any;
+    ratio: any;
+    threshold: any;
+    note: any;
+}): JSX.Element;
+export function A11yCheckRow({ label, pass, detail, note }: {
+    label: any;
+    pass: any;
+    detail: any;
+    note: any;
+}): JSX.Element;
+/**
+ * Read resolved CSS custom properties off a mounted element.
+ *
+ * Deferred with setTimeout and NOT requestAnimationFrame: rAF does not fire in
+ * a background or hidden tab, so a page opened in one measured nothing, and
+ * because the deps do not change afterwards it never retried — every row read
+ * "--" forever, even once the tab was focused.
+ *
+ * It also RETRIES, because the element can mount later than the effect: the
+ * preview often lives inside the Playground tab while the landing tab is
+ * Summary, so on first paint there is nothing to measure. Returning early used
+ * to end it permanently. Forty tries at 50ms, then stop, so a component with no
+ * preview does not poll forever.
+ *
+ * @param ref   ref to the element whose computed style is read
+ * @param read  (v) => data, where v(name) resolves one custom property
+ * @param deps  re-measure when these change
+ */
+export function useMeasuredTokens(ref: any, read: any, deps: any): {};
+export { getContrast };
+import { getContrast } from './contrast';

package/dist/types/components/index.d.ts

@@ -1,5 +1,8 @@
 export { Colors } from "./Colors";
 export { Spacing } from "./Spacing";
+export { BrandIcon } from "./BrandIcon";
+export { Swatch } from "./Swatch";
+export { MiniSwatch } from "./MiniSwatch";
 export { IconBadge } from "./IconBadge";
 export { IconBadgeShowcase } from "./IconBadge/IconBadgeShowcase";
 export { Button } from "./Button";
@@ -27,7 +30,7 @@ export { OmniStack as DynoStack } from "./Stack/Stack";
 export { OmniTreeView as DynoTreeView } from "./TreeView/TreeView";
 export * as chartGeometry from "./Charts/geometry";
 export { StateMessage } from "./StateMessage";
-export { Typography, CAP_HEIGHT_TRIM, Heading, DisplayLarge, DisplayMedium, DisplaySmall, H1, H2, H3, H4, H5, H6, Body, Body1, Body2, BodySemibold, BodyBold, BodySmall, BodySmallSemibold, BodySmallBold, BodyLarge, BodyLargeSemibold, BodyLargeBold, Caption, CaptionBold, Subtitle, Subtitle1, Subtitle2, SubtitleSmall, SubtitleMedium, SubtitleLarge, Legal, LegalSemibold, Label, LabelExtraSmall, LabelSmall, LabelLarge, Eyebrow, EyebrowSmall, EyebrowMedium, EyebrowLarge, Overline, OverlineSmall, OverlineMedium, OverlineLarge, NumberSmall, NumberMedium, NumberLarge, Button as ButtonText, ButtonSmall } from "./Typography";
+export { Typography, CAP_HEIGHT_TRIM, Heading, DisplayLarge, DisplayMedium, AltDisplayLarge, AltDisplayMedium, AltDisplaySmall, DisplaySmall, H1, H2, H3, H4, H5, H6, Body, Body1, Body2, BodySemibold, BodyBold, BodySmall, BodySmallSemibold, BodySmallBold, BodyLarge, BodyLargeSemibold, BodyLargeBold, Caption, CaptionBold, Subtitle, Subtitle1, Subtitle2, SubtitleSmall, SubtitleMedium, SubtitleLarge, Legal, LegalSemibold, Label, LabelExtraSmall, LabelSmall, LabelLarge, Eyebrow, EyebrowSmall, EyebrowMedium, EyebrowLarge, Overline, OverlineSmall, OverlineMedium, OverlineLarge, NumberSmall, NumberMedium, NumberLarge, Button as ButtonText, ButtonSmall } from "./Typography";
 export { Icon, IconShowcase } from "./Icon";
 export { Fab, FabShowcase } from "./Fab";
 export { Rail, RailShowcase } from "./Rail";
@@ -42,6 +45,7 @@ export { SwitchInput, SwitchInput as Switch } from "./Switch";
 export { SliderInput, RangeSlider, SliderInput as Slider } from "./Slider";
 export { RatingInput, RatingInput as Rating } from "./Rating";
 export { SearchField, SearchFieldShowcase } from "./SearchField";
+export { Tag, TAG_COLORS, TAG_COLOR_TOKEN_MAP, PrimaryTag, SecondaryTag, TertiaryTag, NeutralTag, InfoTag, SuccessTag, WarningTag, ErrorTag, TagShowcase } from "./Tag";
 export { OmniStack, Stack, HStack, VStack, CenteredStack, SpaceBetweenStack, WrapStack, ResponsiveStack, GridStack, StackDivider, InsetStack, ScrollStack, StackShowcase } from "./Stack";
 export { Box, BoxShowcase } from "./Box";
 export { Section, SectionShowcase } from "./Section";
@@ -61,6 +65,7 @@ export { Alert, AlertShowcase } from "./Alert";
 export { Snackbar, SnackbarShowcase } from "./Snackbar";
 export { CircularProgress, CircularProgressShowcase } from "./CircularProgress";
 export { LinearProgress, LinearProgressShowcase } from "./LinearProgress";
+export { Loader, LinearLoader, SkeletonLoader, DotsLoader, PageLoader, SkeletonCard, OverlayLoader } from "./Loader";
 export { Avatar, AvatarGroup, AvatarShowcase, DEFAULT_AVATAR_SRC } from "./Avatar";
 export { Badge, BadgeShowcase } from "./Badge";
 export { List, ListItem, ListItemDecorator } from "./List";
@@ -75,3 +80,4 @@ export { OmniDesignProvider, useOmniDesign, ThemedZone, Surfaced } from "../Omni
 export { CodeBlock, CopyButton } from "./CodeBlock/CodeBlock";
 export { BarChart, LineChart, PieChart, CHART_TOKENS, CHART_LABEL_TYPE } from "./Charts";
 export { Ghost, useGhost, ghostBlockSx } from "./_ghost";
+export { COMPONENT_DOCS, FOUNDATIONS, renderFoundations, renderColorSystem, renderColorSystem as renderColourSystem, renderComponentDoc, COLOR_COLLECTIONS, COLOR_COLLECTIONS as COLOUR_COLLECTIONS, docsSlug, componentDocsUrl, componentDocsIndexUrl, DOCS_ORIGIN, EXAMPLES, hasExample } from "../docs";

package/dist/types/docs/DocPanels.d.ts

@@ -0,0 +1,25 @@
+export function docFor(component: any): {
+    name: any;
+    summary: any;
+    insteadUse: any;
+    props: any;
+    states: any;
+    theming: {
+        collection: string;
+        inCode: string;
+        inFigma: string;
+    }[];
+    tokens: any;
+    composition: any;
+    accessibility: any;
+    gotchas: any;
+};
+export function DocSummary({ component, theme, surface }: {
+    component: any;
+    theme?: any;
+    surface?: string;
+}): JSX.Element;
+/** Breaking and silent changes, newest first, plus a way to report one. */
+export function DocChanges({ component }: {
+    component: any;
+}): JSX.Element;