@wix/patterns-fields 1.122.0 → 1.124.0

package/src/components/media-image/media-image.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "mediaimage2270080892";
+var _namespace_ = "mediaimage2827756990";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,12 +13,12 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"mediaimage2270080892__root"};
+export var classes = {"root":"mediaimage2827756990__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};
 export var stVars = {}; 
-export var vars = {"wds-color-red-200":"--wds-color-red-200","wsr-color-R20":"--wsr-color-R20","wds-color-black-550":"--wds-color-black-550","wsr-color-D55":"--wsr-color-D55","from":"--mediaimage2270080892-from","to":"--mediaimage2270080892-to"}; 
+export var vars = {"wds-color-red-200":"--wds-color-red-200","wsr-color-R20":"--wsr-color-R20","wds-color-black-550":"--wds-color-black-550","wsr-color-D55":"--wsr-color-D55","from":"--mediaimage2827756990-from","to":"--mediaimage2827756990-to"}; 
 
 
 

package/src/components/media-image/overlays/overlay.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../stylable-esm-runtime.js"
 
 
 
-var _namespace_ = "overlay866889659";
+var _namespace_ = "overlay748369807";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"overlay866889659__root","iconOverlay":"overlay866889659__iconOverlay"};
+export var classes = {"root":"overlay748369807__root","iconOverlay":"overlay748369807__iconOverlay"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/media-image-field/cell-media-image-edit.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "cellmediaimageedit791185868";
+var _namespace_ = "cellmediaimageedit2503392614";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"cellmediaimageedit791185868__root","view":"cellmediaimageedit791185868__view","anchor":"cellmediaimageedit791185868__anchor","anchorBox":"cellmediaimageedit791185868__anchorBox","popoverContent":"cellmediaimageedit791185868__popoverContent","image":"cellmediaimageedit791185868__image","imageActions":"cellmediaimageedit791185868__imageActions"};
+export var classes = {"root":"cellmediaimageedit2503392614__root","view":"cellmediaimageedit2503392614__view","anchor":"cellmediaimageedit2503392614__anchor","anchorBox":"cellmediaimageedit2503392614__anchorBox","popoverContent":"cellmediaimageedit2503392614__popoverContent","image":"cellmediaimageedit2503392614__image","imageActions":"cellmediaimageedit2503392614__imageActions"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/media-image-field/media-image-view.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "mediaimageview2046673734";
+var _namespace_ = "mediaimageview3359823944";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"mediaimageview2046673734__root","altTextPlaceholder":"mediaimageview2046673734__altTextPlaceholder"};
+export var classes = {"root":"mediaimageview3359823944__root","altTextPlaceholder":"mediaimageview3359823944__altTextPlaceholder"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/media-tag/web-media-tag/media-tag.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../stylable-esm-runtime.js"
 
 
 
-var _namespace_ = "mediatag3898384478";
+var _namespace_ = "mediatag2648949588";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"mediatag3898384478__root"};
+export var classes = {"root":"mediatag2648949588__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/multi-document/cell-multi-document-edit.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "cellmultidocumentedit1584152841";
+var _namespace_ = "cellmultidocumentedit1969728076";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"cellmultidocumentedit1584152841__root","chipTrigger":"cellmultidocumentedit1584152841__chipTrigger"};
+export var classes = {"root":"cellmultidocumentedit1969728076__root","chipTrigger":"cellmultidocumentedit1969728076__chipTrigger"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/multi-document/multi-document-input/form-multi-document.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../stylable-esm-runtime.js"
 
 
 
-var _namespace_ = "formmultidocument3781924209";
+var _namespace_ = "formmultidocument3706067851";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"formmultidocument3781924209__root","viewRoot":"formmultidocument3781924209__viewRoot","singleViewWrapper":"formmultidocument3781924209__singleViewWrapper","addDocumentButton":"formmultidocument3781924209__addDocumentButton"};
+export var classes = {"root":"formmultidocument3706067851__root","viewRoot":"formmultidocument3706067851__viewRoot","singleViewWrapper":"formmultidocument3706067851__singleViewWrapper","addDocumentButton":"formmultidocument3706067851__addDocumentButton"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/reference/cell-multi-reference-input.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "cellmultireferenceinput1531534607";
+var _namespace_ = "cellmultireferenceinput2322369013";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"cellmultireferenceinput1531534607__root"};
+export var classes = {"root":"cellmultireferenceinput2322369013__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/reference/cell-multi-reference-view.st.css

@@ -0,0 +1,6 @@
+.expanded {
+  box-sizing: border-box;
+  max-height: 240px;
+  overflow-y: auto;
+  overscroll-behavior: contain;
+}

package/src/components/reference/cell-multi-reference-view.st.css.ts

@@ -0,0 +1,25 @@
+// @ts-nocheck
+
+
+import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
+
+
+
+var _namespace_ = "cellmultireferenceview1878943929";
+var _style_ = classesRuntime.bind(null, _namespace_);
+
+export var cssStates = statesRuntime.bind(null, _namespace_);
+export var style: import("@stylable/runtime").STFunction = _style_;
+export var st: import("@stylable/runtime").STFunction = _style_;
+
+export var namespace = _namespace_;
+export var classes = {"root":"cellmultireferenceview1878943929__root","expanded":"cellmultireferenceview1878943929__expanded"};
+export var keyframes = {}; 
+export var layers = {};
+export var containers = {};
+export var stVars = {}; 
+export var vars = {}; 
+
+
+
+

package/src/components/reference/cell-multi-reference-view.tsx

@@ -2,6 +2,7 @@ import React, { useMemo } from 'react';
 import { Box, TagList } from '@wix/design-system';
 import { useTranslations } from '../../hooks/use-translations';
 import { ReferenceAvatar } from './reference-avatar';
+import { classes } from './cell-multi-reference-view.st.css.js';
 
 export interface CellMultiReferenceItem {
   id: string;
@@ -19,15 +20,17 @@ export interface CellMultiReferenceViewProps {
    * uniqueness (e.g., derive from columnId + rowKey).
    */
   fieldId: string;
+  /** Show all selected tags in a wrapping, height-limited view. */
+  expanded?: boolean;
 }
 
 export const CellMultiReferenceView: React.FC<CellMultiReferenceViewProps> = ({
   items,
   dataHook,
   fieldId,
+  expanded = false,
 }) => {
   const { t } = useTranslations();
-
   const tags = useMemo(
     () =>
       items.map((item, i) => {
@@ -51,25 +54,31 @@ export const CellMultiReferenceView: React.FC<CellMultiReferenceViewProps> = ({
 
   return (
     <Box
+      className={expanded ? classes.expanded : undefined}
       dataHook={dataHook}
       direction="vertical"
-      verticalAlign="middle"
-      padding="0 8px"
-      height="100%"
+      verticalAlign={expanded ? 'top' : 'middle'}
+      padding={expanded ? '6px 8px' : '0 8px'}
+      height={expanded ? undefined : '100%'}
       width="100%"
       minWidth={0}
     >
       <TagList
-        overflowMode={{
-          type: 'collapse',
-          overflowTooltipContent: (hiddenTags) =>
-            hiddenTags
-              .map((tag) =>
-                typeof tag.children === 'string' ? tag.children : '',
-              )
-              .filter(Boolean)
-              .join(', '),
-        }}
+        maxVisibleTags={expanded ? tags.length : undefined}
+        overflowMode={
+          expanded
+            ? undefined
+            : {
+                type: 'collapse',
+                overflowTooltipContent: (hiddenTags) =>
+                  hiddenTags
+                    .map((tag) =>
+                      typeof tag.children === 'string' ? tag.children : '',
+                    )
+                    .filter(Boolean)
+                    .join(', '),
+              }
+        }
         size="small"
         dataHook="cell-multi-reference-tags"
         tags={tags}

package/src/components/reference/cell-reference-input.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "cellreferenceinput1272561628";
+var _namespace_ = "cellreferenceinput2304300202";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"cellreferenceinput1272561628__root","autocomplete":"cellreferenceinput1272561628__autocomplete"};
+export var classes = {"root":"cellreferenceinput2304300202__root","autocomplete":"cellreferenceinput2304300202__autocomplete"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/rich-content/rich-content-input/default-value-input/rich-content-default-value-input.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "richcontentdefaultvalueinput4183316190";
+var _namespace_ = "richcontentdefaultvalueinput2111913369";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"richcontentdefaultvalueinput4183316190__root","richContentEditorContainer":"richcontentdefaultvalueinput4183316190__richContentEditorContainer","editor":"richcontentdefaultvalueinput4183316190__editor"};
+export var classes = {"root":"richcontentdefaultvalueinput2111913369__root","richContentEditorContainer":"richcontentdefaultvalueinput2111913369__richContentEditorContainer","editor":"richcontentdefaultvalueinput2111913369__editor"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/rich-content/rich-content-input/form-input/rich-content-form-input.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "richcontentforminput1125731069";
+var _namespace_ = "richcontentforminput1811732449";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"richcontentforminput1125731069__root","editor":"richcontentforminput1125731069__editor"};
+export var classes = {"root":"richcontentforminput1811732449__root","editor":"richcontentforminput1811732449__editor"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/rich-content/rich-content-input/form-read-only-input/rich-content-form-read-only-input.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "richcontentformreadonlyinput2383159312";
+var _namespace_ = "richcontentformreadonlyinput1023395189";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"richcontentformreadonlyinput2383159312__root"};
+export var classes = {"root":"richcontentformreadonlyinput1023395189__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/rich-content/rich-content-input/rich-content-common/fullscreen-modal/fullscreen-modal.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../../stylable-esm-runti
 
 
 
-var _namespace_ = "fullscreenmodal1461732388";
+var _namespace_ = "fullscreenmodal2241348729";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"fullscreenmodal1461732388__root","modalContent":"fullscreenmodal1461732388__modalContent"};
+export var classes = {"root":"fullscreenmodal2241348729__root","modalContent":"fullscreenmodal2241348729__modalContent"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/rich-content/rich-content-input/rich-content-common/publish-loader/publish-loader.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../../stylable-esm-runti
 
 
 
-var _namespace_ = "publishloader3487368423";
+var _namespace_ = "publishloader1555093722";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"publishloader3487368423__root","publishLoader":"publishloader3487368423__publishLoader"};
+export var classes = {"root":"publishloader1555093722__root","publishLoader":"publishloader1555093722__publishLoader"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/rich-content/rich-content-input/rich-content-common/toggle-fullscreen-button/toggle-fullscreen-button.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../../stylable-esm-runti
 
 
 
-var _namespace_ = "togglefullscreenbutton2861801012";
+var _namespace_ = "togglefullscreenbutton631337782";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"togglefullscreenbutton2861801012__root"};
+export var classes = {"root":"togglefullscreenbutton631337782__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/rich-content/rich-content-input/rich-content-editor/rich-content-editor.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "richcontenteditor2909268378";
+var _namespace_ = "richcontenteditor3101940028";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"richcontenteditor2909268378__root","toolbarContainer":"richcontenteditor2909268378__toolbarContainer","footerToolbarContainer":"richcontenteditor2909268378__footerToolbarContainer","toolbarAndFullScreenButtonWrapper":"richcontenteditor2909268378__toolbarAndFullScreenButtonWrapper","editor":"richcontenteditor2909268378__editor","modalEditor":"richcontenteditor2909268378__modalEditor"};
+export var classes = {"root":"richcontenteditor3101940028__root","toolbarContainer":"richcontenteditor3101940028__toolbarContainer","footerToolbarContainer":"richcontenteditor3101940028__footerToolbarContainer","toolbarAndFullScreenButtonWrapper":"richcontenteditor3101940028__toolbarAndFullScreenButtonWrapper","editor":"richcontenteditor3101940028__editor","modalEditor":"richcontenteditor3101940028__modalEditor"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/rich-content/rich-content-input/rich-content-editor/rich-content-toolbar.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "richcontenttoolbar4148804014";
+var _namespace_ = "richcontenttoolbar2032698855";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"richcontenttoolbar4148804014__root","toolbar":"richcontenttoolbar4148804014__toolbar","toolbarButton":"richcontenttoolbar4148804014__toolbarButton","separator":"richcontenttoolbar4148804014__separator"};
+export var classes = {"root":"richcontenttoolbar2032698855__root","toolbar":"richcontenttoolbar2032698855__toolbar","toolbarButton":"richcontenttoolbar2032698855__toolbarButton","separator":"richcontenttoolbar2032698855__separator"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/rich-content/rich-content-input/rich-content-viewer/rich-content-viewer.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "richcontentviewer623354021";
+var _namespace_ = "richcontentviewer1028401867";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"richcontentviewer623354021__root","viewer":"richcontentviewer623354021__viewer","modalViewer":"richcontentviewer623354021__modalViewer"};
+export var classes = {"root":"richcontentviewer1028401867__root","viewer":"richcontentviewer1028401867__viewer","modalViewer":"richcontentviewer1028401867__modalViewer"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/rich-text/rich-text-input/rich-text-editor/rich-editor.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "richeditor3683355568";
+var _namespace_ = "richeditor3347470033";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"richeditor3683355568__root","editor":"richeditor3683355568__editor","header-one":"richeditor3683355568__header-one","header-two":"richeditor3683355568__header-two","header-three":"richeditor3683355568__header-three","header-four":"richeditor3683355568__header-four","header-five":"richeditor3683355568__header-five","header-six":"richeditor3683355568__header-six","paragraph-one":"richeditor3683355568__paragraph-one","unstyled":"richeditor3683355568__unstyled","paragraph-three":"richeditor3683355568__paragraph-three","align-left":"richeditor3683355568__align-left","align-right":"richeditor3683355568__align-right","align-center":"richeditor3683355568__align-center","align-justify":"richeditor3683355568__align-justify","withMargin":"richeditor3683355568__withMargin","dir-rtl":"richeditor3683355568__dir-rtl"};
+export var classes = {"root":"richeditor3347470033__root","editor":"richeditor3347470033__editor","header-one":"richeditor3347470033__header-one","header-two":"richeditor3347470033__header-two","header-three":"richeditor3347470033__header-three","header-four":"richeditor3347470033__header-four","header-five":"richeditor3347470033__header-five","header-six":"richeditor3347470033__header-six","paragraph-one":"richeditor3347470033__paragraph-one","unstyled":"richeditor3347470033__unstyled","paragraph-three":"richeditor3347470033__paragraph-three","align-left":"richeditor3347470033__align-left","align-right":"richeditor3347470033__align-right","align-center":"richeditor3347470033__align-center","align-justify":"richeditor3347470033__align-justify","withMargin":"richeditor3347470033__withMargin","dir-rtl":"richeditor3347470033__dir-rtl"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/rich-text/rich-text-input/rich-text-editor/rich-text-editor.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "richtexteditor3472732112";
+var _namespace_ = "richtexteditor3023173905";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"richtexteditor3472732112__root","nativeInput":"richtexteditor3472732112__nativeInput","editor":"richtexteditor3472732112__editor"};
+export var classes = {"root":"richtexteditor3023173905__root","nativeInput":"richtexteditor3023173905__nativeInput","editor":"richtexteditor3023173905__editor"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/rich-text/rich-text-input/rich-text-editor/toolbar/toolbar.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../../stylable-esm-runti
 
 
 
-var _namespace_ = "toolbar3784695015";
+var _namespace_ = "toolbar4104866968";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"toolbar3784695015__root","item":"toolbar3784695015__item","separator":"toolbar3784695015__separator","clearFormatting":"toolbar3784695015__clearFormatting","fullScreen":"toolbar3784695015__fullScreen","dropdownItemContent":"toolbar3784695015__dropdownItemContent","dropdownItemTitle":"toolbar3784695015__dropdownItemTitle","dropdownItemSubtitle":"toolbar3784695015__dropdownItemSubtitle","dropdownHeaderOne":"toolbar3784695015__dropdownHeaderOne","dropdownHeaderTwo":"toolbar3784695015__dropdownHeaderTwo","dropdownHeaderThree":"toolbar3784695015__dropdownHeaderThree","dropdownHeaderFour":"toolbar3784695015__dropdownHeaderFour","dropdownHeaderFive":"toolbar3784695015__dropdownHeaderFive","dropdownHeaderSix":"toolbar3784695015__dropdownHeaderSix","dropdownParagraphOne":"toolbar3784695015__dropdownParagraphOne","dropdownNormalText":"toolbar3784695015__dropdownNormalText","dropdownParagraphThree":"toolbar3784695015__dropdownParagraphThree"};
+export var classes = {"root":"toolbar4104866968__root","item":"toolbar4104866968__item","separator":"toolbar4104866968__separator","clearFormatting":"toolbar4104866968__clearFormatting","fullScreen":"toolbar4104866968__fullScreen","dropdownItemContent":"toolbar4104866968__dropdownItemContent","dropdownItemTitle":"toolbar4104866968__dropdownItemTitle","dropdownItemSubtitle":"toolbar4104866968__dropdownItemSubtitle","dropdownHeaderOne":"toolbar4104866968__dropdownHeaderOne","dropdownHeaderTwo":"toolbar4104866968__dropdownHeaderTwo","dropdownHeaderThree":"toolbar4104866968__dropdownHeaderThree","dropdownHeaderFour":"toolbar4104866968__dropdownHeaderFour","dropdownHeaderFive":"toolbar4104866968__dropdownHeaderFive","dropdownHeaderSix":"toolbar4104866968__dropdownHeaderSix","dropdownParagraphOne":"toolbar4104866968__dropdownParagraphOne","dropdownNormalText":"toolbar4104866968__dropdownNormalText","dropdownParagraphThree":"toolbar4104866968__dropdownParagraphThree"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/text/text-view.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "textview313014162";
+var _namespace_ = "textview4019917747";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"textview313014162__root","textView":"textview313014162__textView"};
+export var classes = {"root":"textview4019917747__root","textView":"textview4019917747__textView"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};