@veritone-ce/design-system 2.8.14-next.2.0 → 2.8.14

package/dist/cjs/extras/markdown/index.js

@@ -0,0 +1,244 @@
+'use strict';
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var ReactMarkdown = require('react-markdown');
+var styles_module = require('./styles.module.scss.js');
+var React = require('react');
+var index = require('../../Typography/index.js');
+var cx = require('../../styles/cx.js');
+require('../../styles/defaultThemeOptions.js');
+require('@capsizecss/core');
+require('color2k');
+require('../../styles/defaultTheme.js');
+require('../../styles/provider.client.js');
+require('../../styles/css-vars.js');
+
+const MarkdownContext = React.createContext({
+  headerIncrement: 0,
+  paragraphIncrement: 0,
+  styles: {},
+  classNames: {}
+});
+const h = (base, hAddend) => `h${Math.max(1, Math.min(base + hAddend, 4))}`;
+const p = (base, pAddend) => `paragraph${Math.max(1, Math.min(base + pAddend, 3))}`;
+const DefaultComponents = {
+  h1: function H1({ color, ref, style, className, ...props }) {
+    const {
+      headerIncrement,
+      styles: { h1: h1Style },
+      classNames: { h1: h1ClassName }
+    } = React.useContext(MarkdownContext);
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      index.default,
+      {
+        ref,
+        variant: h(1, headerIncrement),
+        style: {
+          ...h1Style,
+          ...style
+        },
+        className: cx.cx(styles_module.default.inheritColor, h1ClassName, className),
+        ...props
+      }
+    );
+  },
+  h2: function H2({ color, ref, style, className, ...props }) {
+    const {
+      headerIncrement,
+      styles: { h2: h2Style },
+      classNames: { h2: h2ClassName }
+    } = React.useContext(MarkdownContext);
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      index.default,
+      {
+        ref,
+        variant: h(2, headerIncrement),
+        style: {
+          ...h2Style,
+          ...style
+        },
+        className: cx.cx(styles_module.default.inheritColor, h2ClassName, className),
+        ...props
+      }
+    );
+  },
+  h3: function H3({ color, ref, style, className, ...props }) {
+    const {
+      headerIncrement,
+      styles: { h3: h3Style },
+      classNames: { h3: h3ClassName }
+    } = React.useContext(MarkdownContext);
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      index.default,
+      {
+        ref,
+        variant: h(3, headerIncrement),
+        style: {
+          ...h3Style,
+          ...style
+        },
+        className: cx.cx(styles_module.default.inheritColor, h3ClassName, className),
+        ...props
+      }
+    );
+  },
+  h4: function H4({ color, ref, style, className, ...props }) {
+    const {
+      headerIncrement,
+      styles: { h4: h4Style },
+      classNames: { h4: h4ClassName }
+    } = React.useContext(MarkdownContext);
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      index.default,
+      {
+        ref,
+        variant: h(4, headerIncrement),
+        style: {
+          ...h4Style,
+          ...style
+        },
+        className: cx.cx(styles_module.default.inheritColor, h4ClassName, className),
+        ...props
+      }
+    );
+  },
+  h5: function H5({ color, ref, style, className, ...props }) {
+    const {
+      headerIncrement,
+      styles: { h5: h5Style },
+      classNames: { h5: h5ClassName }
+    } = React.useContext(MarkdownContext);
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      index.default,
+      {
+        ref,
+        variant: h(5, headerIncrement),
+        style: {
+          ...h5Style,
+          ...style
+        },
+        className: cx.cx(styles_module.default.inheritColor, h5ClassName, className),
+        ...props
+      }
+    );
+  },
+  h6: function H6({ color, ref, style, className, ...props }) {
+    const {
+      headerIncrement,
+      styles: { h6: h6Style },
+      classNames: { h6: h6ClassName }
+    } = React.useContext(MarkdownContext);
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      index.default,
+      {
+        ref,
+        variant: h(6, headerIncrement),
+        style: {
+          ...h6Style,
+          ...style
+        },
+        className: cx.cx(styles_module.default.inheritColor, h6ClassName, className),
+        ...props
+      }
+    );
+  },
+  p: function P({ color, ref, style, className, ...props }) {
+    const {
+      paragraphIncrement,
+      styles: { p: pStyle },
+      classNames: { p: pClassName }
+    } = React.useContext(MarkdownContext);
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      index.default,
+      {
+        ref,
+        variant: p(1, paragraphIncrement),
+        style: {
+          ...pStyle,
+          ...style
+        },
+        className: cx.cx(styles_module.default.inheritColor, pClassName, className),
+        ...props
+      }
+    );
+  },
+  // table: (props) => <Table {...props} />,
+  // thead: (props) => <TableHead {...props} />,
+  // tbody: (props) => <TableBody {...props} />,
+  // tr: ({ ref, ...props }) => <TableRow ref={ref as any} {...props} />,
+  // th: ({ ref, ...props }) => (
+  //   <TableCell ref={ref as any} variant={'header'} {...props} />
+  // ),
+  // td: ({ ref, ...props }) => (
+  //   <TableCell ref={ref as any} variant={'data'} {...props} />
+  // ),
+  li: function Li(props) {
+    const {
+      paragraphIncrement,
+      styles: { li: liStyle },
+      classNames: { li: liClassName }
+    } = React.useContext(MarkdownContext);
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "li",
+      {
+        ...props,
+        style: {
+          ...liStyle,
+          ...props.style
+        },
+        className: cx.cx(
+          styles_module.default[`li_${p(1, paragraphIncrement)}`],
+          liClassName,
+          props.className
+        )
+      }
+    );
+  },
+  img: function Img(props) {
+    const {
+      styles: { li: liStyle },
+      classNames: { li: liClassName }
+    } = React.useContext(MarkdownContext);
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "img",
+      {
+        ...props,
+        style: { ...liStyle, ...props.style },
+        className: cx.cx(styles_module.default.img, liClassName, props.className)
+      }
+    );
+  }
+};
+function Markdown({
+  components,
+  headerIncrement,
+  paragraphIncrement,
+  style,
+  className,
+  styles: componentStyles,
+  classNames: componentClassNames,
+  ...props
+}) {
+  const allComponents = React.useMemo(
+    () => ({
+      ...DefaultComponents,
+      ...components
+    }),
+    [components]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    MarkdownContext.Provider,
+    {
+      value: {
+        headerIncrement: headerIncrement ?? 0,
+        paragraphIncrement: paragraphIncrement ?? 0,
+        styles: componentStyles ?? {},
+        classNames: componentClassNames ?? {}
+      },
+      children: /* @__PURE__ */ jsxRuntime.jsx("div", { style, className: cx.cx(styles_module.default.markdown, className), children: /* @__PURE__ */ jsxRuntime.jsx(ReactMarkdown, { components: allComponents, ...props }) })
+    }
+  );
+}
+
+exports.Markdown = Markdown;

package/dist/cjs/extras/markdown/styles.module.scss.js

@@ -0,0 +1,7 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var styles = {"markdown":"vt_ce_markdown_markdown__643d008c","inheritColor":"vt_ce_markdown_inheritColor__bde529c4","img":"vt_ce_markdown_img__ec9cc012","li_paragraph1":"vt_ce_markdown_li_paragraph1__92fed597","li_paragraph2":"vt_ce_markdown_li_paragraph2__c769f415","li_paragraph3":"vt_ce_markdown_li_paragraph3__f31baa03"};
+
+exports.default = styles;

package/dist/cjs/extras/uploady/index.js

@@ -0,0 +1,12 @@
+'use strict';
+'use strict';
+
+var uploady = require('./uploady.js');
+
+
+
+exports.UploadyButton = uploady.UploadyButton;
+exports.UploadyDropzone = uploady.UploadyDropzone;
+exports.UploadyList = uploady.UploadyList;
+exports.UploadyListItem = uploady.UploadyListItem;
+exports.useUploadStatus = uploady.useUploadStatus;

package/dist/cjs/extras/uploady/uploady.js

@@ -0,0 +1,112 @@
+'use strict';
+'use client';
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var uploady = require('@rpldy/uploady');
+var index = require('../../Button/index.js');
+var controlled = require('../../FileUploader/controlled.js');
+
+function UploadyDropzone(props) {
+  const { upload, getOptions } = uploady.useUploady();
+  const [batchState, setBatchState] = React.useState(
+    uploady.BATCH_STATES.PENDING
+  );
+  uploady.useBatchFinalizeListener((batch) => {
+    setBatchState(batch.state);
+  });
+  uploady.useBatchProgressListener((batch) => {
+    setBatchState(batch.state);
+  });
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    controlled.UploadDropzone,
+    {
+      ...props,
+      multiple: !getOptions().autoUpload,
+      state: batchState === uploady.BATCH_STATES.PROCESSING ? controlled.FILE_STATES.UPLOADING : batchState,
+      onDrop: (files) => {
+        upload(files);
+        setBatchState(uploady.BATCH_STATES.PENDING);
+      }
+    }
+  );
+}
+function UploadyList(props) {
+  const [items, setItems] = React.useState([]);
+  uploady.useBatchAddListener((batch) => {
+    setItems((items2) => items2.concat(batch.items));
+  });
+  return /* @__PURE__ */ jsxRuntime.jsx(controlled.UploadListContainer, { ...props, children: items.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(UploadyListItem, { item }, index)) });
+}
+function UploadyListItem({ item }) {
+  const [itemState, setState] = React.useState(item.state);
+  const [progress, setProgress] = React.useState(0);
+  const abortItem = uploady.useAbortItem();
+  uploady.useItemFinalizeListener((item2) => {
+    setState(item2.state);
+  }, item.id);
+  uploady.useItemProgressListener((item2) => {
+    setProgress(item2.completed);
+  });
+  const onAbortItem = () => {
+    abortItem(item.id);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    controlled.UploadListItem,
+    {
+      item: {
+        file: item.file,
+        progress,
+        state: itemState
+      },
+      onAbort: onAbortItem
+    }
+  );
+}
+function useUploadStatus() {
+  const [batchState, setBatchState] = React.useState(
+    uploady.BATCH_STATES.PENDING
+  );
+  const [itemCount, setItemCount] = React.useState(0);
+  uploady.useBatchAddListener((batch) => {
+    setItemCount(batch.total);
+  });
+  const [loading, setLoading] = React.useState(false);
+  uploady.useBatchStartListener(() => {
+    setLoading(true);
+  });
+  uploady.useBatchFinalizeListener((batch) => {
+    setLoading(false);
+    setBatchState(batch.state);
+  });
+  return { loading, itemCount, batchState };
+}
+const UploadyButton = React.forwardRef(function UploadButton({ children, onClick, disabled, ...props }, ref) {
+  const { processPending } = uploady.useUploadyContext();
+  const { itemCount, batchState, loading } = useUploadStatus();
+  const onButtonClick = React.useCallback(
+    (e) => {
+      processPending();
+      onClick?.(e);
+    },
+    [processPending, onClick]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    index.default,
+    {
+      ref,
+      onClick: onButtonClick,
+      disabled: disabled || itemCount === 0 || batchState === uploady.BATCH_STATES.FINISHED,
+      loading,
+      ...props,
+      children: children || "Upload"
+    }
+  );
+});
+
+exports.UploadyButton = UploadyButton;
+exports.UploadyDropzone = UploadyDropzone;
+exports.UploadyList = UploadyList;
+exports.UploadyListItem = UploadyListItem;
+exports.useUploadStatus = useUploadStatus;

package/dist/cjs/index.js

@@ -0,0 +1,165 @@
+'use strict';
+'use strict';
+
+var cx = require('./styles/cx.js');
+var defaultThemeOptions = require('./styles/defaultThemeOptions.js');
+var createTheme = require('./styles/createTheme.js');
+var defaultTheme = require('./styles/defaultTheme.js');
+var useTheme = require('./styles/useTheme.js');
+var typography = require('./styles/typography.js');
+var portal = require('./styles/portal.js');
+var createPalette = require('./styles/createPalette.js');
+var createTypography = require('./styles/createTypography.js');
+var provider_client = require('./styles/provider.client.js');
+var provider_cssVars = require('./styles/provider.css-vars.js');
+var cssVars = require('./styles/css-vars.js');
+var utils = require('@mui/utils');
+var index = require('./Alert/index.js');
+var index$1 = require('./Badge/index.js');
+var index$2 = require('./Button/index.js');
+var index$3 = require('./Checkbox/index.js');
+var index$4 = require('./Chip/index.js');
+var index$5 = require('./CircularProgress/index.js');
+var index$6 = require('./DatePicker/index.js');
+var index$7 = require('./DateRangePicker/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$8 = require('./ErrorBoundary/index.js');
+var controlled$1 = require('./FileUploader/controlled.js');
+var index$9 = require('./FormControl/index.js');
+var wrappers = require('./Icon/wrappers.js');
+var factory$2 = require('./Icon/factory.js');
+var index$a = require('./IconButton/index.js');
+var index$b = require('./Input/index.js');
+var controlled = require('./Menu/controlled.js');
+var factory$3 = require('./Menu/factory.js');
+var index$c = require('./Pagination/index.js');
+var index$d = require('./RadioButton/index.js');
+var controlled$2 = require('./Select/controlled.js');
+var uncontrolled = require('./Select/uncontrolled.js');
+var factory$4 = require('./Select/factory.js');
+var index$e = require('./StatusChip/index.js');
+var index$o = require('./Table/index.js');
+var index$f = require('./Table/AutoTable/index.js');
+var index$g = require('./Table/TableCell/index.js');
+var index$h = require('./Table/TableRow/index.js');
+var index$i = require('./TablePagination/index.js');
+var index$j = require('./Textarea/index.js');
+var index$k = require('./Toast/index.js');
+var hook = require('./Toast/hook.js');
+var index$l = require('./Tooltip/index.js');
+var index$m = require('./Typography/index.js');
+var index$n = require('./ColorPicker/index.js');
+var stepper = require('./Stepper/stepper.js');
+var auto = require('./Stepper/auto.js');
+var Accordion = require('./Accordion/Accordion.js');
+var AccordionGroup = require('./Accordion/AccordionGroup.js');
+var Context = require('./Accordion/Context.js');
+var common = require('./Table/AutoTable/common.js');
+
+
+
+exports.cx = cx.cx;
+exports.defaultThemeOptions = defaultThemeOptions.defaultThemeOptions;
+exports.createTheme = createTheme.default;
+exports.ThemeVars = defaultTheme.defaultThemeCssVariableUsages;
+exports.defaultDarkTheme = defaultTheme.defaultDarkTheme;
+exports.defaultTheme = defaultTheme.default;
+exports.useTheme = useTheme.default;
+exports.TypographyVariantKeys = typography.TypographyVariantKeys;
+exports.PortalThemeRelay = portal.PortalThemeRelay;
+exports.createPalette = createPalette.createPalette;
+exports.createTypography = createTypography.createTypography;
+exports.ThemeContext = provider_client.ThemeContext;
+exports.ThemeContextProvider = provider_client.ThemeContextProvider;
+exports.useThemeContext = provider_client.useThemeContext;
+exports.ThemeCssVarsProvider = provider_cssVars.ThemeCssVarsProvider;
+exports.createThemeCssVariableDefinitions = cssVars.createThemeCssVariableDefinitions;
+exports.themeCSSVariableNames = cssVars.themeCSSVariableNames;
+Object.defineProperty(exports, "capitalize", {
+	enumerable: true,
+	get: function () { return utils.unstable_capitalize; }
+});
+exports.Alert = index.default;
+exports.Badge = index$1.default;
+exports.Button = index$2.default;
+exports.Checkbox = index$3.default;
+exports.Chip = index$4.default;
+exports.CircularProgress = index$5.default;
+exports.DatePicker = index$6.default;
+exports.DateRangePicker = index$7.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.ErrorBoundary = index$8.default;
+exports.FILE_STATES = controlled$1.FILE_STATES;
+exports.UploadDropzone = controlled$1.UploadDropzone;
+exports.UploadList = controlled$1.UploadList;
+exports.UploadListContainer = controlled$1.UploadListContainer;
+exports.UploadListItem = controlled$1.UploadListItem;
+exports.FormControl = index$9.default;
+exports.adaptMuiSvgIcon = wrappers.adaptMuiSvgIcon;
+exports.adaptSvgIcon = wrappers.adaptSvgIcon;
+exports.DefaultIconFallback = factory$2.DefaultIconFallback;
+exports.createIconComponent = factory$2.createIconComponent;
+exports.IconButton = index$a.default;
+exports.Input = index$b.default;
+exports.Menu = controlled.default;
+exports.MenuItem = controlled.MenuItem;
+exports.NestedMenu = controlled.NestedMenu;
+exports.createMenuComponent = factory$3.createMenuComponent;
+exports.Pagination = index$c.default;
+exports.RadioButton = index$d.default;
+exports.ControlledSelect = controlled$2.default;
+exports.Select = uncontrolled.default;
+exports.createControlledSelectComponent = factory$4.createControlledSelectComponent;
+exports.createSelectComponent = factory$4.createSelectComponent;
+exports.StatusChip = index$e.default;
+exports.Table = index$o.Table;
+exports.TableBody = index$o.TableBody;
+exports.TableFooter = index$o.TableFooter;
+exports.TableHead = index$o.TableHead;
+exports.TableMessage = index$o.TableMessage;
+exports.TableSortLabel = index$o.TableSortLabel;
+exports.AutoTable = index$f.default;
+exports.TableCell = index$g.default;
+exports.TableRow = index$h.default;
+exports.TablePagination = index$i.default;
+exports.Textarea = index$j.default;
+exports.Toast = index$k.default;
+exports.ToastProvider = hook.ToastProvider;
+exports.useToast = hook.useToast;
+exports.Tooltip = index$l.default;
+exports.Typography = index$m.default;
+exports.ColorPicker = index$n.default;
+exports.validateHex = index$n.validateHex;
+exports.Stepper = stepper.default;
+exports.AutoStepper = auto.default;
+exports.Accordion = Accordion.default;
+exports.AccordionGroup = AccordionGroup.default;
+exports.AccordionGroupContext = Context.AccordionGroupContext;
+exports.useAccordionGroup = Context.useAccordionGroup;
+exports.useAccordionState = Context.useAccordionState;
+exports.useIsInsideAccordionGroup = Context.useIsInsideAccordionGroup;
+exports.createColumnHelper = common.createColumnHelper;

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/components.module.scss.js

@@ -0,0 +1,7 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var styles = {"css-var-provider":"vt_ce_styles_css-var-provider__dc02b308"};
+
+exports.default = styles;