@streamoid/ui 0.6.34 → 0.6.35
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/docs/ScAppSwitchPanel.md +9 -9
- package/dist/index.js +16 -5
- package/dist/index.mjs +16 -5
- package/package.json +1 -1
|
@@ -41,10 +41,10 @@ before, and the panel read as three lists rather than one.
|
|
|
41
41
|
- **Four things that will bite you:**
|
|
42
42
|
1. It **re-sorts your array** into a canonical product order. Your ordering is
|
|
43
43
|
discarded.
|
|
44
|
-
2. Known products render the **canonical tagline** (e.g. "
|
|
45
|
-
|
|
46
|
-
map into a host. Taglines name what the product
|
|
47
|
-
"for".
|
|
44
|
+
2. Known products render the **canonical tagline** (e.g. "Buying and
|
|
45
|
+
planning"), not `description` and not the product `name`. Do not copy that
|
|
46
|
+
map into a host. Taglines name what the product DOES; none of them start
|
|
47
|
+
with "for", and none of them name an audience.
|
|
48
48
|
3. Matching is a **substring** test over `` `${key} ${name}`.toLowerCase() ``. A key
|
|
49
49
|
containing `"cxo"` or `"streamoid"` gets the **CXO** wordmark — but the four
|
|
50
50
|
product names are matched first, so `"Streamoid Catalogix"` is Catalogix.
|
|
@@ -135,11 +135,11 @@ without rendering. The panel applies it already — hosts do not need to sort.
|
|
|
135
135
|
|
|
136
136
|
| Order | Matches (substring, case-insensitive, on `key + " " + name`) | Renders |
|
|
137
137
|
|---|---|---|
|
|
138
|
-
| 1 | `cxo`, `streamoid` | CXO wordmark + "
|
|
139
|
-
| 2 | `tactix` | Tactix wordmark + "
|
|
140
|
-
| 3 | `artifax`, `design studio` | Artifax wordmark + "
|
|
141
|
-
| 4 | `photogenix`, `photo studio` | Photogenix wordmark + "
|
|
142
|
-
| 5 | `catalogix`, `catalog studio` | Catalogix wordmark + "
|
|
138
|
+
| 1 | `cxo`, `streamoid` | CXO wordmark + "Retail Command Center" |
|
|
139
|
+
| 2 | `tactix` | Tactix wordmark + "Buying and planning" |
|
|
140
|
+
| 3 | `artifax`, `design studio` | Artifax wordmark + "Design and development" |
|
|
141
|
+
| 4 | `photogenix`, `photo studio` | Photogenix wordmark + "Studio and content" |
|
|
142
|
+
| 5 | `catalogix`, `catalog studio` | Catalogix wordmark + "Catalog and ecommerce" |
|
|
143
143
|
| last | anything else | `name` (16px semibold) + host `description` (14px tertiary) |
|
|
144
144
|
|
|
145
145
|
**CXO leads the display order but trails the match order.** It is the hub every
|
package/dist/index.js
CHANGED
|
@@ -394,7 +394,7 @@ var PRODUCT_BRANDS = [
|
|
|
394
394
|
tagline: "Retail Command Center",
|
|
395
395
|
hub: true
|
|
396
396
|
},
|
|
397
|
-
{ match: ["tactix"], product: "tactix", tagline: "
|
|
397
|
+
{ match: ["tactix"], product: "tactix", tagline: "Buying and planning" },
|
|
398
398
|
{
|
|
399
399
|
match: ["artifax", "design studio"],
|
|
400
400
|
product: "artifax",
|
|
@@ -532,7 +532,7 @@ var ScAppSwitchRow = ({
|
|
|
532
532
|
{
|
|
533
533
|
product: brand.product,
|
|
534
534
|
color: labelColor,
|
|
535
|
-
style: { transform: "scale(1.
|
|
535
|
+
style: { transform: "scale(1.125)", transformOrigin: "left center" }
|
|
536
536
|
}
|
|
537
537
|
)
|
|
538
538
|
}
|
|
@@ -615,10 +615,21 @@ var ScAppSwitchGroupLabel = ({ children }) => /* @__PURE__ */ (0, import_jsx_run
|
|
|
615
615
|
{
|
|
616
616
|
style: {
|
|
617
617
|
padding: "var(--spacing-md, 8px) var(--spacing-md, 8px) var(--spacing-sm, 4px)",
|
|
618
|
-
|
|
618
|
+
/* SECONDARY, NOT TERTIARY. A group label is structure — it tells you
|
|
619
|
+
which kind of row follows — so it has to be readable; tertiary is the
|
|
620
|
+
ramp step for text you are not meant to read, and at 12px it fell
|
|
621
|
+
under it. */
|
|
622
|
+
color: T.secondary,
|
|
619
623
|
fontFamily: T.font,
|
|
620
|
-
|
|
621
|
-
|
|
624
|
+
/* 12px/16px. At 14px/20px these sat at the same size as the rows they
|
|
625
|
+
label, so "Apps" read as an entry in the list rather than a heading
|
|
626
|
+
over it. Dropping a step makes the hierarchy legible AND takes 4px
|
|
627
|
+
off each label's line box — 8px out of the panel, which is most of
|
|
628
|
+
the tightening asked for. */
|
|
629
|
+
fontSize: "var(--font-size-font-size-xs, 12px)",
|
|
630
|
+
lineHeight: "var(--line-height-line-height-xs, 16px)",
|
|
631
|
+
/* Medium. Weight is what keeps a 12px label from reading as fine print
|
|
632
|
+
once the size drops. */
|
|
622
633
|
fontWeight: 500
|
|
623
634
|
},
|
|
624
635
|
children
|
package/dist/index.mjs
CHANGED
|
@@ -209,7 +209,7 @@ var PRODUCT_BRANDS = [
|
|
|
209
209
|
tagline: "Retail Command Center",
|
|
210
210
|
hub: true
|
|
211
211
|
},
|
|
212
|
-
{ match: ["tactix"], product: "tactix", tagline: "
|
|
212
|
+
{ match: ["tactix"], product: "tactix", tagline: "Buying and planning" },
|
|
213
213
|
{
|
|
214
214
|
match: ["artifax", "design studio"],
|
|
215
215
|
product: "artifax",
|
|
@@ -347,7 +347,7 @@ var ScAppSwitchRow = ({
|
|
|
347
347
|
{
|
|
348
348
|
product: brand.product,
|
|
349
349
|
color: labelColor,
|
|
350
|
-
style: { transform: "scale(1.
|
|
350
|
+
style: { transform: "scale(1.125)", transformOrigin: "left center" }
|
|
351
351
|
}
|
|
352
352
|
)
|
|
353
353
|
}
|
|
@@ -430,10 +430,21 @@ var ScAppSwitchGroupLabel = ({ children }) => /* @__PURE__ */ jsx4(
|
|
|
430
430
|
{
|
|
431
431
|
style: {
|
|
432
432
|
padding: "var(--spacing-md, 8px) var(--spacing-md, 8px) var(--spacing-sm, 4px)",
|
|
433
|
-
|
|
433
|
+
/* SECONDARY, NOT TERTIARY. A group label is structure — it tells you
|
|
434
|
+
which kind of row follows — so it has to be readable; tertiary is the
|
|
435
|
+
ramp step for text you are not meant to read, and at 12px it fell
|
|
436
|
+
under it. */
|
|
437
|
+
color: T.secondary,
|
|
434
438
|
fontFamily: T.font,
|
|
435
|
-
|
|
436
|
-
|
|
439
|
+
/* 12px/16px. At 14px/20px these sat at the same size as the rows they
|
|
440
|
+
label, so "Apps" read as an entry in the list rather than a heading
|
|
441
|
+
over it. Dropping a step makes the hierarchy legible AND takes 4px
|
|
442
|
+
off each label's line box — 8px out of the panel, which is most of
|
|
443
|
+
the tightening asked for. */
|
|
444
|
+
fontSize: "var(--font-size-font-size-xs, 12px)",
|
|
445
|
+
lineHeight: "var(--line-height-line-height-xs, 16px)",
|
|
446
|
+
/* Medium. Weight is what keeps a 12px label from reading as fine print
|
|
447
|
+
once the size drops. */
|
|
437
448
|
fontWeight: 500
|
|
438
449
|
},
|
|
439
450
|
children
|