@wix/patterns 1.419.0 → 1.421.0

package/src/components/ImportButton/import-create-new-field-issues.md

@@ -0,0 +1,159 @@
+# Import "Create New Field" — Issues Tracker
+
+Side issues found while building the import **create-new-field** feature.
+PR: [feat(Import): create new fields via updateSchema #5476](https://github.com/wix-private/cairo/pull/5476) · JIRA: CAIRO-4230
+
+**Status:** `open` / `in progress` / `done` / `dismiss` · **Severity:** Major / Minor / Nit
+
+| # | Issue | Component / Where | Severity | Status | Resolution recommendation |
+|---|---|---|---|---|---|
+| 1 | Dropdown clear (✕) button also reopens the dropdown | `Dropdown` (`@wix/design-system`) — import config step mapping dropdowns (`ImportStepConfiguration` → `import-mapping-<header>`) | Minor | in progress | Fix in `@wix/design-system` — WDS PR in progress: [wix-design-systems#16421](https://github.com/wix-private/wix-design-systems/pull/16421). Clear handler should `stopPropagation` and not reopen the popover. |
+| 2 | "Edit Field" link in the new-field helper is not implemented | Import config step — `NewFieldHelperText` (`ImportStepConfiguration`) | Feature ([CAIRO-4398](https://wix.atlassian.net/browse/CAIRO-4398)) | open | Implement the "Edit Field" entry point: open a field editor from the helper so the user can change the new field's name/type before import. Wire it to the resolved `NewFieldDefinition`. |
+| 3 | New field's display name duplicates an existing field name (only the key is deduped) | `ImportState._resolveFieldMapping` / `uniqueFieldNameAndKey` (`packages/core`) | Bug · Minor | **done** | Fixed: `uniqueFieldNameAndKey` now dedupes the **display name** (suffix `-N`) and derives the key from the suffixed name, checking both name and key against existing fields + sibling new fields — mirrors cm-import `generateFieldNameAndKey`. Tests added (duplicate-derived-key + existing-field collision). |
+| 4 | Mapping dropdown is missing the "+ Create New Field" footer action | `FieldMappingCell` (`ImportStepConfiguration`) — WDS `Dropdown` `fixedFooter` | Feature ([CAIRO-4399](https://wix.atlassian.net/browse/CAIRO-4399)) | open | Add a sticky "+ Create New Field" footer to the mapping dropdown; clicking opens the field editor (shared with #2) and maps the column to the created field. |
+| 5 | New columns don't appear after import — schema isn't reloaded | `ImportState.startImport` (`packages/core`) + consumer schema refresh (auto-patterns) | Bug ([CAIRO-4400](https://wix.atlassian.net/browse/CAIRO-4400)) | open | After a successful import that created new fields, reload the schema so the table columns update. Today only the collection data is refetched (`clearResultAndMoveToStart`); the field/schema definitions aren't refreshed, so new columns stay hidden. |
+
+---
+
+## Details
+
+### 1. Dropdown clear button also opens the dropdown
+
+- **Status:** in progress — fix in `@wix/design-system`, PR
+  [wix-design-systems#16421](https://github.com/wix-private/wix-design-systems/pull/16421).
+- **Component:** `Dropdown` (`@wix/design-system`) — fix location is WDS, not Cairo.
+- **Feature:** Import → "create new field" (CAIRO-4230).
+
+**Symptom:** Clicking a mapping `Dropdown`'s clear (✕) button clears the selected
+value but *also* reopens the dropdown popover. Expected: clear should only clear (set
+the column to "Don't import"), leaving the dropdown closed.
+
+**Scope:** Specific to the import "create new field" flow — i.e. when `updateSchema`
+is provided so columns carry a `(New)` option and default to creating a new field.
+Reproduced inside the Import modal; appears tied to the modal context.
+
+**Where observed:** Import modal → "Match & Import" / configuration step, the
+per-column mapping dropdowns. Clearing a column mapped to a new field (`(New)`) reopens
+the dropdown instead of leaving it on "Don't import".
+
+**Suspected cause (to confirm):** clear → `setMapping(header, null)` re-renders the
+cell; combined with the modal focus trap returning focus to the input, the Dropdown's
+open-on-focus/click logic re-triggers. The clear handler likely isn't stopping
+propagation / preventing the reopen.
+
+**Next steps:**
+- [ ] Minimal repro: a `Dropdown` with `clearButton` inside a WDS modal vs. outside,
+      and with/without the `(New)` option, to isolate WDS vs. our changes.
+- [ ] Confirm whether it's focus-trap-driven (modal) or general.
+- [x] File a `@wix/design-system` PR — [#16421](https://github.com/wix-private/wix-design-systems/pull/16421)
+      (clear handler should `stopPropagation` and not reopen the popover).
+- [ ] Land WDS PR #16421; bump `@wix/design-system` and remove any Cairo-side
+      workaround once shipped.
+
+### 2. Implement the "Edit Field" button
+
+- **JIRA:** [CAIRO-4398](https://wix.atlassian.net/browse/CAIRO-4398) (Task, parent CAIRO-3912, Cairo Sprint 101).
+- **Type:** Feature.
+- **Feature:** Import → "create new field" (CAIRO-4230); design from CAIRO-4131.
+
+**What's missing:** The new-field helper renders `This will be a new text field.`
+followed by an **"Edit Field"** link (see design), but the link is not implemented yet
+— today the helper text only states the type. The user should be able to click
+"Edit Field" to adjust the new field before import.
+
+**Expected behavior:** Clicking "Edit Field" opens a field editor (name + type, and any
+other field settings) pre-filled for that column's pending new field. Confirming
+updates the column's `NewFieldDefinition` (key/displayName/type) that's later passed to
+`updateSchema`. This is also the entry point that, together with CAIRO-4131's type
+detection, lets the user override the suggested type.
+
+**Where it goes:** `NewFieldHelperText` in `ImportStepConfiguration` (the helper line
+currently shows only the type name). The editor itself likely reuses the existing
+field-editing UI (e.g. CustomFieldModal / patterns-fields field editor).
+
+**Next steps:**
+- [ ] Open a JIRA ticket for the "Edit Field" flow (link it here).
+- [ ] Decide the editor surface (reuse `CustomFieldModal` vs. a lightweight popover).
+- [ ] Render the "Edit Field" link in `NewFieldHelperText` and wire it to update the
+      column's `NewFieldDefinition` before import.
+- [ ] Add the `cairo.import.editField` translation key.
+
+### 3. New field display name can duplicate an existing field name
+
+- **Type:** Bug — in our code (`packages/core` `ImportState`), not external.
+- **Feature:** Import → "create new field" (CAIRO-4230).
+
+**Symptom:** The new field's `displayName` is taken straight from the CSV header, so it
+can collide with an existing field's display name (or with another new column sharing
+the same header). Today only the **key** is deduped (`uniqueFieldKey` — camelCase +
+numeric suffix); the display **name** is not, so the UI/schema can end up with two
+fields showing the same name.
+
+**Reference:** cm-import `src/field-configuration/generateFieldNameAndKey.js` dedupes
+both together — it suffixes the **display name** as `"{name}-{n}"` when the name
+collides with an existing field name *or* the derived key collides, then derives the
+key from the (suffixed) name. Existing names come from both already-queued new fields
+and the current schema fields.
+
+**Fix (done — `ImportState._resolveFieldMapping`):**
+- `uniqueFieldNameAndKey(header, usedNames, usedKeys)` replaces `uniqueFieldKey`:
+  starts from the header, and when the display name or its derived key collides,
+  suffixes the display name as `"<header>-<n>"` and re-derives the key from it.
+- `_resolveFieldMapping` seeds `usedNames` (existing `field.header`) alongside
+  `usedKeys` (existing `field.id`), and adds each new field's resolved name+key as it
+  goes, so both are unique across existing fields and sibling new columns.
+- Tests: "dedupes new field name/key when two columns derive the same key" and
+  "suffixes a new field when its derived key collides with an existing field"
+  (`Table.importButton.spec`, 112 passing).
+
+### 4. Mapping dropdown is missing the "+ Create New Field" footer action
+
+- **JIRA:** [CAIRO-4399](https://wix.atlassian.net/browse/CAIRO-4399) (Task, parent CAIRO-3912, Cairo Sprint 101).
+- **Type:** Feature.
+- **Feature:** Import → "create new field" (CAIRO-4230); design from CAIRO-4131.
+
+**What's missing:** Per design, the column mapping dropdown should have a sticky
+**"+ Create New Field"** footer below the options (suggested `(New)` option + existing
+fields). Today the dropdown only offers the auto-suggested `<Column> (New)` option and
+the existing fields — no explicit "create a new field" action.
+
+**Expected behavior:** Add a WDS `Dropdown` `fixedFooter` with "+ Create New Field".
+Clicking it opens the field editor (the same surface as the "Edit Field" entry point,
+#2 / CAIRO-4398) so the user can define a new field (name + type); on confirm the
+column maps to that created field, whose `NewFieldDefinition` feeds the single
+`updateSchema` call before import.
+
+**Where it goes:** `FieldMappingCell` in `ImportStepConfiguration` — add `fixedFooter`
+to the mapping `Dropdown`.
+
+**Next steps:**
+- [ ] Add the `fixedFooter` "+ Create New Field" action to the mapping dropdown.
+- [ ] Wire it to the field editor (shared with #2 / CAIRO-4398).
+- [ ] Map the column to the created field on confirm.
+- [ ] Add the `cairo.import.createNewField` translation key.
+
+### 5. New columns don't appear after import (schema not reloaded)
+
+- **JIRA:** [CAIRO-4400](https://wix.atlassian.net/browse/CAIRO-4400) (Task, parent CAIRO-3912, Cairo Sprint 101).
+- **Type:** Bug — spans Cairo (`packages/core` `ImportState`) and the consumer
+  (auto-patterns schema).
+- **Feature:** Import → "create new field" (CAIRO-4230).
+
+**Symptom:** After an import that created new fields completes, the new fields' values
+land in the data but the **table doesn't show the new columns** until a manual refresh.
+On success `ImportState.startImport` calls `collection.clearResultAndMoveToStart`, which
+refetches the collection **data** but not the **schema/field definitions** the table
+columns are derived from — so the new columns stay hidden.
+
+**Fix (to decide):** when an import created new fields and completed successfully,
+trigger a **schema reload** so the columns update. Options:
+- Have `ImportState` invoke an optional completion/`onFieldsCreated` callback the
+  consumer wires to `schema.refresh()` (auto-patterns has `schema.refresh`), or
+- Refresh the schema in the consumer's import wiring after success.
+- Only refresh when new fields were actually created (skip for plain imports), and do
+  it post-import (not during) to avoid mid-flight re-render churn.
+
+**Next steps:**
+- [ ] Decide the hook: `ImportState` completion callback vs. consumer-side refresh.
+- [ ] Trigger `schema.refresh()` (auto-patterns) only when new fields were created.
+- [ ] Verify the table renders the new columns after import without a manual reload.

package/src/components/ImportButton/pr-5490-review-comments.md

@@ -0,0 +1,44 @@
+# PR #5490 — Review Comments Tracker
+
+PR: [feat(Import): detect new field type from column data #CAIRO-4131](https://github.com/wix-private/cairo/pull/5490)
+Reviewers: **liorgu-wix** (human) + **Codex** (`github-actions[bot]`). CI/bundle/status bots excluded.
+
+> **liorgu-wix summary (no blocking bugs):** "The DI seam (core owns the `NewFieldType`
+> vocabulary + sampling/vote, fields injects media-awareness) is the right shape and
+> respects `utils → core → cairo/fields`. Wiring is correct and happy-path tests pass."
+> Recurring theme: code/comments claim fidelity to cm-import the implementation doesn't
+> actually have (sample size, URL validation, ordering, audio/vector) — either match
+> cm-import or own the deliberate divergences.
+> [review](https://github.com/wix-private/cairo/pull/5490#pullrequestreview-4539585402)
+
+Status: `open` / `done` / `dismiss` · Severity: Major / Test gap / Minor / Nit / Info
+
+The **vs cm-import today** column records how our behavior compares to cm-import
+(`wix-data-client/cm-import`) — the source of liorgu's recurring "claims fidelity it
+doesn't have" theme.
+
+| # | Comment link | Description | vs cm-import today | Severity | Status | Resolution recommendation |
+|---|---|---|---|---|---|---|
+| 1 | [codex](https://github.com/wix-private/cairo/pull/5490#discussion_r3436393090) — `ImportState.ts` (date) | Date detection uses browser-dependent `new Date(value)` after a regex check; same CSV can infer `date` in one browser, `text` in another → inconsistent `updateSchema` payloads. | **Same** — cm-import's `detectFieldConfig.js` uses the identical `new Date(value).getTime()` heuristic. The reviewer wants us to *improve on* cm-import, not match it. | Major | open | Strict-parse the supported date formats (validate y/m/d components) instead of `new Date`/`Date.parse` heuristics. |
+| 2 | [liorgu §1](https://github.com/wix-private/cairo/pull/5490#pullrequestreview-4539585402) — cross-cutting | Confirm **no current `updateSchema` consumer** (esp. the CMS source adapter) switches on `fieldType` and would now receive `number`/`date`/`image`/… and mishandle/throw. If CMS is already live, that's a regression vector, not a follow-up. | **Diverges** — cm-import's `createFieldDefinition` maps each detected `fieldType` and creates it. Ours: the only consumer (auto-patterns `useImport`) hardcoded `SHORT_TEXT`; the CMS `addField`/`addFields` reverse map threw "not supported" on anything but text/number/boolean/date. | Major (verify) | **done** | **Audit: no live regression** — the only consumer discarded the detected type (always `SHORT_TEXT`). **Fixed forward** in auto-cairo: the 4-type cap was a **UI limitation, not an API one** — `@wix/data` creates all field types — so widened `PatternsFieldTypeToCmsFieldType` to add URL/IMAGE/VIDEO/DOCUMENT/AUDIO, and `useImport` now maps each detected `NewFieldType` → its field type (SHORT_TEXT fallback). `addFields` creates the real type instead of throwing. Tests updated (media now creates; throw-path uses REFERENCE) — 29 green. Forward-compatible once #5490 publishes. (auto-cairo repo.) |
+| 3 | [liorgu](https://github.com/wix-private/cairo/pull/5490#discussion_r3448316713) — `Table.importButton.spec.tsx:743` | Test gaps: mixed column → `text` (the ⅔ vote itself), empty-heavy column, `audio`/`video`, **core default (no injection)** proving the DI seam gates media detection, and direct unit specs for the pure functions. | N/A (our test coverage) — cm-import exercises the majority/fallback in its own `guessFieldConfigFromSamples` specs; we don't yet. | Test gap | **done** | Added direct unit specs: `core/__tests__/state/detectFieldType.spec.ts` (14 — number/date/boolean/url branch edges, majority, **fallback**, **empty-heavy**, sample truncation, DI hook, and **core-default media→text/url** proving the seam) and `fields/src/__tests__/utils/detect-field-type.spec.ts` (6 — image/video/document/**audio**/vector, external-image-URL→image, primitives, mixed→text). |
+| 4 | [liorgu](https://github.com/wix-private/cairo/pull/5490#discussion_r3448316710) — `detect-field-type.ts:23` | Detects **more** than cm-import while comments claim a match: `audio` and `vector→image`. | **Diverges (superset)** — cm-import's `validationOrder` has **no audio** entry (never detects audio); its *detection* path (`detectionSchema` = `wix-image-with-extension`) does **not** check `isWixVectorUri`. We detect both. | Minor + Test gap | **done** | Reworded the `detectMediaType` comment to document audio + vector→image as **intentional supersets** of cm-import's detection path (dropped the "matches cm-import" framing); added the audio test (fields spec). |
+| 5 | [liorgu](https://github.com/wix-private/cairo/pull/5490#discussion_r3448316711) + [codex](https://github.com/wix-private/cairo/pull/5490#discussion_r3436393101) — `ImportState.ts:456` | `_columnValues()` materializes the whole column although only the first 50 are used → O(rows×cols) allocations at parse time. | **Diverges (less efficient)** — cm-import's `_getSamples` does `importData.slice(0, sampleSize).map(...)` — slices *before* mapping, so it never allocates the full column. We map the full column then slice. | Minor (perf) | **done** | Exported `TYPE_SAMPLE_SIZE` from `detectFieldType`; `_columnValues` now `slice(0, TYPE_SAMPLE_SIZE)` **before** mapping, so only the head is copied — matching cm-import's `_getSamples`. |
+| 6 | [liorgu](https://github.com/wix-private/cairo/pull/5490#discussion_r3448316706) — `detectFieldType.ts:38` | `SAMPLE_SIZE = 50` is attributed to cm-import, but the comment is wrong. | **Diverges** — cm-import's `constants.sampleSize` is **6**; we use **50**. | Nit (doc) | **done** | Kept 50; rewrote the `TYPE_SAMPLE_SIZE` comment + `detectColumnType` JSDoc to own it as a deliberate larger sample than cm-import's 6 (same 2/3 vote). |
+| 7 | [liorgu](https://github.com/wix-private/cairo/pull/5490#discussion_r3448316707) — `detectFieldType.ts:59` | URL/email/phone helpers are re-implementations, not a port; `isValidWebsiteUrl` is laxer than cm-import. | **Diverges (looser)** — cm-import's `validators/url.js` delegates to `@wix/santa-core-utils` `isValidUrl`/`isValidEmail` for structural validation **and** requires a protocol; ours only checks protocol-prefix + no-whitespace, so e.g. `https://{garbage}` → we say `url`, cm-import says no. | Nit (doc) / Minor | **done** | `isValidWebsiteUrl` now **delegates to the platform `URL` parser** (rejects empty-host / whitespace / malformed authorities) instead of a prefix check; `@wix/santa-core-utils` isn't available here, so the comment owns the residual gap (`URL` accepts some odd hosts santa rejects). Added invalid-URL→text tests. |
+| 8 | [liorgu](https://github.com/wix-private/cairo/pull/5490#discussion_r3448316709) — `detect-field-type.ts:48` | "media-first" comment claims cm-import precedence it doesn't have. | **Diverges (order; equivalent result)** — cm-import runs `detectPrimitiveType` (number → boolean → date) **first**, media only on fall-through; we check media first. Same result in practice (media URIs don't match the number/bool/date regexes). | Nit (doc) | **done** | Reworded the `detectValueTypeWithMedia` comment to state our order differs from cm-import's and why the result still matches (fixed alongside #4 in the same block). |
+| 9 | [liorgu](https://github.com/wix-private/cairo/pull/5490#discussion_r3448316712) — `ImportState.ts:577` | `index >= 0 ? … : 'text'` — `header` always comes from `csvHeaders`, so the `'text'` branch is dead. | N/A — our code structure (cm-import keys samples off the selected column, no such guard). | Nit | open | Drop the guard, or add a one-line "defensive" comment. |
+| 10 | [liorgu](https://github.com/wix-private/cairo/pull/5490#discussion_r3448316708) — `detectFieldType.ts:102` | Empty cells count as `text` votes; an optional column >⅓ blank falls back to `text` even if every non-blank value is a number. | **Same** — cm-import's `detectFieldConfig('') → text` and `_getSamples` doesn't filter blanks. Faithful, but a sharp edge worth flagging. | Info | open | Flag to product; optionally ignore blanks in the vote (would depart from cm-import — decide consciously). |
+| 11 | [liorgu §2](https://github.com/wix-private/cairo/pull/5490#pullrequestreview-4539585402) — cross-cutting | Leading-zero data loss later: zip/phone/IDs (`01234`) detect as `number` once the consumer honors it. | **Same** — inherited directly from cm-import's number detection. Out of scope here. | Info | open | Note on the consumer follow-up ticket so it's a conscious choice. |
+| 12 | [liorgu](https://github.com/wix-private/cairo/pull/5490#discussion_r3448316714) — `import-create-new-field-issues.md:10` | Non-blocking / pre-existing: git-tracked issue-tracker markdown in the component source tree goes stale and reads as noise in a feature diff. | N/A — repo hygiene, unrelated to cm-import. | Info (non-blocking) | open | Team decision: keep these `.md` files in-repo vs. move to Jira/docs. Not introduced by this PR. |
+
+## Notes
+
+- **Build-failure bot (resolved):** `devex-ai-build-agent` flagged a `TranslationsKeys`
+  mismatch at `ImportStepConfiguration.tsx:78` on an earlier commit (before the
+  patterns-fields title keys were added/rebuilt). Latest Falcon CI is **PASSED** on
+  `c80c2f9` — already fixed, no action.
+- **Theme across 4, 6, 7, 8:** all the same root note from liorgu — the "ported from
+  cm-import" framing overclaims fidelity. Cheapest resolution is a doc pass that owns
+  the deliberate divergences (sample size, URL approximation, ordering, audio/vector
+  superset), unless we choose to match cm-import exactly.

package/src/components/InputOverflow/InputOverflow.st.css.ts

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

package/src/components/LoadingRow/LoadingRow.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "LoadingRow1309418770";
+var _namespace_ = "LoadingRow3194104638";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,8 +13,8 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"LoadingRow1309418770__root"};
-export var keyframes = {"gradientSwoosh":"LoadingRow1309418770__gradientSwoosh"}; 
+export var classes = {"root":"LoadingRow3194104638__root"};
+export var keyframes = {"gradientSwoosh":"LoadingRow3194104638__gradientSwoosh"}; 
 export var layers = {};
 export var containers = {};
 export var stVars = {}; 

package/src/components/MaxHeightText/MaxHeightText.st.css.ts

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

package/src/components/MaxLines/MaxLines.st.css.ts

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

package/src/components/MultiBulkActionToolbar/MultiBulkActionToolbar.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "MultiBulkActionToolbar2843376325";
+var _namespace_ = "MultiBulkActionToolbar3475729719";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"MultiBulkActionToolbar2843376325__root","leftGroupWrapper":"MultiBulkActionToolbar2843376325__leftGroupWrapper","selectedCountItem":"MultiBulkActionToolbar2843376325__selectedCountItem","selectedCountText":"MultiBulkActionToolbar2843376325__selectedCountText"};
+export var classes = {"root":"MultiBulkActionToolbar3475729719__root","leftGroupWrapper":"MultiBulkActionToolbar3475729719__leftGroupWrapper","selectedCountItem":"MultiBulkActionToolbar3475729719__selectedCountItem","selectedCountText":"MultiBulkActionToolbar3475729719__selectedCountText"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/NestedTable/NestedTablePlaceholderStatesRow.st.css.ts

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

package/src/components/NestedTable/NestedTableRow.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "NestedTableRow3188210714";
+var _namespace_ = "NestedTableRow897283882";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"NestedTableRow3188210714__root","firstLevel":"NestedTableRow3188210714__firstLevel","placeholder":"NestedTableRow3188210714__placeholder","parentHovered":"NestedTableRow3188210714__parentHovered"};
+export var classes = {"root":"NestedTableRow897283882__root","firstLevel":"NestedTableRow897283882__firstLevel","placeholder":"NestedTableRow897283882__placeholder","parentHovered":"NestedTableRow897283882__parentHovered"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/NestedTableDragAndDrop/MultipleDragOverlayEffect.st.css.ts

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

package/src/components/NestedTableDragAndDrop/NestedTableDragAndDropRow.st.css.ts

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

package/src/components/PickerContent/PickerContent.st.css.ts

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

package/src/components/PickerContent/PickerContentAdditionalStep.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "PickerContentAdditionalStep2283634028";
+var _namespace_ = "PickerContentAdditionalStep1671871044";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"PickerContentAdditionalStep2283634028__root","titles":"PickerContentAdditionalStep2283634028__titles","suffix":"PickerContentAdditionalStep2283634028__suffix"};
+export var classes = {"root":"PickerContentAdditionalStep1671871044__root","titles":"PickerContentAdditionalStep1671871044__titles","suffix":"PickerContentAdditionalStep1671871044__suffix"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/PickerTableListItem/PickerTableListItem.st.css.ts

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

package/src/components/ScrollableContent/ScrollableContent.st.css.ts

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

package/src/components/SetupWidget/SetupWidget.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "SetupWidget3779148599";
+var _namespace_ = "SetupWidget20893128";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"SetupWidget3779148599__root","row":"SetupWidget3779148599__row","completedCta":"SetupWidget3779148599__completedCta","card":"SetupWidget3779148599__card"};
+export var classes = {"root":"SetupWidget20893128__root","row":"SetupWidget20893128__row","completedCta":"SetupWidget20893128__completedCta","card":"SetupWidget20893128__card"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/SkeletonCard/SkeletonCard.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "SkeletonCard4056202375";
+var _namespace_ = "SkeletonCard1937491044";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"SkeletonCard4056202375__root","headerLoading":"SkeletonCard4056202375__headerLoading"};
+export var classes = {"root":"SkeletonCard1937491044__root","headerLoading":"SkeletonCard1937491044__headerLoading"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/SlidingModal/SlidingModal.st.css.ts

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

package/src/components/TabsFilter/TabsFilter.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "TabsFilter1597686415";
+var _namespace_ = "TabsFilter2977908646";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"TabsFilter1597686415__root","title":"TabsFilter1597686415__title"};
+export var classes = {"root":"TabsFilter2977908646__root","title":"TabsFilter2977908646__title"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/Tags/ManageTags/ManageTagsModal/ManageTagsModal.st.css.ts

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

package/src/components/ToolbarItem/ToolbarItem.st.css.ts

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

package/src/components/ToolbarItemBox/ToolbarItemBox.st.css.ts

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

package/src/components/common.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "common848292470";
+var _namespace_ = "common113862810";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"common848292470__root","column":"common848292470__column","fullHeight":"common848292470__fullHeight"};
+export var classes = {"root":"common113862810__root","column":"common113862810__column","fullHeight":"common113862810__fullHeight"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/state/CollectionPage/CollectionPageHeader.st.css.ts

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