@veritone-ce/design-system 2.0.8 → 2.1.0

package/dist/cjs/index.js

@@ -1,283 +1,115 @@
-"use strict";
+'use strict';
+'use strict';
 
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "AudioSlider", {
-  enumerable: true,
-  get: function get() {
-    return _index["default"];
-  }
-});
-Object.defineProperty(exports, "AutoTable", {
-  enumerable: true,
-  get: function get() {
-    return _index20["default"];
-  }
-});
-Object.defineProperty(exports, "Breadcrumbs", {
-  enumerable: true,
-  get: function get() {
-    return _index2["default"];
-  }
-});
-Object.defineProperty(exports, "ControlledAutoTable", {
-  enumerable: true,
-  get: function get() {
-    return _controlled["default"];
-  }
-});
-Object.defineProperty(exports, "Drawer", {
-  enumerable: true,
-  get: function get() {
-    return _index3["default"];
-  }
-});
-Object.defineProperty(exports, "ErrorMessage", {
-  enumerable: true,
-  get: function get() {
-    return _index4["default"];
-  }
-});
-Object.defineProperty(exports, "FileUploader", {
-  enumerable: true,
-  get: function get() {
-    return _index5["default"];
-  }
-});
-Object.defineProperty(exports, "FormControlLabel", {
-  enumerable: true,
-  get: function get() {
-    return _index6["default"];
-  }
-});
-Object.defineProperty(exports, "HomeOutlinedIcon", {
-  enumerable: true,
-  get: function get() {
-    return _index23["default"];
-  }
-});
-Object.defineProperty(exports, "IconGroups", {
-  enumerable: true,
-  get: function get() {
-    return _index24["default"];
-  }
-});
-Object.defineProperty(exports, "IconListItem", {
-  enumerable: true,
-  get: function get() {
-    return _index25["default"];
-  }
-});
-Object.defineProperty(exports, "LinearProgress", {
-  enumerable: true,
-  get: function get() {
-    return _index7["default"];
-  }
-});
-Object.defineProperty(exports, "Link", {
-  enumerable: true,
-  get: function get() {
-    return _index8["default"];
-  }
-});
-Object.defineProperty(exports, "List", {
-  enumerable: true,
-  get: function get() {
-    return _index9["default"];
-  }
-});
-Object.defineProperty(exports, "ListItem", {
-  enumerable: true,
-  get: function get() {
-    return _index10["default"];
-  }
-});
-Object.defineProperty(exports, "ListItemButton", {
-  enumerable: true,
-  get: function get() {
-    return _index11["default"];
-  }
-});
-Object.defineProperty(exports, "ListItemText", {
-  enumerable: true,
-  get: function get() {
-    return _index12["default"];
-  }
-});
-Object.defineProperty(exports, "Panel", {
-  enumerable: true,
-  get: function get() {
-    return _index13["default"];
-  }
-});
-Object.defineProperty(exports, "PanelContent", {
-  enumerable: true,
-  get: function get() {
-    return _index13.PanelContent;
-  }
-});
-Object.defineProperty(exports, "ProgressIndicator", {
-  enumerable: true,
-  get: function get() {
-    return _index14["default"];
-  }
-});
-Object.defineProperty(exports, "SelectionTableCell", {
-  enumerable: true,
-  get: function get() {
-    return _index19.SelectionTableCell;
-  }
-});
-Object.defineProperty(exports, "StatusChip", {
-  enumerable: true,
-  get: function get() {
-    return _index15["default"];
-  }
-});
-Object.defineProperty(exports, "Step", {
-  enumerable: true,
-  get: function get() {
-    return _index16["default"];
-  }
-});
-Object.defineProperty(exports, "StepLabel", {
-  enumerable: true,
-  get: function get() {
-    return _index17["default"];
-  }
-});
-Object.defineProperty(exports, "Stepper", {
-  enumerable: true,
-  get: function get() {
-    return _index18["default"];
-  }
-});
-Object.defineProperty(exports, "Table", {
-  enumerable: true,
-  get: function get() {
-    return _index19.Table;
-  }
-});
-Object.defineProperty(exports, "TableBody", {
-  enumerable: true,
-  get: function get() {
-    return _index19.TableBody;
-  }
-});
-Object.defineProperty(exports, "TableCell", {
-  enumerable: true,
-  get: function get() {
-    return _index19.TableCell;
-  }
-});
-Object.defineProperty(exports, "TableFooter", {
-  enumerable: true,
-  get: function get() {
-    return _index19.TableFooter;
-  }
-});
-Object.defineProperty(exports, "TableHead", {
-  enumerable: true,
-  get: function get() {
-    return _index19.TableHead;
-  }
-});
-Object.defineProperty(exports, "TablePagination", {
-  enumerable: true,
-  get: function get() {
-    return _index19.TablePagination;
-  }
-});
-Object.defineProperty(exports, "TableRow", {
-  enumerable: true,
-  get: function get() {
-    return _index19.TableRow;
-  }
-});
-Object.defineProperty(exports, "TableSortLabel", {
-  enumerable: true,
-  get: function get() {
-    return _index19.TableSortLabel;
-  }
-});
-Object.defineProperty(exports, "TableZeroState", {
-  enumerable: true,
-  get: function get() {
-    return _index19.TableMessage;
-  }
-});
-Object.defineProperty(exports, "Tabs", {
-  enumerable: true,
-  get: function get() {
-    return _index21["default"];
-  }
-});
-Object.defineProperty(exports, "ThemeProvider", {
-  enumerable: true,
-  get: function get() {
-    return _index22["default"];
-  }
-});
-Object.defineProperty(exports, "VirtualControlledAutoTable", {
-  enumerable: true,
-  get: function get() {
-    return _virtual["default"];
-  }
-});
-Object.defineProperty(exports, "createColumnHelper", {
-  enumerable: true,
-  get: function get() {
-    return _index20.createColumnHelper;
-  }
-});
-Object.defineProperty(exports, "createDesignSystemTheme", {
-  enumerable: true,
-  get: function get() {
-    return _theme.createDesignSystemTheme;
-  }
-});
-Object.defineProperty(exports, "useFileUploader", {
-  enumerable: true,
-  get: function get() {
-    return _index5.useFileUploader;
-  }
-});
-Object.defineProperty(exports, "useTheme", {
-  enumerable: true,
-  get: function get() {
-    return _theme.useTheme;
-  }
-});
-var _theme = require("./assets/theme.js");
-var _index = _interopRequireDefault(require("./components/AudioSlider/index.js"));
-var _index2 = _interopRequireDefault(require("./components/Breadcrumbs/index.js"));
-var _index3 = _interopRequireDefault(require("./components/Drawer/index.js"));
-var _index4 = _interopRequireDefault(require("./components/ErrorMessage/index.js"));
-var _index5 = _interopRequireWildcard(require("./components/FileUploader/index.js"));
-var _index6 = _interopRequireDefault(require("./components/FormControlLabel/index.js"));
-var _index7 = _interopRequireDefault(require("./components/LinearProgress/index.js"));
-var _index8 = _interopRequireDefault(require("./components/Link/index.js"));
-var _index9 = _interopRequireDefault(require("./components/List/index.js"));
-var _index10 = _interopRequireDefault(require("./components/ListItem/index.js"));
-var _index11 = _interopRequireDefault(require("./components/ListItemButton/index.js"));
-var _index12 = _interopRequireDefault(require("./components/ListItemText/index.js"));
-var _index13 = _interopRequireWildcard(require("./components/Panel/index.js"));
-var _index14 = _interopRequireDefault(require("./components/ProgressIndicator/index.js"));
-var _index15 = _interopRequireDefault(require("./components/StatusChip/index.js"));
-var _index16 = _interopRequireDefault(require("./components/Step/index.js"));
-var _index17 = _interopRequireDefault(require("./components/StepLabel/index.js"));
-var _index18 = _interopRequireDefault(require("./components/Stepper/index.js"));
-var _index19 = require("./components/Table/index.js");
-var _index20 = _interopRequireWildcard(require("./components/Table/AutoTable/index.js"));
-var _controlled = _interopRequireDefault(require("./components/Table/AutoTable/controlled.js"));
-var _virtual = _interopRequireDefault(require("./components/Table/AutoTable/virtual.js"));
-var _index21 = _interopRequireDefault(require("./components/Tabs/index.js"));
-var _index22 = _interopRequireDefault(require("./components/ThemeProvider/index.js"));
-var _index23 = _interopRequireDefault(require("./components/icons/HomeOutlinedIcon/index.js"));
-var _index24 = _interopRequireDefault(require("./components/icons/IconGroups/index.js"));
-var _index25 = _interopRequireDefault(require("./components/icons/IconListItem/index.js"));
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+var identifier = require('./styles/identifier.js');
+var createTheme = require('./styles/createTheme.js');
+var cssVars = require('./styles/css-vars.js');
+var cx = require('./styles/cx.js');
+var defaultTheme = require('./styles/defaultTheme.js');
+var useTheme = require('./styles/useTheme.js');
+var palette = require('./styles/palette.js');
+var styled = require('./styles/styled.js');
+var provider_client = require('./styles/provider.client.js');
+var provider_cssVars = require('./styles/provider.css-vars.js');
+var typography = require('./styles/typography.js');
+var utils = require('@mui/utils');
+var index = require('./Alert/index.js');
+var index$1 = require('./Box/index.js');
+var index$2 = require('./Button/index.js');
+var index$3 = require('./Checkbox/index.js');
+var index$4 = require('./CircularProgress/index.js');
+var components = require('./Dialog/components.js');
+var factory = require('./Dialog/factory.js');
+var components$1 = require('./Drawer/components.js');
+var factory$1 = require('./Drawer/factory.js');
+var index$5 = require('./GlobalStyles/index.js');
+var wrappers = require('./Icon/wrappers.js');
+var factory$2 = require('./Icon/factory.js');
+var index$6 = require('./IconButton/index.js');
+var index$7 = require('./Input/index.js');
+var controlled = require('./Menu/controlled.js');
+var factory$3 = require('./Menu/factory.js');
+var index$8 = require('./Pagination/index.js');
+var index$9 = require('./RadioButton/index.js');
+var controlled$1 = require('./Select/controlled.js');
+var uncontrolled = require('./Select/uncontrolled.js');
+var factory$4 = require('./Select/factory.js');
+var index$a = require('./TablePagination/index.js');
+var index$b = require('./Textarea/index.js');
+var index$c = require('./Toast/index.js');
+var hook = require('./Toast/hook.js');
+var index$d = require('./Tooltip/index.js');
+var index$e = require('./Typography/index.js');
+
+
+
+exports.THEME_ID = identifier.default;
+exports.createTheme = createTheme.default;
+exports.createThemeCssVariableDefinitions = cssVars.createThemeCssVariableDefinitions;
+exports.themeCSSVariableNames = cssVars.themeCSSVariableNames;
+exports.cx = cx.cx;
+exports.ThemeVars = defaultTheme.defaultThemeCssVariableUsages;
+exports.defaultDarkTheme = defaultTheme.defaultDarkTheme;
+exports.defaultTheme = defaultTheme.default;
+exports.useTheme = useTheme.default;
+exports.createPalette = palette.createPalette;
+exports.experimentalStyled = styled.default;
+exports.styled = styled.default;
+exports.ThemeContextProvider = provider_client.ThemeContextProvider;
+exports.ThemeCssVarsProvider = provider_cssVars.ThemeCssVarsProvider;
+exports.TypographyVariantKeys = typography.TypographyVariantKeys;
+exports.createTypography = typography.createTypography;
+Object.defineProperty(exports, "capitalize", {
+	enumerable: true,
+	get: function () { return utils.unstable_capitalize; }
+});
+exports.Alert = index.default;
+exports.Box = index$1.default;
+exports.Button = index$2.default;
+exports.Checkbox = index$3.default;
+exports.CircularProgress = index$4.default;
+exports.Dialog = components.default;
+exports.DialogActions = components.DialogActions;
+exports.DialogCloseButton = components.DialogCloseButton;
+exports.DialogCloseIconButton = components.DialogCloseIconButton;
+exports.DialogContent = components.DialogContent;
+exports.DialogDescription = components.DialogDescription;
+exports.DialogEnd = components.DialogEnd;
+exports.DialogStart = components.DialogStart;
+exports.DialogTitle = components.DialogTitle;
+exports.DialogTypography = components.DialogTypography;
+exports.createDialogComponent = factory.createDialogComponent;
+exports.Drawer = components$1.default;
+exports.DrawerActions = components$1.DrawerActions;
+exports.DrawerCloseButton = components$1.DrawerCloseButton;
+exports.DrawerCloseIconButton = components$1.DrawerCloseIconButton;
+exports.DrawerContent = components$1.DrawerContent;
+exports.DrawerDescription = components$1.DrawerDescription;
+exports.DrawerEnd = components$1.DrawerEnd;
+exports.DrawerStart = components$1.DrawerStart;
+exports.DrawerTitle = components$1.DrawerTitle;
+exports.DrawerTypography = components$1.DrawerTypography;
+exports.createDrawerComponent = factory$1.createDrawerComponent;
+exports.GlobalStyles = index$5.default;
+exports.adaptMuiSvgIcon = wrappers.adaptMuiSvgIcon;
+exports.adaptSvgIcon = wrappers.adaptSvgIcon;
+exports.DefaultIconFallback = factory$2.DefaultIconFallback;
+exports.createIconComponent = factory$2.createIconComponent;
+exports.IconButton = index$6.default;
+exports.Input = index$7.default;
+exports.Menu = controlled.default;
+exports.MenuItem = controlled.MenuItem;
+exports.createMenuComponent = factory$3.createMenuComponent;
+exports.Pagination = index$8.default;
+exports.RadioButton = index$9.default;
+exports.ControlledSelect = controlled$1.default;
+exports.Select = uncontrolled.default;
+exports.createControlledSelectComponent = factory$4.createControlledSelectComponent;
+exports.createSelectComponent = factory$4.createSelectComponent;
+exports.TablePagination = index$a.default;
+exports.Textarea = index$b.default;
+exports.Toast = index$c.default;
+exports.ToastProvider = hook.ToastProvider;
+exports.useToast = hook.useToast;
+exports.Tooltip = index$d.default;
+exports.Typography = index$e.default;

package/dist/cjs/popover/utils.js

@@ -0,0 +1,8 @@
+'use strict';
+'use strict';
+
+function resolvePopoverAnchor(anchor) {
+  return typeof anchor === "function" ? anchor() : anchor;
+}
+
+exports.resolvePopoverAnchor = resolvePopoverAnchor;

package/dist/cjs/styles/createTheme.js

@@ -0,0 +1,17 @@
+'use strict';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var palette = require('./palette.js');
+var typography = require('./typography.js');
+
+const defaultThemeOptions = {};
+function createTheme(options = defaultThemeOptions) {
+  return {
+    palette: palette.createPalette(options.palette),
+    typography: typography.createTypography(options.typography)
+  };
+}
+
+exports.default = createTheme;

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

@@ -0,0 +1,78 @@
+'use strict';
+'use strict';
+
+var createTheme = require('./createTheme.js');
+var typography = require('./typography.js');
+
+const themeCSSVariableNames = objectAsCSSVariableNames(createTheme.default(), "--vt-ce-theme");
+function createThemeCssVariableUsages(theme, cssVariableNames = themeCSSVariableNames) {
+  const usages = objectAsCSSVariableUsages(theme, cssVariableNames);
+  return {
+    ...usages,
+    typography: {
+      ...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
+      };
+    }
+  }, {});
+}
+
+exports.createThemeCssVariableDefinitions = createThemeCssVariableDefinitions;
+exports.createThemeCssVariableUsages = createThemeCssVariableUsages;
+exports.objectAsCSSVariableDefinitions = objectAsCSSVariableDefinitions;
+exports.objectAsCSSVariableNames = objectAsCSSVariableNames;
+exports.objectAsCSSVariableUsages = objectAsCSSVariableUsages;
+exports.themeCSSVariableNames = themeCSSVariableNames;

package/dist/cjs/styles/cx.js

@@ -0,0 +1,8 @@
+'use strict';
+'use strict';
+
+function cx(...args) {
+  return args.flat().filter((x) => typeof x === "string").join(" ").trim();
+}
+
+exports.cx = cx;

package/dist/cjs/styles/defaultTheme.js

@@ -0,0 +1,50 @@
+'use strict';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var createTheme = require('./createTheme.js');
+var cssVars = require('./css-vars.js');
+
+const defaultTheme = createTheme.default();
+const defaultThemeCssVariableUsages = cssVars.createThemeCssVariableUsages(
+  defaultTheme,
+  cssVars.themeCSSVariableNames
+);
+const defaultDarkTheme = createTheme.default({
+  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"
+    }
+  }
+});
+
+exports.default = defaultTheme;
+exports.defaultDarkTheme = defaultDarkTheme;
+exports.defaultThemeCssVariableUsages = defaultThemeCssVariableUsages;

package/dist/cjs/styles/identifier.js

@@ -0,0 +1,8 @@
+'use strict';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var THEME_ID = "$$vt-ce";
+
+exports.default = THEME_ID;