@uniformdev/design-system 19.21.0 → 19.22.1-alpha.8

package/dist/esm/index.js

@@ -65,6 +65,12 @@ var Theme = ({ disableReset = false }) => {
           --primary-action-hover: #1264ff;
           --primary-action-active: #0043c2;
 
+          /* tertiary action */
+          --tertiary-action-default: var(--gray-700);
+          --tertiary-action-hover: var(--gray-600);
+          --tertiary-action-active: var(--gray-50);
+          --tertiary-action-disabled: var(--gray-400);
+          
           /* accent dark */
           --accent-dark: var(--purple-rain-500);
           --accent-dark-hover: var(--purple-rain-400);
@@ -431,15 +437,41 @@ var buttonGhostDestructive = css`
   ${buttonRippleEffect({ hoverColor: "var(--white)", activeColor: "var(--gray-100)" })}
 `;
 var buttonTertiary = css`
-  background: var(--primary-action-default);
+  background: var(--tertiary-action-default);
   color: var(--white);
 
+  &:hover {
+    background: var(--tertiary-action-hover);
+  }
+
+  &:disabled {
+    background: var(--tertiary-action-disabled);
+  }
+
+  &:hover,
   &:disabled {
-    background: var(--gray-300);
     color: var(--white);
   }
 
-  ${buttonRippleEffect({ hoverColor: " var(--primary-action-default)" })}
+  ${buttonRippleEffect({ hoverColor: " var(--tertiary-action-default)" })}
+`;
+var buttonTertiaryOutline = css`
+  background: transparent;
+  box-shadow: 0 0 0 1px var(--tertiary-action-default);
+  color: var(--tertiary-action-default);
+
+  &:hover {
+    box-shadow: 0 0 0 1px var(--tertiary-action-hover);
+    color: var(--tertiary-action-hover);
+  }
+
+  &:disabled {
+    background: transparent;
+    box-shadow: 0 0 0 1px var(--tertiary-action-disabled);
+    color: var(--tertiary-action-disabled);
+  }
+
+  ${buttonRippleEffect({ hoverColor: "transparent", activeColor: "var(--tertiary-action-active)" })}
 `;
 var buttonGhostUnimportant = css`
   background: transparent;
@@ -11085,8 +11117,8 @@ var Button = React5.forwardRef(
       ghostDestructive: buttonGhostDestructive,
       unimportant: buttonUnimportant,
       ghostUnimportant: buttonGhostUnimportant,
-      /** @deprecated */
-      tertiary: buttonTertiary
+      tertiary: buttonTertiary,
+      tertiaryOutline: buttonTertiaryOutline
     };
     const btnSize = {
       zero: "padding: 0",
@@ -12105,6 +12137,7 @@ var ChipContainer = css35`
 var ChipText = css35`
   align-self: center;
   line-height: 1;
+  text-wrap: nowrap;
 `;
 var ChipIcon = css35`
   align-self: center;
@@ -15482,14 +15515,13 @@ var ParameterImageInner = forwardRef10(
     const errorText = "The text you provided is not a valid URL";
     const updateImageSrc = useCallback3(() => {
       const validUrl = new RegExp(
-        "^(https?:\\/\\/)?((([a-z\\d]([a-z\\d-]*[a-z\\d])*)\\.)+[a-z]{2,}|((\\d{1,3}\\.){3}\\d{1,3}))(\\:\\d+)?(\\/[-a-z\\d%_.~+]*)*(\\?[;&a-z\\d%_.~+=-]*)?(\\#[-a-z\\d_]*)?$",
-        "i"
+        /^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b(?:[-a-zA-Z0-9()@:%_.+~#?&/=]*)$/
       );
       let message = void 0;
       try {
         if (value !== "") {
           const url = String(value).startsWith("//") ? `${location.protocol}${value}` : String(value);
-          if (!url.match(validUrl) || !url.startsWith("https")) {
+          if (!validUrl.test(url) || !url.startsWith("https")) {
             throw Error(errorText);
           }
         }
@@ -15744,11 +15776,8 @@ import { ListPlugin } from "@lexical/react/LexicalListPlugin";
 import { MarkdownShortcutPlugin } from "@lexical/react/LexicalMarkdownShortcutPlugin";
 import { RichTextPlugin } from "@lexical/react/LexicalRichTextPlugin";
 import { HeadingNode, QuoteNode } from "@lexical/rich-text";
-import { deepEqual as deepEqual2 } from "fast-equals";
-import { ParagraphNode } from "lexical";
-import { useEffect as useEffect13, useRef as useRef6 } from "react";
 
-// src/components/ParameterInputs/rich-text/builtInElements.ts
+// ../richtext/dist/index.mjs
 var richTextBuiltInElements = [
   {
     label: "Heading 1",
@@ -15779,7 +15808,7 @@ var richTextBuiltInElements = [
     type: "unorderedList"
   },
   {
-    label: "Numbered List",
+    label: "Ordered List",
     type: "orderedList"
   },
   {
@@ -15795,8 +15824,6 @@ var richTextBuiltInElements = [
     type: "code"
   }
 ];
-
-// src/components/ParameterInputs/rich-text/builtInFormats.ts
 var richTextBuiltInFormats = [
   {
     label: "Bold",
@@ -15827,6 +15854,19 @@ var richTextBuiltInFormats = [
     type: "subscript"
   }
 ];
+var getLabelForElement = (type) => {
+  var _a;
+  if (type === "paragraph") {
+    return "Normal";
+  }
+  const element = richTextBuiltInElements.find((element2) => element2.type === type);
+  return (_a = element == null ? void 0 : element.label) != null ? _a : type;
+};
+
+// src/components/ParameterInputs/ParameterRichText.tsx
+import { deepEqual as deepEqual2 } from "fast-equals";
+import { ParagraphNode } from "lexical";
+import { useEffect as useEffect13, useRef as useRef6 } from "react";
 
 // src/components/ParameterInputs/rich-text/editorStyles.ts
 import { css as css71 } from "@emotion/css";
@@ -16726,14 +16766,6 @@ var RichTextToolbar = ({ config }) => {
   const enabledTextualElements = enabledBuiltInElements.filter(
     (element) => ["h1", "h2", "h3", "h4", "h5", "h6"].includes(element.type)
   );
-  const elementTypeToLabel = (type) => {
-    var _a;
-    if (type === "paragraph") {
-      return "Normal";
-    }
-    const element = richTextBuiltInElements.find((element2) => element2.type === type);
-    return (_a = element == null ? void 0 : element.label) != null ? _a : type;
-  };
   const onSelectElement = (type) => {
     if (activeElement === type) {
       return;
@@ -16872,7 +16904,7 @@ var RichTextToolbar = ({ config }) => {
     return [
       ...enabledTextualElements,
       {
-        label: elementTypeToLabel(activeElement),
+        label: getLabelForElement(activeElement),
         type: activeElement
       }
     ];
@@ -16883,7 +16915,7 @@ var RichTextToolbar = ({ config }) => {
       {
         menuLabel: "Elements",
         menuTrigger: /* @__PURE__ */ jsxs60("button", { css: toolbarButton, title: "Text formatting", children: [
-          elementsThatShouldBeVisibleInDropdown.some((element) => element.type === activeElement) ? elementTypeToLabel(activeElement) : elementTypeToLabel("paragraph"),
+          elementsThatShouldBeVisibleInDropdown.some((element) => element.type === activeElement) ? getLabelForElement(activeElement) : getLabelForElement("paragraph"),
           " ",
           /* @__PURE__ */ jsx92(Icon, { icon: "chevron-down", css: [toolbarIcon, toolbarChevron], size: "1rem" })
         ] }),
@@ -18144,6 +18176,7 @@ export {
   buttonSecondary,
   buttonSecondaryInvert,
   buttonTertiary,
+  buttonTertiaryOutline,
   buttonUnimportant,
   canvasAlertIcon,
   cardIcon,

package/dist/index.d.ts

@@ -15,12 +15,13 @@ import InternalSelect from 'react-select/dist/declarations/src/Select';
 import { StateManagerProps } from 'react-select/dist/declarations/src/useStateManager';
 import { JsonSchema7Type } from 'zod-to-json-schema/src/parseDef';
 import { MenuHTMLProps, MenuProps as MenuProps$2, MenuStateReturn } from 'reakit/Menu';
-import { RichTextBuiltInElement, RichTextBuiltInFormat, LinkParamValue, RichTextParamConfiguration } from '@uniformdev/canvas';
+import { LinkParamValue, RichTextParamConfiguration } from '@uniformdev/canvas';
 export { RichTextBuiltInElement, RichTextBuiltInFormat } from '@uniformdev/canvas';
 import { Spread, SerializedElementNode, ElementNode, NodeKey, EditorConfig, DOMConversionMap, RangeSelection, SerializedEditorState, LexicalEditor } from 'lexical';
 import { PopoverProps as PopoverProps$1, PopoverInitialState } from 'reakit/Popover';
 import { TabState, TabListProps, TabProps, TabPanelProps } from 'reakit/Tab';
 import { TooltipOptions, TooltipInitialState } from 'reakit/Tooltip';
+export { richTextBuiltInElements, richTextBuiltInFormats } from '@uniformdev/richtext';
 
 /** @todo: line 144 onwards will be brought into a title, paragraph, list and link components */
 type ThemeProps = {
@@ -88,6 +89,7 @@ declare const buttonUnimportant: _emotion_react.SerializedStyles;
 declare const buttonGhost: _emotion_react.SerializedStyles;
 declare const buttonGhostDestructive: _emotion_react.SerializedStyles;
 declare const buttonTertiary: _emotion_react.SerializedStyles;
+declare const buttonTertiaryOutline: _emotion_react.SerializedStyles;
 declare const buttonGhostUnimportant: _emotion_react.SerializedStyles;
 
 declare const labelText: _emotion_react.SerializedStyles;
@@ -20245,7 +20247,7 @@ declare const UniformLogo: ({ theme, ...props }: UniformLogoProps & React.SVGAtt
 declare const UniformLogoLarge: ({ ...props }: React.SVGAttributes<SVGElement>) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
 
 /** Button themes that are available to use with our brand */
-type ButtonThemeProps$1 = 'primary' | 'secondary' | 'destructive' | 'tertiary' | 'unimportant' | 'ghost' | 'ghostDestructive' | 'primaryInvert' | 'secondaryInvert' | 'ghostUnimportant';
+type ButtonThemeProps$1 = 'primary' | 'secondary' | 'destructive' | 'tertiary' | 'tertiaryOutline' | 'unimportant' | 'ghost' | 'ghostDestructive' | 'primaryInvert' | 'secondaryInvert' | 'ghostUnimportant';
 /** Button sizes that are available to use with our brand */
 type ButtonSizeProps = 'zero' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 type ButtonProps = ButtonProps$1 & {
@@ -21026,7 +21028,7 @@ type JsonEditorProps = {
 declare const JsonEditor: ({ defaultValue, onChange, jsonSchema, height, readOnly }: JsonEditorProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
 
 type SpacingProp = '0' | '2xs' | 'xs' | 'sm' | 'base' | 'md' | 'lg' | 'xl' | '2xl';
-type BackgroundColorProp = 'white' | 'gray-50' | 'gray-100' | 'gray-200' | 'gray-300' | 'gray-400' | 'gray-500' | 'gray-600' | 'gray-700' | 'gray-800' | 'gray-900';
+type BackgroundColorProp = 'transparent' | 'white' | 'gray-50' | 'gray-100' | 'gray-200' | 'gray-300' | 'gray-400' | 'gray-500' | 'gray-600' | 'gray-700' | 'gray-800' | 'gray-900';
 type HtmlTagProps = 'div' | 'section' | 'article' | 'aside' | 'span';
 type BorderRadiusProps = 'rounded-sm' | 'rounded-base' | 'rounded-md';
 type CommonContainerProps = {
@@ -21518,16 +21520,6 @@ type ParameterNameAndPublicIdInputProps = {
 /** @example <ParameterNameAndPublicIdInput /> */
 declare const ParameterNameAndPublicIdInput: ({ id, onBlur, autoFocus, onNameChange, onPublicIdChange, nameIdError, publicIdError, readOnly, hasInitialPublicIdField, label, warnOverLength, nameIdField, nameCaption, namePlaceholderText, publicIdFieldName, publicIdCaption, publicIdPlaceholderText, values, }: ParameterNameAndPublicIdInputProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
 
-declare const richTextBuiltInElements: {
-    label: string;
-    type: RichTextBuiltInElement;
-}[];
-
-declare const richTextBuiltInFormats: {
-    label: string;
-    type: RichTextBuiltInFormat;
-}[];
-
 type LinkNodeProps = NonNullable<LinkParamValue>;
 type SerializedLinkNode = Spread<{
     link: LinkNodeProps;
@@ -22187,4 +22179,4 @@ type StatusBulletProps = React$1.HTMLAttributes<HTMLSpanElement> & {
 };
 declare const StatusBullet: ({ status, hideText, size, message, ...props }: StatusBulletProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
 
-export { ActionButtonsProps, AddButton, AddButtonProps, AddListButton, AddListButtonProps, AddListButtonThemeProps, AnimationFile, AnimationFileProps, ArrowPositionProps, Badge, BadgeProps, BadgeSizeProps, BadgeThemeProps, BadgeThemeStyleProps, Banner, BannerProps, BannerType, BoxHeightProps, BreakpointSize, BreakpointsMap, Button, ButtonProps, ButtonSizeProps, ButtonThemeProps$1 as ButtonThemeProps, ButtonWithMenu, ButtonWithMenuProps, Callout, CalloutProps, CalloutType, Caption, CaptionProps, Card, CardContainer, CardContainerBgColorProps, CardContainerProps, CardProps, CardTitle, CardTitleProps, CheckboxWithInfo, CheckboxWithInforProps, ChildFunction, Chip, ChipProps, ComboBoxGroupBase, ConnectToDataElementButton, ConnectToDataElementButtonProps, Container, ContainerProps, Counter, CounterProps, CreateTeamIntegrationTile, CreateTeamIntegrationTileProps, DashedBox, DashedBoxProps, Details, DetailsProps, DismissibleChipAction, Drawer, DrawerContextValue, DrawerItem, DrawerProps, DrawerProvider, DrawerRenderer, DrawerRendererItemProps, DrawerRendererProps, EditTeamIntegrationTile, EditTeamIntegrationTileProps, ErrorMessage, ErrorMessageProps, Fieldset, FieldsetProps, Heading, HeadingProps, HexModalBackground, HorizontalRhythm, Icon, IconColor, IconName, IconProps, IconType, IconsProvider, InfoMessage, InfoMessageProps, InlineAlert, InlineAlertProps, Input, InputComboBox, InputComboBoxOption, InputComboBoxProps, InputInlineSelect, InputInlineSelectOption, InputInlineSelectProps, InputKeywordSearch, InputKeywordSearchProps, InputProps, InputSelect, InputSelectProps, InputToggle, InputToggleProps, IntegrationComingSoon, IntegrationComingSoonProps, IntegrationHeaderSection, IntegrationHeaderSectionProps, IntegrationLoadingTile, IntegrationLoadingTileProps, IntegrationModalHeader, IntegrationModalHeaderProps, IntegrationModalIcon, IntegrationModalIconProps, IntegrationTile, IntegrationTileProps, JsonEditor, JsonEditorProps, Label, LabelProps, Legend, LegendProps, LevelProps, LimitsBar, LimitsBarProps, Link, LinkColorProps, LinkList, LinkListProps, LinkManagerWithRefType, LinkNode, LinkProps, LinkWithRef, LoadingCardSkeleton, LoadingIcon, LoadingIconProps, LoadingIndicator, LoadingOverlay, LoadingOverlayProps, Menu, MenuContext, MenuGroup, MenuGroupProps, MenuItem, MenuItemProps, MenuItemSeparator, MenuItemTextThemeProps, MenuProps, PageHeaderSection, PageHeaderSectionProps, Paragraph, ParagraphProps, ParameterDataConnectButtonProps, ParameterDataResource, ParameterDrawerHeader, ParameterDrawerHeaderProps, ParameterGroup, ParameterGroupProps, ParameterImage, ParameterImageInner, ParameterImageProps, ParameterInput, ParameterInputInner, ParameterInputProps, ParameterLabel, ParameterLabelProps, ParameterLink, ParameterLinkInner, ParameterLinkProps, ParameterMenuButton, ParameterMenuButtonProps, ParameterNameAndPublicIdInput, ParameterNameAndPublicIdInputProps, ParameterOverrideMarker, ParameterRichText, ParameterRichTextInner, ParameterRichTextInnerProps, ParameterRichTextProps, ParameterSelect, ParameterSelectInner, ParameterSelectProps, ParameterShell, ParameterShellContext, ParameterShellPlaceholder, ParameterShellProps, ParameterTextarea, ParameterTextareaInner, ParameterTextareaProps, ParameterToggle, ParameterToggleInner, ParameterToggleProps, Popover, PopoverProps, ProgressList, ProgressListItem, ProgressListItemProps, ProgressListProps, RegisterDrawerProps, ResolveIcon, ResolveIconProps, RichTextParamValue, ScrollableItemProps, ScrollableList, ScrollableListContainerProps, ScrollableListInputItem, ScrollableListItem, ScrollableListItemProps, ScrollableListProps, SegmentedControl, SegmentedControlOption, SegmentedControlProps, SerializedLinkNode, ShortcutContext, ShortcutRevealer, Skeleton, SkeletonProps, StatusBullet, StatusBulletProps, StatusTypeProps, SuccessMessage, SuccessMessageProps, Switch, SwitchProps, TabButton, TabButtonGroup, TabButtonProps, TabContent, TabContentProps, Table, TableBody, TableBodyProps, TableCellData, TableCellDataProps, TableCellHead, TableCellHeadProps, TableFoot, TableFootProps, TableHead, TableHeadProps, TableProps, TableRow, TableRowProps, Tabs, TabsProps, TextAlignProps, Textarea, TextareaProps, Theme, ThemeProps, Tile, TileContainer, TileContainerProps, TileProps, TileText, TileTitleProps, Tooltip, TooltipProps, TwoColumnLayout, TwoColumnLayoutProps, UniformBadge, UniformLogo, UniformLogoLarge, UniformLogoProps, UseShortcutOptions, VerticalRhythm, WarningMessage, WarningMessageProps, accessibleHidden, borderTopIcon, breakpoints, button, buttonDestructive, buttonGhost, buttonGhostDestructive, buttonGhostUnimportant, buttonPrimary, buttonPrimaryInvert, buttonRippleEffect, buttonSecondary, buttonSecondaryInvert, buttonTertiary, buttonUnimportant, canvasAlertIcon, cardIcon, cq, customIcons, extractParameterProps, fadeIn, fadeInBottom, fadeInLtr, fadeInRtl, fadeInTop, fadeOutBottom, fullWidthScreenIcon, growSubtle, imageTextIcon, infoFilledIcon, input, inputError, inputSelect, isMacLike, jsonIcon, labelText, loader as loaderAnimationData, macifyShortcut, mq, numberInput, queryStringIcon, rectangleRoundedIcon, replaceUnderscoreInString, richTextBuiltInElements, richTextBuiltInFormats, richTextIsValueConsideredEmpty, ripple, scrollbarStyles, settings, settingsIcon, skeletonLoading, slideInTtb, spinner as spinnerAnimationData, structurePanelIcon, supports, textInput, useBreakpoint, useCloseCurrentDrawer, useCurrentDrawerRenderer, useCurrentTab, useDrawer, useIconContext, useMenuContext, useOutsideClick, useParameterShell, useShortcut, warningIcon, yesNoIcon };
+export { ActionButtonsProps, AddButton, AddButtonProps, AddListButton, AddListButtonProps, AddListButtonThemeProps, AnimationFile, AnimationFileProps, ArrowPositionProps, Badge, BadgeProps, BadgeSizeProps, BadgeThemeProps, BadgeThemeStyleProps, Banner, BannerProps, BannerType, BoxHeightProps, BreakpointSize, BreakpointsMap, Button, ButtonProps, ButtonSizeProps, ButtonThemeProps$1 as ButtonThemeProps, ButtonWithMenu, ButtonWithMenuProps, Callout, CalloutProps, CalloutType, Caption, CaptionProps, Card, CardContainer, CardContainerBgColorProps, CardContainerProps, CardProps, CardTitle, CardTitleProps, CheckboxWithInfo, CheckboxWithInforProps, ChildFunction, Chip, ChipProps, ComboBoxGroupBase, ConnectToDataElementButton, ConnectToDataElementButtonProps, Container, ContainerProps, Counter, CounterProps, CreateTeamIntegrationTile, CreateTeamIntegrationTileProps, DashedBox, DashedBoxProps, Details, DetailsProps, DismissibleChipAction, Drawer, DrawerContextValue, DrawerItem, DrawerProps, DrawerProvider, DrawerRenderer, DrawerRendererItemProps, DrawerRendererProps, EditTeamIntegrationTile, EditTeamIntegrationTileProps, ErrorMessage, ErrorMessageProps, Fieldset, FieldsetProps, Heading, HeadingProps, HexModalBackground, HorizontalRhythm, Icon, IconColor, IconName, IconProps, IconType, IconsProvider, InfoMessage, InfoMessageProps, InlineAlert, InlineAlertProps, Input, InputComboBox, InputComboBoxOption, InputComboBoxProps, InputInlineSelect, InputInlineSelectOption, InputInlineSelectProps, InputKeywordSearch, InputKeywordSearchProps, InputProps, InputSelect, InputSelectProps, InputToggle, InputToggleProps, IntegrationComingSoon, IntegrationComingSoonProps, IntegrationHeaderSection, IntegrationHeaderSectionProps, IntegrationLoadingTile, IntegrationLoadingTileProps, IntegrationModalHeader, IntegrationModalHeaderProps, IntegrationModalIcon, IntegrationModalIconProps, IntegrationTile, IntegrationTileProps, JsonEditor, JsonEditorProps, Label, LabelProps, Legend, LegendProps, LevelProps, LimitsBar, LimitsBarProps, Link, LinkColorProps, LinkList, LinkListProps, LinkManagerWithRefType, LinkNode, LinkProps, LinkWithRef, LoadingCardSkeleton, LoadingIcon, LoadingIconProps, LoadingIndicator, LoadingOverlay, LoadingOverlayProps, Menu, MenuContext, MenuGroup, MenuGroupProps, MenuItem, MenuItemProps, MenuItemSeparator, MenuItemTextThemeProps, MenuProps, PageHeaderSection, PageHeaderSectionProps, Paragraph, ParagraphProps, ParameterDataConnectButtonProps, ParameterDataResource, ParameterDrawerHeader, ParameterDrawerHeaderProps, ParameterGroup, ParameterGroupProps, ParameterImage, ParameterImageInner, ParameterImageProps, ParameterInput, ParameterInputInner, ParameterInputProps, ParameterLabel, ParameterLabelProps, ParameterLink, ParameterLinkInner, ParameterLinkProps, ParameterMenuButton, ParameterMenuButtonProps, ParameterNameAndPublicIdInput, ParameterNameAndPublicIdInputProps, ParameterOverrideMarker, ParameterRichText, ParameterRichTextInner, ParameterRichTextInnerProps, ParameterRichTextProps, ParameterSelect, ParameterSelectInner, ParameterSelectProps, ParameterShell, ParameterShellContext, ParameterShellPlaceholder, ParameterShellProps, ParameterTextarea, ParameterTextareaInner, ParameterTextareaProps, ParameterToggle, ParameterToggleInner, ParameterToggleProps, Popover, PopoverProps, ProgressList, ProgressListItem, ProgressListItemProps, ProgressListProps, RegisterDrawerProps, ResolveIcon, ResolveIconProps, RichTextParamValue, ScrollableItemProps, ScrollableList, ScrollableListContainerProps, ScrollableListInputItem, ScrollableListItem, ScrollableListItemProps, ScrollableListProps, SegmentedControl, SegmentedControlOption, SegmentedControlProps, SerializedLinkNode, ShortcutContext, ShortcutRevealer, Skeleton, SkeletonProps, StatusBullet, StatusBulletProps, StatusTypeProps, SuccessMessage, SuccessMessageProps, Switch, SwitchProps, TabButton, TabButtonGroup, TabButtonProps, TabContent, TabContentProps, Table, TableBody, TableBodyProps, TableCellData, TableCellDataProps, TableCellHead, TableCellHeadProps, TableFoot, TableFootProps, TableHead, TableHeadProps, TableProps, TableRow, TableRowProps, Tabs, TabsProps, TextAlignProps, Textarea, TextareaProps, Theme, ThemeProps, Tile, TileContainer, TileContainerProps, TileProps, TileText, TileTitleProps, Tooltip, TooltipProps, TwoColumnLayout, TwoColumnLayoutProps, UniformBadge, UniformLogo, UniformLogoLarge, UniformLogoProps, UseShortcutOptions, VerticalRhythm, WarningMessage, WarningMessageProps, accessibleHidden, borderTopIcon, breakpoints, button, buttonDestructive, buttonGhost, buttonGhostDestructive, buttonGhostUnimportant, buttonPrimary, buttonPrimaryInvert, buttonRippleEffect, buttonSecondary, buttonSecondaryInvert, buttonTertiary, buttonTertiaryOutline, buttonUnimportant, canvasAlertIcon, cardIcon, cq, customIcons, extractParameterProps, fadeIn, fadeInBottom, fadeInLtr, fadeInRtl, fadeInTop, fadeOutBottom, fullWidthScreenIcon, growSubtle, imageTextIcon, infoFilledIcon, input, inputError, inputSelect, isMacLike, jsonIcon, labelText, loader as loaderAnimationData, macifyShortcut, mq, numberInput, queryStringIcon, rectangleRoundedIcon, replaceUnderscoreInString, richTextIsValueConsideredEmpty, ripple, scrollbarStyles, settings, settingsIcon, skeletonLoading, slideInTtb, spinner as spinnerAnimationData, structurePanelIcon, supports, textInput, useBreakpoint, useCloseCurrentDrawer, useCurrentDrawerRenderer, useCurrentTab, useDrawer, useIconContext, useMenuContext, useOutsideClick, useParameterShell, useShortcut, warningIcon, yesNoIcon };

package/dist/index.js

@@ -170,6 +170,7 @@ __export(src_exports, {
   buttonSecondary: () => buttonSecondary,
   buttonSecondaryInvert: () => buttonSecondaryInvert,
   buttonTertiary: () => buttonTertiary,
+  buttonTertiaryOutline: () => buttonTertiaryOutline,
   buttonUnimportant: () => buttonUnimportant,
   canvasAlertIcon: () => canvasAlertIcon,
   cardIcon: () => cardIcon,
@@ -294,6 +295,12 @@ var Theme = ({ disableReset = false }) => {
           --primary-action-hover: #1264ff;
           --primary-action-active: #0043c2;
 
+          /* tertiary action */
+          --tertiary-action-default: var(--gray-700);
+          --tertiary-action-hover: var(--gray-600);
+          --tertiary-action-active: var(--gray-50);
+          --tertiary-action-disabled: var(--gray-400);
+          
           /* accent dark */
           --accent-dark: var(--purple-rain-500);
           --accent-dark-hover: var(--purple-rain-400);
@@ -660,15 +667,41 @@ var buttonGhostDestructive = import_react3.css`
   ${buttonRippleEffect({ hoverColor: "var(--white)", activeColor: "var(--gray-100)" })}
 `;
 var buttonTertiary = import_react3.css`
-  background: var(--primary-action-default);
+  background: var(--tertiary-action-default);
   color: var(--white);
 
+  &:hover {
+    background: var(--tertiary-action-hover);
+  }
+
+  &:disabled {
+    background: var(--tertiary-action-disabled);
+  }
+
+  &:hover,
   &:disabled {
-    background: var(--gray-300);
     color: var(--white);
   }
 
-  ${buttonRippleEffect({ hoverColor: " var(--primary-action-default)" })}
+  ${buttonRippleEffect({ hoverColor: " var(--tertiary-action-default)" })}
+`;
+var buttonTertiaryOutline = import_react3.css`
+  background: transparent;
+  box-shadow: 0 0 0 1px var(--tertiary-action-default);
+  color: var(--tertiary-action-default);
+
+  &:hover {
+    box-shadow: 0 0 0 1px var(--tertiary-action-hover);
+    color: var(--tertiary-action-hover);
+  }
+
+  &:disabled {
+    background: transparent;
+    box-shadow: 0 0 0 1px var(--tertiary-action-disabled);
+    color: var(--tertiary-action-disabled);
+  }
+
+  ${buttonRippleEffect({ hoverColor: "transparent", activeColor: "var(--tertiary-action-active)" })}
 `;
 var buttonGhostUnimportant = import_react3.css`
   background: transparent;
@@ -11314,8 +11347,8 @@ var Button = React5.forwardRef(
       ghostDestructive: buttonGhostDestructive,
       unimportant: buttonUnimportant,
       ghostUnimportant: buttonGhostUnimportant,
-      /** @deprecated */
-      tertiary: buttonTertiary
+      tertiary: buttonTertiary,
+      tertiaryOutline: buttonTertiaryOutline
     };
     const btnSize = {
       zero: "padding: 0",
@@ -12330,6 +12363,7 @@ var ChipContainer = import_react43.css`
 var ChipText = import_react43.css`
   align-self: center;
   line-height: 1;
+  text-wrap: nowrap;
 `;
 var ChipIcon = import_react43.css`
   align-self: center;
@@ -15702,14 +15736,13 @@ var ParameterImageInner = (0, import_react92.forwardRef)(
     const errorText = "The text you provided is not a valid URL";
     const updateImageSrc = (0, import_react92.useCallback)(() => {
       const validUrl = new RegExp(
-        "^(https?:\\/\\/)?((([a-z\\d]([a-z\\d-]*[a-z\\d])*)\\.)+[a-z]{2,}|((\\d{1,3}\\.){3}\\d{1,3}))(\\:\\d+)?(\\/[-a-z\\d%_.~+]*)*(\\?[;&a-z\\d%_.~+=-]*)?(\\#[-a-z\\d_]*)?$",
-        "i"
+        /^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b(?:[-a-zA-Z0-9()@:%_.+~#?&/=]*)$/
       );
       let message = void 0;
       try {
         if (value !== "") {
           const url = String(value).startsWith("//") ? `${location.protocol}${value}` : String(value);
-          if (!url.match(validUrl) || !url.startsWith("https")) {
+          if (!validUrl.test(url) || !url.startsWith("https")) {
             throw Error(errorText);
           }
         }
@@ -15956,11 +15989,8 @@ var import_LexicalListPlugin = require("@lexical/react/LexicalListPlugin");
 var import_LexicalMarkdownShortcutPlugin = require("@lexical/react/LexicalMarkdownShortcutPlugin");
 var import_LexicalRichTextPlugin = require("@lexical/react/LexicalRichTextPlugin");
 var import_rich_text2 = require("@lexical/rich-text");
-var import_fast_equals2 = require("fast-equals");
-var import_lexical5 = require("lexical");
-var import_react102 = require("react");
 
-// src/components/ParameterInputs/rich-text/builtInElements.ts
+// ../richtext/dist/index.mjs
 var richTextBuiltInElements = [
   {
     label: "Heading 1",
@@ -15991,7 +16021,7 @@ var richTextBuiltInElements = [
     type: "unorderedList"
   },
   {
-    label: "Numbered List",
+    label: "Ordered List",
     type: "orderedList"
   },
   {
@@ -16007,8 +16037,6 @@ var richTextBuiltInElements = [
     type: "code"
   }
 ];
-
-// src/components/ParameterInputs/rich-text/builtInFormats.ts
 var richTextBuiltInFormats = [
   {
     label: "Bold",
@@ -16039,6 +16067,19 @@ var richTextBuiltInFormats = [
     type: "subscript"
   }
 ];
+var getLabelForElement = (type) => {
+  var _a;
+  if (type === "paragraph") {
+    return "Normal";
+  }
+  const element = richTextBuiltInElements.find((element2) => element2.type === type);
+  return (_a = element == null ? void 0 : element.label) != null ? _a : type;
+};
+
+// src/components/ParameterInputs/ParameterRichText.tsx
+var import_fast_equals2 = require("fast-equals");
+var import_lexical5 = require("lexical");
+var import_react102 = require("react");
 
 // src/components/ParameterInputs/rich-text/editorStyles.ts
 var import_css = require("@emotion/css");
@@ -16897,14 +16938,6 @@ var RichTextToolbar = ({ config }) => {
   const enabledTextualElements = enabledBuiltInElements.filter(
     (element) => ["h1", "h2", "h3", "h4", "h5", "h6"].includes(element.type)
   );
-  const elementTypeToLabel = (type) => {
-    var _a;
-    if (type === "paragraph") {
-      return "Normal";
-    }
-    const element = richTextBuiltInElements.find((element2) => element2.type === type);
-    return (_a = element == null ? void 0 : element.label) != null ? _a : type;
-  };
   const onSelectElement = (type) => {
     if (activeElement === type) {
       return;
@@ -17043,7 +17076,7 @@ var RichTextToolbar = ({ config }) => {
     return [
       ...enabledTextualElements,
       {
-        label: elementTypeToLabel(activeElement),
+        label: getLabelForElement(activeElement),
         type: activeElement
       }
     ];
@@ -17054,7 +17087,7 @@ var RichTextToolbar = ({ config }) => {
       {
         menuLabel: "Elements",
         menuTrigger: /* @__PURE__ */ (0, import_jsx_runtime91.jsxs)("button", { css: toolbarButton, title: "Text formatting", children: [
-          elementsThatShouldBeVisibleInDropdown.some((element) => element.type === activeElement) ? elementTypeToLabel(activeElement) : elementTypeToLabel("paragraph"),
+          elementsThatShouldBeVisibleInDropdown.some((element) => element.type === activeElement) ? getLabelForElement(activeElement) : getLabelForElement("paragraph"),
           " ",
           /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(Icon, { icon: "chevron-down", css: [toolbarIcon, toolbarChevron], size: "1rem" })
         ] }),
@@ -18307,6 +18340,7 @@ var StatusBullet = ({
   buttonSecondary,
   buttonSecondaryInvert,
   buttonTertiary,
+  buttonTertiaryOutline,
   buttonUnimportant,
   canvasAlertIcon,
   cardIcon,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniformdev/design-system",
-  "version": "19.21.0",
+  "version": "19.22.1-alpha.8+a8f730b12",
   "description": "Uniform design system components",
   "license": "SEE LICENSE IN LICENSE.txt",
   "main": "./dist/index.js",
@@ -23,7 +23,8 @@
     "@storybook/client-api": "6.5.16",
     "@storybook/react": "6.5.16",
     "@types/react": "18.2.7",
-    "@uniformdev/canvas": "^19.21.0",
+    "@uniformdev/canvas": "^19.22.1-alpha.8+a8f730b12",
+    "@uniformdev/richtext": "^19.22.1-alpha.8+a8f730b12",
     "autoprefixer": "10.4.14",
     "hygen": "6.2.11",
     "postcss": "8.4.24",
@@ -66,5 +67,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "3db4c0f1c775a5cf9677c6df294322cfbf79611e"
+  "gitHead": "a8f730b12035a4d7c2e6a704d3777ff12df52ffc"
 }