@veritone-ce/design-system 2.0.7 → 2.1.0

package/dist/esm/Dialog/styles.module.scss.js

@@ -0,0 +1,3 @@
+var modules_efc4e723 = {"dialog-overlay":"vt_ce_Dialog_dialogOverlay__19d426a2","dialog":"vt_ce_Dialog_dialog__19d426a2","dialog-start":"vt_ce_Dialog_dialogStart__19d426a2","dialog-end":"vt_ce_Dialog_dialogEnd__19d426a2","dialog-content":"vt_ce_Dialog_dialogContent__19d426a2","dialog-title":"vt_ce_Dialog_dialogTitle__19d426a2","dialog-typography":"vt_ce_Dialog_dialogTypography__19d426a2","dialog-actions":"vt_ce_Dialog_dialogActions__19d426a2"};
+
+export { modules_efc4e723 as default };

package/dist/{esm-next → esm}/Drawer/components.js

@@ -5,6 +5,8 @@ import * as React from 'react';
 import { useMergeRefs, FloatingPortal, FloatingOverlay, FloatingFocusManager } from '@floating-ui/react';
 import modules_efc4e723 from './styles.module.scss.js';
 import { useDrawer, DrawerContext, useDrawerContext } from './state.js';
+import 'color2k';
+import '../styles/css-vars.js';
 import { cx } from '../styles/cx.js';
 import '../styles/defaultTheme.js';
 import '@mui/system';

package/dist/esm/Drawer/styles.module.scss.js

@@ -0,0 +1,3 @@
+var modules_efc4e723 = {"drawer-overlay":"vt_ce_Drawer_drawerOverlay__6d49b031","drawer":"vt_ce_Drawer_drawer__6d49b031","drawer-start":"vt_ce_Drawer_drawerStart__6d49b031","drawer-end":"vt_ce_Drawer_drawerEnd__6d49b031","drawer-content":"vt_ce_Drawer_drawerContent__6d49b031","drawer-title":"vt_ce_Drawer_drawerTitle__6d49b031","drawer-typography":"vt_ce_Drawer_drawerTypography__6d49b031","drawer-actions":"vt_ce_Drawer_drawerActions__6d49b031"};
+
+export { modules_efc4e723 as default };

package/dist/{esm-next → esm}/Icon/wrappers.js

@@ -2,6 +2,8 @@
 import { jsx } from 'react/jsx-runtime';
 import React__default from 'react';
 import modules_efc4e723 from './styles.module.scss.js';
+import 'color2k';
+import '../styles/css-vars.js';
 import { cx } from '../styles/cx.js';
 import '../styles/defaultTheme.js';
 import '@mui/system';

package/dist/{esm-next → esm}/IconButton/index.js

@@ -4,6 +4,8 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import CircularProgress from '../CircularProgress/index.js';
 import modules_efc4e723 from './styles.module.scss.js';
+import 'color2k';
+import '../styles/css-vars.js';
 import { cx } from '../styles/cx.js';
 import '../styles/defaultTheme.js';
 import '@mui/system';

package/dist/esm/IconButton/styles.module.scss.js

@@ -0,0 +1,3 @@
+var modules_efc4e723 = {"button":"vt_ce_IconButton_button__b5583457","inner-icon":"vt_ce_IconButton_innerIcon__b5583457","loading-container":"vt_ce_IconButton_loadingContainer__b5583457"};
+
+export { modules_efc4e723 as default };

package/dist/{esm-next → esm}/Input/index.js

@@ -3,6 +3,8 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import modules_efc4e723 from './styles.module.scss.js';
+import 'color2k';
+import '../styles/css-vars.js';
 import { cx } from '../styles/cx.js';
 import '../styles/defaultTheme.js';
 import '@mui/system';
@@ -30,6 +32,7 @@ const Input = forwardRef((props, ref) => {
                 {
                   ref,
                   type: props.type,
+                  name: props.name,
                   placeholder: props.placeholder,
                   value: props.value,
                   disabled: props.disabled,

package/dist/esm/Input/styles.module.scss.js

@@ -0,0 +1,3 @@
+var modules_efc4e723 = {"input":"vt_ce_Input_input__f7983a21","label":"vt_ce_Input_label__f7983a21","inner-input-container":"vt_ce_Input_innerInputContainer__f7983a21","inner-input":"vt_ce_Input_innerInput__f7983a21","input-icon":"vt_ce_Input_inputIcon__f7983a21","help-label":"vt_ce_Input_helpLabel__f7983a21","error-label":"vt_ce_Input_errorLabel__f7983a21"};
+
+export { modules_efc4e723 as default };

package/dist/{esm-next → esm}/Menu/controlled.js

@@ -2,6 +2,8 @@
 'use client';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import React__default from 'react';
+import 'color2k';
+import '../styles/css-vars.js';
 import { cx } from '../styles/cx.js';
 import '../styles/defaultTheme.js';
 import '@mui/system';

package/dist/esm/Menu/styles.module.scss.js

@@ -0,0 +1,3 @@
+var modules_efc4e723 = {"menu":"vt_ce_Menu_menu__f5f59292","option":"vt_ce_Menu_option__f5f59292","option-icon":"vt_ce_Menu_optionIcon__f5f59292","option-label":"vt_ce_Menu_optionLabel__f5f59292"};
+
+export { modules_efc4e723 as default };

package/dist/{esm-next → esm}/RadioButton/index.js

@@ -4,6 +4,8 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import { forwardRef, useRef, useId } from 'react';
 import { useForkRef } from '@mui/material';
 import modules_efc4e723 from './styles.module.scss.js';
+import 'color2k';
+import '../styles/css-vars.js';
 import { cx } from '../styles/cx.js';
 import '../styles/defaultTheme.js';
 import '@mui/system';

package/dist/esm/RadioButton/styles.module.scss.js

@@ -0,0 +1,3 @@
+var modules_efc4e723 = {"radio":"vt_ce_RadioButton_radio__d49ab70a","radio-circle-outer":"vt_ce_RadioButton_radioCircleOuter__d49ab70a","radio-circle-inner":"vt_ce_RadioButton_radioCircleInner__d49ab70a","passthrough-label-container":"vt_ce_RadioButton_passthroughLabelContainer__d49ab70a","invisible-radio":"vt_ce_RadioButton_invisibleRadio__d49ab70a","visible-label":"vt_ce_RadioButton_visibleLabel__d49ab70a","icon-container":"vt_ce_RadioButton_iconContainer__d49ab70a"};
+
+export { modules_efc4e723 as default };

package/dist/{esm-next → esm}/Select/controlled.js

@@ -2,6 +2,8 @@
 'use client';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { useId, useRef, useState } from 'react';
+import 'color2k';
+import '../styles/css-vars.js';
 import { cx } from '../styles/cx.js';
 import '../styles/defaultTheme.js';
 import '@mui/system';

package/dist/esm/Select/styles.module.scss.js

@@ -0,0 +1,3 @@
+var modules_efc4e723 = {"select":"vt_ce_Select_select__cb05e024","label":"vt_ce_Select_label__cb05e024","inner-input-container":"vt_ce_Select_innerInputContainer__cb05e024","inner-input":"vt_ce_Select_innerInput__cb05e024","select-icon":"vt_ce_Select_selectIcon__cb05e024","help-label":"vt_ce_Select_helpLabel__cb05e024","error-label":"vt_ce_Select_errorLabel__cb05e024"};
+
+export { modules_efc4e723 as default };

package/dist/esm/TablePagination/styles.module.scss.js

@@ -0,0 +1,3 @@
+var modules_efc4e723 = {"container":"vt_ce_TablePagination_container__8da45ccd","rows-per-page":"vt_ce_TablePagination_rowsPerPage__8da45ccd","rows-per-page-label":"vt_ce_TablePagination_rowsPerPageLabel__8da45ccd","rows-per-page-select":"vt_ce_TablePagination_rowsPerPageSelect__8da45ccd","page-counts":"vt_ce_TablePagination_pageCounts__8da45ccd","btn-list":"vt_ce_TablePagination_btnList__8da45ccd","ellipsis":"vt_ce_TablePagination_ellipsis__8da45ccd"};
+
+export { modules_efc4e723 as default };

package/dist/{esm-next → esm}/Textarea/index.js

@@ -3,6 +3,8 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import modules_efc4e723 from './styles.module.scss.js';
+import 'color2k';
+import '../styles/css-vars.js';
 import { cx } from '../styles/cx.js';
 import '../styles/defaultTheme.js';
 import '@mui/system';

package/dist/esm/Textarea/styles.module.scss.js

@@ -0,0 +1,3 @@
+var modules_efc4e723 = {"textarea":"vt_ce_Textarea_textarea__77e999b0","label":"vt_ce_Textarea_label__77e999b0","inner-textarea-container":"vt_ce_Textarea_innerTextareaContainer__77e999b0","inner-textarea":"vt_ce_Textarea_innerTextarea__77e999b0","help-label":"vt_ce_Textarea_helpLabel__77e999b0","error-label":"vt_ce_Textarea_errorLabel__77e999b0"};
+
+export { modules_efc4e723 as default };

package/dist/{esm-next → esm}/Tooltip/index.js

@@ -4,6 +4,8 @@ import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { useFloating, offset, inline, flip, shift, arrow, autoUpdate, useRole, useHover, safePolygon, useFocus, useDismiss, useInteractions, FloatingArrow } from '@floating-ui/react';
 import React__default from 'react';
 import modules_efc4e723 from './styles.module.scss.js';
+import 'color2k';
+import '../styles/css-vars.js';
 import { defaultThemeCssVariableUsages } from '../styles/defaultTheme.js';
 import '@mui/system';
 import '../styles/styled.js';
@@ -73,8 +75,8 @@ function Tooltip({
             {
               ref: arrowRef,
               context,
-              fill: defaultThemeCssVariableUsages.palette.background,
-              stroke: defaultThemeCssVariableUsages.palette.backgroundAlt,
+              fill: defaultThemeCssVariableUsages.palette.background.primary,
+              stroke: defaultThemeCssVariableUsages.palette.background.secondary,
               strokeWidth: 1
             }
           ),

package/dist/{esm-next → esm}/Tooltip/styles.module.scss.js

@@ -1,3 +1,3 @@
-var modules_efc4e723 = {"tooltip-anchor":"vt_ce_Tooltip_tooltipAnchor__86070564","tooltip-body":"vt_ce_Tooltip_tooltipBody__86070564"};
+var modules_efc4e723 = {"tooltip-anchor":"vt_ce_Tooltip_tooltipAnchor__767b0a12","tooltip-body":"vt_ce_Tooltip_tooltipBody__767b0a12"};
 
 export { modules_efc4e723 as default };

package/dist/{esm-next → esm}/Typography/index.js

@@ -1,5 +1,7 @@
 'use strict';
 import React__default, { forwardRef } from 'react';
+import 'color2k';
+import '../styles/css-vars.js';
 import { cx } from '../styles/cx.js';
 import '../styles/defaultTheme.js';
 import '@mui/system';

package/dist/esm/Typography/variants.module.scss.js

@@ -0,0 +1,3 @@
+var modules_b5c3b63b = {"t-title":"vt_ce_Typography_tTitle__8a6d644d","t-h1":"vt_ce_Typography_tH1__8a6d644d","t-h2":"vt_ce_Typography_tH2__8a6d644d","t-h3":"vt_ce_Typography_tH3__8a6d644d","t-h4":"vt_ce_Typography_tH4__8a6d644d","t-label":"vt_ce_Typography_tLabel__8a6d644d","t-paragraph1":"vt_ce_Typography_tParagraph1__8a6d644d","t-paragraph2":"vt_ce_Typography_tParagraph2__8a6d644d","t-paragraph3":"vt_ce_Typography_tParagraph3__8a6d644d","t-button":"vt_ce_Typography_tButton__8a6d644d","t-buttonSmall":"vt_ce_Typography_tButtonSmall__8a6d644d","c-primary":"vt_ce_Typography_cPrimary__8a6d644d","c-secondary":"vt_ce_Typography_cSecondary__8a6d644d","c-tertiary":"vt_ce_Typography_cTertiary__8a6d644d","c-disabled":"vt_ce_Typography_cDisabled__8a6d644d"};
+
+export { modules_b5c3b63b as default };

package/dist/esm/index.js

@@ -1,30 +1,40 @@
-// note to maintainers: keep in alphabetical order
-
-export { createDesignSystemTheme, useTheme } from './assets/theme.js';
-export { default as AudioSlider } from './components/AudioSlider/index.js';
-export { default as Breadcrumbs } from './components/Breadcrumbs/index.js';
-export { default as Drawer } from './components/Drawer/index.js';
-export { default as ErrorMessage } from './components/ErrorMessage/index.js';
-export { default as FileUploader, useFileUploader } from './components/FileUploader/index.js';
-export { default as FormControlLabel } from './components/FormControlLabel/index.js';
-export { default as LinearProgress } from './components/LinearProgress/index.js';
-export { default as Link } from './components/Link/index.js';
-export { default as List } from './components/List/index.js';
-export { default as ListItem } from './components/ListItem/index.js';
-export { default as ListItemButton } from './components/ListItemButton/index.js';
-export { default as ListItemText } from './components/ListItemText/index.js';
-export { default as Panel, PanelContent } from './components/Panel/index.js';
-export { default as ProgressIndicator } from './components/ProgressIndicator/index.js';
-export { default as StatusChip } from './components/StatusChip/index.js';
-export { default as Step } from './components/Step/index.js';
-export { default as StepLabel } from './components/StepLabel/index.js';
-export { default as Stepper } from './components/Stepper/index.js';
-export { Table, TableBody, TableCell, SelectionTableCell, TableFooter, TableHead, TablePagination, TableRow, TableSortLabel, TableMessage as TableZeroState } from './components/Table/index.js';
-export { default as AutoTable, createColumnHelper } from './components/Table/AutoTable/index.js';
-export { default as ControlledAutoTable } from './components/Table/AutoTable/controlled.js';
-export { default as VirtualControlledAutoTable } from './components/Table/AutoTable/virtual.js';
-export { default as Tabs } from './components/Tabs/index.js';
-export { default as ThemeProvider } from './components/ThemeProvider/index.js';
-export { default as HomeOutlinedIcon } from './components/icons/HomeOutlinedIcon/index.js';
-export { default as IconGroups } from './components/icons/IconGroups/index.js';
-export { default as IconListItem } from './components/icons/IconListItem/index.js';
+'use strict';
+export { default as THEME_ID } from './styles/identifier.js';
+export { default as createTheme } from './styles/createTheme.js';
+export { createThemeCssVariableDefinitions, themeCSSVariableNames } from './styles/css-vars.js';
+export { cx } from './styles/cx.js';
+export { defaultThemeCssVariableUsages as ThemeVars, defaultDarkTheme, default as defaultTheme } from './styles/defaultTheme.js';
+export { default as useTheme } from './styles/useTheme.js';
+export { createPalette } from './styles/palette.js';
+export { default as experimentalStyled, default as styled } from './styles/styled.js';
+export { ThemeContextProvider } from './styles/provider.client.js';
+export { ThemeCssVarsProvider } from './styles/provider.css-vars.js';
+export { TypographyVariantKeys, createTypography } from './styles/typography.js';
+export { unstable_capitalize as capitalize } from '@mui/utils';
+export { default as Alert } from './Alert/index.js';
+export { default as Box } from './Box/index.js';
+export { default as Button } from './Button/index.js';
+export { default as Checkbox } from './Checkbox/index.js';
+export { default as CircularProgress } from './CircularProgress/index.js';
+export { default as Dialog, DialogActions, DialogCloseButton, DialogCloseIconButton, DialogContent, DialogDescription, DialogEnd, DialogStart, DialogTitle, DialogTypography } from './Dialog/components.js';
+export { createDialogComponent } from './Dialog/factory.js';
+export { default as Drawer, DrawerActions, DrawerCloseButton, DrawerCloseIconButton, DrawerContent, DrawerDescription, DrawerEnd, DrawerStart, DrawerTitle, DrawerTypography } from './Drawer/components.js';
+export { createDrawerComponent } from './Drawer/factory.js';
+export { default as GlobalStyles } from './GlobalStyles/index.js';
+export { adaptMuiSvgIcon, adaptSvgIcon } from './Icon/wrappers.js';
+export { DefaultIconFallback, createIconComponent } from './Icon/factory.js';
+export { default as IconButton } from './IconButton/index.js';
+export { default as Input } from './Input/index.js';
+export { default as Menu, MenuItem } from './Menu/controlled.js';
+export { createMenuComponent } from './Menu/factory.js';
+export { default as Pagination } from './Pagination/index.js';
+export { default as RadioButton } from './RadioButton/index.js';
+export { default as ControlledSelect } from './Select/controlled.js';
+export { default as Select } from './Select/uncontrolled.js';
+export { createControlledSelectComponent, createSelectComponent } from './Select/factory.js';
+export { default as TablePagination } from './TablePagination/index.js';
+export { default as Textarea } from './Textarea/index.js';
+export { default as Toast } from './Toast/index.js';
+export { ToastProvider, useToast } from './Toast/hook.js';
+export { default as Tooltip } from './Tooltip/index.js';
+export { default as Typography } from './Typography/index.js';

package/dist/esm/styles/css-vars.js

@@ -0,0 +1,71 @@
+'use strict';
+import createTheme from './createTheme.js';
+import { TypographyVariantKeys } from './typography.js';
+
+const themeCSSVariableNames = objectAsCSSVariableNames(createTheme(), "--vt-ce-theme");
+function createThemeCssVariableUsages(theme, cssVariableNames = themeCSSVariableNames) {
+  const usages = objectAsCSSVariableUsages(theme, cssVariableNames);
+  return {
+    ...usages,
+    typography: {
+      ...TypographyVariantKeys.reduce(
+        (acc, variantKey) => ({
+          ...acc,
+          [variantKey]: {
+            ...acc[variantKey],
+            all: theme.typography[variantKey]
+          }
+        }),
+        usages.typography
+      )
+      // TODO: fix typing
+    }
+  };
+}
+function createThemeCssVariableDefinitions(theme, cssVariableNames = themeCSSVariableNames) {
+  return objectAsCSSVariableDefinitions(theme, cssVariableNames);
+}
+function objectAsCSSVariableNames(obj, prefix) {
+  return Object.keys(obj).reduce(
+    (acc, key) => {
+      const inner = obj[key];
+      return {
+        ...acc,
+        [key]: typeof inner === "object" ? objectAsCSSVariableNames(inner, prefix + "-" + key) : prefix + "-" + key
+      };
+    },
+    {}
+  );
+}
+function objectAsCSSVariableUsages(obj, cssVarNames) {
+  return Object.keys(obj).reduce(
+    (acc, key) => {
+      const value = obj[key];
+      const cssNameOrInnerNames = cssVarNames[key];
+      return {
+        ...acc,
+        [key]: typeof value === "object" ? objectAsCSSVariableUsages(value, cssNameOrInnerNames) : `var(${cssNameOrInnerNames}, ${value})`
+      };
+    },
+    {}
+  );
+}
+function objectAsCSSVariableDefinitions(obj, cssVarNames) {
+  return Object.keys(obj).reduce((acc, key) => {
+    const value = obj[key];
+    const cssNameOrInnerNames = cssVarNames[key];
+    if (typeof value === "object") {
+      return {
+        ...acc,
+        ...objectAsCSSVariableDefinitions(value, cssNameOrInnerNames)
+      };
+    } else {
+      return {
+        ...acc,
+        [cssNameOrInnerNames]: value
+      };
+    }
+  }, {});
+}
+
+export { createThemeCssVariableDefinitions, createThemeCssVariableUsages, objectAsCSSVariableDefinitions, objectAsCSSVariableNames, objectAsCSSVariableUsages, themeCSSVariableNames };

package/dist/esm/styles/defaultTheme.js

@@ -0,0 +1,44 @@
+'use strict';
+import createTheme from './createTheme.js';
+import { createThemeCssVariableUsages, themeCSSVariableNames } from './css-vars.js';
+
+const defaultTheme = createTheme();
+const defaultThemeCssVariableUsages = createThemeCssVariableUsages(
+  defaultTheme,
+  themeCSSVariableNames
+);
+const defaultDarkTheme = createTheme({
+  palette: {
+    text: {
+      primary: "#DBE8F8",
+      secondary: "#D0D4D9",
+      tertiary: "#B0BDCE"
+    },
+    action: {
+      primary: {
+        base: {
+          surface: "#66A1EF",
+          on: "#FFFFFF"
+        },
+        hover: {
+          surface: "#6290CF",
+          on: "#FFFFFF"
+        }
+      },
+      destructive: {
+        base: "#EB0000",
+        hover: "#a63737"
+      }
+    },
+    background: {
+      primary: "#121212",
+      secondary: "#2F2F2F"
+    },
+    disabled: {
+      on: "#7C848D",
+      surface: "#444444"
+    }
+  }
+});
+
+export { defaultTheme as default, defaultDarkTheme, defaultThemeCssVariableUsages };

package/dist/esm/styles/palette.js

@@ -0,0 +1,202 @@
+'use strict';
+import { readableColor, toHex, darken, lighten, desaturate } from 'color2k';
+
+function isPaletteColorOptions(obj) {
+  return typeof obj === "string";
+}
+function createPaletteColor(options) {
+  return options;
+}
+function contrastColor(surface) {
+  return readableColor(surface);
+}
+function isPaletteSurfaceColorsOptions(obj) {
+  return typeof obj === "string" || obj["surface"] !== void 0;
+}
+function createPaletteSurfaceColors(options) {
+  if (typeof options === "string") {
+    const surface = createPaletteColor(options);
+    return {
+      surface,
+      on: contrastColor(surface)
+    };
+  } else {
+    const surface = createPaletteColor(options.surface);
+    return {
+      surface,
+      on: options.on ? createPaletteColor(options.on) : contrastColor(surface)
+    };
+  }
+}
+function createPaletteActionVariantsColors(options, disabled) {
+  const hoverFromBase = (b) => ({
+    surface: toHex(desaturate(darken(b.surface, 1 / 10), 1 / 4)),
+    on: b.on
+  });
+  if (isPaletteSurfaceColorsOptions(options)) {
+    const resolved = createPaletteSurfaceColors(options);
+    return {
+      base: resolved,
+      hover: hoverFromBase(resolved),
+      disabled
+    };
+  } else {
+    const base = createPaletteSurfaceColors(options.base);
+    return {
+      base,
+      hover: options.hover ? createPaletteSurfaceColors(options.hover) : hoverFromBase(base),
+      disabled
+    };
+  }
+}
+function createPaletteBrand(options) {
+  const brandColorStepFromBase = (b, step) => {
+    return {
+      surface: step >= 1 ? toHex(darken(b.surface, step / 20)) : toHex(lighten(b.surface, step / 2)),
+      on: b.on
+    };
+  };
+  if (isPaletteSurfaceColorsOptions(options)) {
+    const resolved = createPaletteSurfaceColors(options);
+    return {
+      1: resolved,
+      2: brandColorStepFromBase(resolved, 1),
+      3: brandColorStepFromBase(resolved, 2),
+      4: brandColorStepFromBase(resolved, 0.5),
+      5: brandColorStepFromBase(resolved, 0.25)
+    };
+  } else {
+    const base = createPaletteSurfaceColors(options[1]);
+    return {
+      1: base,
+      2: options[2] ? createPaletteSurfaceColors(options[2]) : brandColorStepFromBase(base, 1),
+      3: options[3] ? createPaletteSurfaceColors(options[3]) : brandColorStepFromBase(base, 2),
+      4: options[4] ? createPaletteSurfaceColors(options[4]) : brandColorStepFromBase(base, 0.5),
+      5: options[5] ? createPaletteSurfaceColors(options[5]) : brandColorStepFromBase(base, 0.25)
+    };
+  }
+}
+function createPaletteText(options) {
+  const textColorStepFromBase = (b, _step) => {
+    return b;
+  };
+  if (isPaletteColorOptions(options)) {
+    const resolved = createPaletteColor(options);
+    return {
+      primary: resolved,
+      secondary: textColorStepFromBase(resolved),
+      tertiary: textColorStepFromBase(resolved)
+    };
+  } else {
+    const base = createPaletteColor(options.primary);
+    return {
+      primary: base,
+      secondary: options.secondary ? createPaletteColor(options.secondary) : textColorStepFromBase(base),
+      tertiary: options.tertiary ? createPaletteColor(options.tertiary) : textColorStepFromBase(base)
+    };
+  }
+}
+function createPaletteAction(options, disabled) {
+  const destructiveDefault = createPaletteActionVariantsColors(
+    {
+      base: {
+        surface: "#EB0000",
+        on: "#FFFFFF"
+      },
+      hover: {
+        surface: "#a63737",
+        on: "#FFFFFF"
+      }
+    },
+    disabled
+  );
+  return {
+    primary: createPaletteActionVariantsColors(options.primary, disabled),
+    destructive: options.destructive ? createPaletteActionVariantsColors(options.destructive, disabled) : destructiveDefault
+  };
+}
+function createPaletteIndicator(options, disabled) {
+  return {
+    success: options.success ? createPaletteActionVariantsColors(options.success, disabled) : createPaletteActionVariantsColors("#28BA3F", disabled),
+    info: options.info ? createPaletteActionVariantsColors(options.info, disabled) : createPaletteActionVariantsColors("#335B89", disabled),
+    warning: options.warning ? createPaletteActionVariantsColors(options.warning, disabled) : createPaletteActionVariantsColors("#FFBB0A", disabled),
+    error: options.error ? createPaletteActionVariantsColors(options.error, disabled) : createPaletteActionVariantsColors("#EB0000", disabled)
+  };
+}
+function createPaletteTable(options, disabled) {
+  return createPaletteActionVariantsColors(options, disabled);
+}
+function createPaletteBackground(options) {
+  const backgroundStepFromBase = (b, step) => {
+    return toHex(darken(b, step / 20));
+  };
+  if (isPaletteColorOptions(options)) {
+    const resolved = createPaletteColor(options);
+    return {
+      primary: resolved,
+      secondary: backgroundStepFromBase(resolved, 1)
+    };
+  } else {
+    const base = createPaletteColor(options.primary);
+    return {
+      primary: base,
+      secondary: options.secondary ? createPaletteColor(options.secondary) : backgroundStepFromBase(base, 1)
+    };
+  }
+}
+function createPalette(options = {}) {
+  const disabled = options.disabled ? createPaletteSurfaceColors(options.disabled) : createPaletteSurfaceColors({
+    surface: "#FAFAFA",
+    on: "#7C848D"
+  });
+  return {
+    brand: createPaletteBrand(
+      options.brand ?? {
+        1: "#214167",
+        2: "#335B89"
+      }
+    ),
+    text: createPaletteText(
+      options.text ?? {
+        primary: "#2A323C",
+        secondary: "#5C6269",
+        tertiary: "#465364"
+      }
+    ),
+    action: createPaletteAction(
+      options.action ?? {
+        primary: {
+          base: {
+            surface: "#1871E8",
+            on: "#FFFFFF"
+          },
+          hover: {
+            surface: "#335B89",
+            on: "#FFFFFF"
+          }
+        }
+      },
+      disabled
+    ),
+    indicator: createPaletteIndicator(options.indicator ?? {}, disabled),
+    disabled,
+    background: createPaletteBackground(
+      options.background ?? {
+        primary: "#FFFFFF",
+        secondary: "#E0E8F0"
+      }
+    ),
+    table: createPaletteTable(
+      options.table ?? {
+        base: {
+          surface: "#FFFFFF",
+          on: "#2A323C"
+        },
+        hover: "#EAF1FA"
+      },
+      disabled
+    )
+  };
+}
+
+export { createPalette };