@uniformdev/context-ui 20.36.1-alpha.1 → 20.36.1
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/index.esm.js +227 -218
- package/dist/index.js +239 -231
- package/dist/index.mjs +227 -218
- package/package.json +4 -4
package/dist/index.mjs
CHANGED
|
@@ -695,32 +695,38 @@ var DimensionOption = (props) => {
|
|
|
695
695
|
};
|
|
696
696
|
|
|
697
697
|
// src/components/DimensionMenu/DimensionValue.tsx
|
|
698
|
-
import {
|
|
698
|
+
import { css as css4 } from "@emotion/react";
|
|
699
|
+
import { Icon as Icon2, Tooltip } from "@uniformdev/design-system";
|
|
699
700
|
import { jsx as jsx11, jsxs as jsxs4 } from "@emotion/react/jsx-runtime";
|
|
701
|
+
var styles = {
|
|
702
|
+
dimensionValueWrapper: css4`
|
|
703
|
+
white-space: normal;
|
|
704
|
+
overflow: hidden;
|
|
705
|
+
`,
|
|
706
|
+
dimensionName: css4`
|
|
707
|
+
color: var(--gray-500);
|
|
708
|
+
display: flex;
|
|
709
|
+
align-items: center;
|
|
710
|
+
gap: var(--spacing-xs);
|
|
711
|
+
`,
|
|
712
|
+
dimensionValue: css4`
|
|
713
|
+
color: var(--gray-700);
|
|
714
|
+
text-overflow: ellipsis;
|
|
715
|
+
overflow: hidden;
|
|
716
|
+
white-space: nowrap;
|
|
717
|
+
`
|
|
718
|
+
};
|
|
700
719
|
function DimensionValue({ displayName }) {
|
|
720
|
+
var _a;
|
|
701
721
|
const { type, name } = dimensionDisplayName(displayName);
|
|
702
|
-
|
|
703
|
-
|
|
704
|
-
{
|
|
705
|
-
|
|
706
|
-
|
|
707
|
-
|
|
708
|
-
|
|
709
|
-
|
|
710
|
-
type ? /* @__PURE__ */ jsxs4(
|
|
711
|
-
"small",
|
|
712
|
-
{
|
|
713
|
-
css: { color: "var(--gray-500)", display: "flex", alignItems: "center", gap: "var(--spacing-xs)" },
|
|
714
|
-
children: [
|
|
715
|
-
type ? /* @__PURE__ */ jsx11(Icon2, { icon: dimensionIcon(type), iconColor: "currentColor", size: 16 }) : null,
|
|
716
|
-
/* @__PURE__ */ jsx11("span", { "data-testid": "dimension-name", children: type })
|
|
717
|
-
]
|
|
718
|
-
}
|
|
719
|
-
) : null,
|
|
720
|
-
/* @__PURE__ */ jsx11("div", { css: { color: "var(--gray-700)" }, "data-testid": "dimension-value", children: name != null ? name : type })
|
|
721
|
-
]
|
|
722
|
-
}
|
|
723
|
-
);
|
|
722
|
+
const tooltip = (_a = name != null ? name : type) != null ? _a : "";
|
|
723
|
+
return /* @__PURE__ */ jsxs4("div", { css: styles.dimensionValueWrapper, children: [
|
|
724
|
+
type ? /* @__PURE__ */ jsxs4("small", { css: styles.dimensionName, children: [
|
|
725
|
+
type ? /* @__PURE__ */ jsx11(Icon2, { icon: dimensionIcon(type), iconColor: "currentColor", size: 16 }) : null,
|
|
726
|
+
/* @__PURE__ */ jsx11("span", { "data-testid": "dimension-name", children: type })
|
|
727
|
+
] }) : null,
|
|
728
|
+
/* @__PURE__ */ jsx11(Tooltip, { title: tooltip, children: /* @__PURE__ */ jsx11("div", { css: styles.dimensionValue, "data-testid": "dimension-value", children: name != null ? name : type }) })
|
|
729
|
+
] });
|
|
724
730
|
}
|
|
725
731
|
|
|
726
732
|
// src/components/DimensionMenu/DimensionSingleValue.tsx
|
|
@@ -905,8 +911,8 @@ import { CgChevronRight } from "@react-icons/all-files/cg/CgChevronRight";
|
|
|
905
911
|
import { Icon as Icon3 } from "@uniformdev/design-system";
|
|
906
912
|
|
|
907
913
|
// src/components/EditLink/EditLink.styles.ts
|
|
908
|
-
import { css as
|
|
909
|
-
var editLink =
|
|
914
|
+
import { css as css5 } from "@emotion/react";
|
|
915
|
+
var editLink = css5`
|
|
910
916
|
display: flex;
|
|
911
917
|
align-items: center;
|
|
912
918
|
font-weight: var(--fw-bold);
|
|
@@ -939,7 +945,7 @@ var EditLink = ({ linkTo, name, linkText = `Edit ${name} Component` }) => {
|
|
|
939
945
|
};
|
|
940
946
|
|
|
941
947
|
// src/components/EnrichmentTag/EnrichmentTag.tsx
|
|
942
|
-
import { css as
|
|
948
|
+
import { css as css6 } from "@emotion/react";
|
|
943
949
|
import { CgCloseO } from "@react-icons/all-files/cg/CgCloseO";
|
|
944
950
|
import { CgMathMinus } from "@react-icons/all-files/cg/CgMathMinus";
|
|
945
951
|
import { CgMathPlus } from "@react-icons/all-files/cg/CgMathPlus";
|
|
@@ -956,7 +962,7 @@ import {
|
|
|
956
962
|
import { produce } from "immer";
|
|
957
963
|
import { useMemo as useMemo2, useState as useState6 } from "react";
|
|
958
964
|
import { Fragment as Fragment5, jsx as jsx16, jsxs as jsxs8 } from "@emotion/react/jsx-runtime";
|
|
959
|
-
var addEnrichmentLink =
|
|
965
|
+
var addEnrichmentLink = css6`
|
|
960
966
|
flex: 2;
|
|
961
967
|
display: flex;
|
|
962
968
|
width: 50%;
|
|
@@ -1145,7 +1151,7 @@ var NoEnrichmentsView = ({ contextConfig }) => /* @__PURE__ */ jsx16(Callout2, {
|
|
|
1145
1151
|
var getCappedValue = (value, maxCap = 100, minCap = 0) => {
|
|
1146
1152
|
return Math.max(Math.min(value, maxCap), minCap);
|
|
1147
1153
|
};
|
|
1148
|
-
var scoreCounterMinusButtonStyles =
|
|
1154
|
+
var scoreCounterMinusButtonStyles = css6`
|
|
1149
1155
|
position: absolute;
|
|
1150
1156
|
bottom: 0.875rem;
|
|
1151
1157
|
left: var(--spacing-sm);
|
|
@@ -1158,7 +1164,7 @@ var scoreCounterMinusButtonStyles = css5`
|
|
|
1158
1164
|
border: 1px solid var(--gray-300);
|
|
1159
1165
|
border-radius: var(--rounded-full);
|
|
1160
1166
|
`;
|
|
1161
|
-
var scoreCounterPlusButtonStyles =
|
|
1167
|
+
var scoreCounterPlusButtonStyles = css6`
|
|
1162
1168
|
${scoreCounterMinusButtonStyles}
|
|
1163
1169
|
left: auto;
|
|
1164
1170
|
right: var(--spacing-sm);
|
|
@@ -1322,7 +1328,7 @@ function opHasRhs(op) {
|
|
|
1322
1328
|
}
|
|
1323
1329
|
|
|
1324
1330
|
// src/components/PersonalizationCriteria/PersonalizationCriteriaStatic.tsx
|
|
1325
|
-
import { css as
|
|
1331
|
+
import { css as css8 } from "@emotion/react";
|
|
1326
1332
|
import { CgCloseO as CgCloseO2 } from "@react-icons/all-files/cg/CgCloseO";
|
|
1327
1333
|
import {
|
|
1328
1334
|
AddListButton as AddListButton3,
|
|
@@ -1332,19 +1338,20 @@ import {
|
|
|
1332
1338
|
Input as Input2,
|
|
1333
1339
|
InputInlineSelect,
|
|
1334
1340
|
InputSelect as InputSelect2,
|
|
1335
|
-
Paragraph
|
|
1341
|
+
Paragraph,
|
|
1342
|
+
VerticalRhythm
|
|
1336
1343
|
} from "@uniformdev/design-system";
|
|
1337
1344
|
import { produce as produce2 } from "immer";
|
|
1338
1345
|
|
|
1339
1346
|
// src/components/PersonalizationCriteria/PersonalizationCriteriaStatic.styles.ts
|
|
1340
|
-
import { css as
|
|
1347
|
+
import { css as css7 } from "@emotion/react";
|
|
1341
1348
|
var spaceBetweenCriteriaItems = "6rem";
|
|
1342
|
-
var criteriaItem =
|
|
1349
|
+
var criteriaItem = css7`
|
|
1343
1350
|
position: relative;
|
|
1344
1351
|
padding: var(--spacing-md) var(--spacing-base);
|
|
1345
1352
|
border: 1px solid var(--gray-300);
|
|
1346
|
-
box-shadow: var(--
|
|
1347
|
-
background-color: white;
|
|
1353
|
+
box-shadow: var(--elevation-200);
|
|
1354
|
+
background-color: var(--white);
|
|
1348
1355
|
border-radius: var(--rounded-base);
|
|
1349
1356
|
margin-top: ${spaceBetweenCriteriaItems};
|
|
1350
1357
|
display: flex;
|
|
@@ -1361,13 +1368,13 @@ var criteriaItem = css6`
|
|
|
1361
1368
|
}
|
|
1362
1369
|
|
|
1363
1370
|
&:first-of-type {
|
|
1364
|
-
margin-top:
|
|
1371
|
+
margin-top: 0;
|
|
1365
1372
|
&:before {
|
|
1366
1373
|
display: none;
|
|
1367
1374
|
}
|
|
1368
1375
|
}
|
|
1369
1376
|
`;
|
|
1370
|
-
var criteriaItemInner =
|
|
1377
|
+
var criteriaItemInner = css7`
|
|
1371
1378
|
display: flex;
|
|
1372
1379
|
row-gap: var(--spacing-base);
|
|
1373
1380
|
column-gap: var(--spacing-xs);
|
|
@@ -1375,23 +1382,23 @@ var criteriaItemInner = css6`
|
|
|
1375
1382
|
flex-wrap: wrap;
|
|
1376
1383
|
margin-right: var(--spacing-base);
|
|
1377
1384
|
`;
|
|
1378
|
-
var criteriaWrapper =
|
|
1385
|
+
var criteriaWrapper = css7`
|
|
1379
1386
|
width: 100%;
|
|
1380
1387
|
display: flex;
|
|
1381
1388
|
align-items: stretch;
|
|
1382
1389
|
position: relative;
|
|
1383
1390
|
`;
|
|
1384
|
-
var criteriaOperandWrapper =
|
|
1391
|
+
var criteriaOperandWrapper = css7`
|
|
1385
1392
|
flex: 2;
|
|
1386
1393
|
height: 52px;
|
|
1387
1394
|
min-width: 200px;
|
|
1388
1395
|
`;
|
|
1389
|
-
var criteriaOperatorWrapper =
|
|
1396
|
+
var criteriaOperatorWrapper = css7`
|
|
1390
1397
|
flex: 1;
|
|
1391
1398
|
flex-wrap: nowrap;
|
|
1392
1399
|
min-width: 80px;
|
|
1393
1400
|
`;
|
|
1394
|
-
var expand =
|
|
1401
|
+
var expand = css7`
|
|
1395
1402
|
height: 100%;
|
|
1396
1403
|
width: 100%;
|
|
1397
1404
|
`;
|
|
@@ -1455,195 +1462,197 @@ var PersonalizationCriteriaStatic = ({
|
|
|
1455
1462
|
children: /* @__PURE__ */ jsx17(Heading2, { level: 5, withMarginBottom: false, children: "Personalization Variation" })
|
|
1456
1463
|
}
|
|
1457
1464
|
) : null,
|
|
1458
|
-
|
|
1459
|
-
|
|
1460
|
-
|
|
1461
|
-
|
|
1462
|
-
|
|
1463
|
-
|
|
1464
|
-
|
|
1465
|
-
|
|
1466
|
-
|
|
1467
|
-
|
|
1468
|
-
/* @__PURE__ */ jsxs9("div", { css:
|
|
1465
|
+
/* @__PURE__ */ jsxs9(VerticalRhythm, { children: [
|
|
1466
|
+
(components == null ? void 0 : components.CustomVariantName) ? /* @__PURE__ */ jsx17(components.CustomVariantName, {}) : null,
|
|
1467
|
+
(components == null ? void 0 : components.ControlPercentage) ? /* @__PURE__ */ jsx17(components.ControlPercentage, {}) : null,
|
|
1468
|
+
!currentValue.crit.length ? /* @__PURE__ */ jsx17(Callout3, { title: "Default variant", type: "info", css: { marginBlock: "var(--spacing-base)" }, children: /* @__PURE__ */ jsx17(Paragraph, { children: 'This personalized variant has no match criteria and will be shown to any visitor that does not match any preceding variants. Ensure that default variants come last in the variant list. Personalize this variant by clicking "Add Criteria" to get started.' }) }) : /* @__PURE__ */ jsx17("div", { children: currentValue.crit.map((currentCriteria, index) => {
|
|
1469
|
+
var _a2, _b, _c, _d, _e, _f, _g, _h;
|
|
1470
|
+
const critHasLhs = ((_a2 = currentCriteria.l) == null ? void 0 : _a2.length) > 0;
|
|
1471
|
+
const critHasRhs = opHasRhs(currentCriteria.op);
|
|
1472
|
+
const selectedValueIsQuirk = "t" in currentCriteria && currentCriteria.t === "q";
|
|
1473
|
+
const currentDimension = selectedValueIsQuirk ? void 0 : dimensions.dimIndex[currentCriteria.l];
|
|
1474
|
+
const currentQuirk = selectedValueIsQuirk ? quirks == null ? void 0 : quirks.find((q) => q.id === currentCriteria.l) : void 0;
|
|
1475
|
+
return /* @__PURE__ */ jsxs9("div", { css: criteriaItem, "data-testid": "criteria-container", children: [
|
|
1476
|
+
/* @__PURE__ */ jsxs9("div", { css: criteriaItemInner, className: "criteriaItemInner", children: [
|
|
1477
|
+
/* @__PURE__ */ jsx17(
|
|
1478
|
+
"div",
|
|
1479
|
+
{
|
|
1480
|
+
css: [criteriaWrapper, criteriaOperandWrapper],
|
|
1481
|
+
className: "criteria-wrapper",
|
|
1482
|
+
"data-testid": "select-criteria",
|
|
1483
|
+
children: /* @__PURE__ */ jsx17(
|
|
1484
|
+
DimensionMenu,
|
|
1485
|
+
{
|
|
1486
|
+
errorMessage: (_b = errors.lhs) == null ? void 0 : _b[index],
|
|
1487
|
+
css: expand,
|
|
1488
|
+
styles: { control: (base) => ({ ...base, height: "100%" }) },
|
|
1489
|
+
dimensions: dimensions.dimensions,
|
|
1490
|
+
quirks,
|
|
1491
|
+
onChange: (selection) => {
|
|
1492
|
+
if (!selection) {
|
|
1493
|
+
return;
|
|
1494
|
+
}
|
|
1495
|
+
if ("dim" in selection) {
|
|
1496
|
+
const validOperators = getValidCriteriaOperatorsFor(selection.category);
|
|
1497
|
+
const existingOpRemainsValid = !("t" in currentCriteria && currentCriteria.t === "q") && validOperators.some((op) => op.value === currentCriteria.op);
|
|
1498
|
+
const newCriteria = {
|
|
1499
|
+
...currentCriteria,
|
|
1500
|
+
l: selection.dim,
|
|
1501
|
+
t: void 0,
|
|
1502
|
+
op: existingOpRemainsValid ? currentCriteria.op : ">",
|
|
1503
|
+
r: existingOpRemainsValid ? currentCriteria.r : 0,
|
|
1504
|
+
rDim: existingOpRemainsValid ? currentCriteria.rDim : void 0
|
|
1505
|
+
};
|
|
1506
|
+
update(newCriteria, index);
|
|
1507
|
+
} else {
|
|
1508
|
+
update({ ...currentCriteria, l: selection.id, t: "q", op: "=", r: "" }, index);
|
|
1509
|
+
}
|
|
1510
|
+
},
|
|
1511
|
+
value: currentDimension != null ? currentDimension : currentQuirk,
|
|
1512
|
+
onMenuOpen,
|
|
1513
|
+
onMenuClose
|
|
1514
|
+
}
|
|
1515
|
+
)
|
|
1516
|
+
}
|
|
1517
|
+
),
|
|
1518
|
+
/* @__PURE__ */ jsx17(
|
|
1519
|
+
"div",
|
|
1520
|
+
{
|
|
1521
|
+
css: [criteriaWrapper, criteriaOperatorWrapper],
|
|
1522
|
+
className: "criteria-wrapper",
|
|
1523
|
+
"data-testid": "select-operator",
|
|
1524
|
+
children: /* @__PURE__ */ jsx17(
|
|
1525
|
+
CriteriaOperatorMenu,
|
|
1526
|
+
{
|
|
1527
|
+
name: `op-${index}`,
|
|
1528
|
+
css: expand,
|
|
1529
|
+
styles: { control: (base) => ({ ...base, height: "100%" }) },
|
|
1530
|
+
value: currentCriteria.op,
|
|
1531
|
+
rhsType: currentQuirk ? "QUIRK" : currentDimension == null ? void 0 : currentDimension.category,
|
|
1532
|
+
onChange: (op) => {
|
|
1533
|
+
if (op === "+" || op === "-") {
|
|
1534
|
+
update({ ...currentCriteria, op, r: void 0, rDim: void 0 }, index);
|
|
1535
|
+
} else {
|
|
1536
|
+
update({ ...currentCriteria, op }, index);
|
|
1537
|
+
}
|
|
1538
|
+
},
|
|
1539
|
+
onMenuOpen,
|
|
1540
|
+
onMenuClose
|
|
1541
|
+
}
|
|
1542
|
+
)
|
|
1543
|
+
}
|
|
1544
|
+
),
|
|
1545
|
+
critHasRhs ? /* @__PURE__ */ jsx17(
|
|
1546
|
+
"div",
|
|
1547
|
+
{
|
|
1548
|
+
css: [criteriaWrapper, criteriaOperandWrapper],
|
|
1549
|
+
className: "criteria-wrapper",
|
|
1550
|
+
"data-testid": "select-match-criteria",
|
|
1551
|
+
children: currentQuirk ? /* @__PURE__ */ jsx17(
|
|
1552
|
+
"div",
|
|
1553
|
+
{
|
|
1554
|
+
css: css8`
|
|
1555
|
+
width: 100%;
|
|
1556
|
+
// InputSelect wrapper is unstylable so need a descendant selector
|
|
1557
|
+
// to full-width it
|
|
1558
|
+
& > * {
|
|
1559
|
+
width: 100%;
|
|
1560
|
+
}
|
|
1561
|
+
`,
|
|
1562
|
+
children: currentQuirk.options ? /* @__PURE__ */ jsx17(
|
|
1563
|
+
InputSelect2,
|
|
1564
|
+
{
|
|
1565
|
+
label: "quirk match value",
|
|
1566
|
+
showLabel: false,
|
|
1567
|
+
value: (_c = currentCriteria.r) != null ? _c : "",
|
|
1568
|
+
errorMessage: (_d = errors.rhs) == null ? void 0 : _d[index],
|
|
1569
|
+
onChange: (e) => update({ ...currentCriteria, r: e.currentTarget.value }, index),
|
|
1570
|
+
options: [
|
|
1571
|
+
{ label: "Select\u2026", value: "" },
|
|
1572
|
+
...currentQuirk.options.map((o) => ({ label: o.name, value: o.value }))
|
|
1573
|
+
]
|
|
1574
|
+
}
|
|
1575
|
+
) : /* @__PURE__ */ jsx17(
|
|
1576
|
+
Input2,
|
|
1577
|
+
{
|
|
1578
|
+
type: "text",
|
|
1579
|
+
label: "quirk match value",
|
|
1580
|
+
showLabel: false,
|
|
1581
|
+
value: (_e = currentCriteria.r) != null ? _e : "",
|
|
1582
|
+
errorMessage: (_f = errors.rhs) == null ? void 0 : _f[index],
|
|
1583
|
+
onChange: (e) => update({ ...currentCriteria, r: e.currentTarget.value }, index),
|
|
1584
|
+
placeholder: "Enter a value"
|
|
1585
|
+
}
|
|
1586
|
+
)
|
|
1587
|
+
}
|
|
1588
|
+
) : /* @__PURE__ */ jsx17(
|
|
1589
|
+
CriteriaMatchMenu,
|
|
1590
|
+
{
|
|
1591
|
+
errorMessage: (_g = errors.rhs) == null ? void 0 : _g[index],
|
|
1592
|
+
css: expand,
|
|
1593
|
+
styles: { control: (base) => ({ ...base, height: "100%" }) },
|
|
1594
|
+
criteriaMatch: currentCriteria,
|
|
1595
|
+
onChange: (match) => {
|
|
1596
|
+
update(match, index);
|
|
1597
|
+
},
|
|
1598
|
+
isDisabled: !critHasLhs,
|
|
1599
|
+
dimensions,
|
|
1600
|
+
onMenuOpen,
|
|
1601
|
+
onMenuClose
|
|
1602
|
+
}
|
|
1603
|
+
)
|
|
1604
|
+
}
|
|
1605
|
+
) : null
|
|
1606
|
+
] }),
|
|
1469
1607
|
/* @__PURE__ */ jsx17(
|
|
1470
|
-
"
|
|
1608
|
+
"button",
|
|
1471
1609
|
{
|
|
1472
|
-
|
|
1473
|
-
|
|
1474
|
-
|
|
1475
|
-
|
|
1476
|
-
|
|
1477
|
-
|
|
1478
|
-
errorMessage: (_b = errors.lhs) == null ? void 0 : _b[index],
|
|
1479
|
-
css: expand,
|
|
1480
|
-
styles: { control: (base) => ({ ...base, height: "100%" }) },
|
|
1481
|
-
dimensions: dimensions.dimensions,
|
|
1482
|
-
quirks,
|
|
1483
|
-
onChange: (selection) => {
|
|
1484
|
-
if (!selection) {
|
|
1485
|
-
return;
|
|
1486
|
-
}
|
|
1487
|
-
if ("dim" in selection) {
|
|
1488
|
-
const validOperators = getValidCriteriaOperatorsFor(selection.category);
|
|
1489
|
-
const existingOpRemainsValid = !("t" in currentCriteria && currentCriteria.t === "q") && validOperators.some((op) => op.value === currentCriteria.op);
|
|
1490
|
-
const newCriteria = {
|
|
1491
|
-
...currentCriteria,
|
|
1492
|
-
l: selection.dim,
|
|
1493
|
-
t: void 0,
|
|
1494
|
-
op: existingOpRemainsValid ? currentCriteria.op : ">",
|
|
1495
|
-
r: existingOpRemainsValid ? currentCriteria.r : 0,
|
|
1496
|
-
rDim: existingOpRemainsValid ? currentCriteria.rDim : void 0
|
|
1497
|
-
};
|
|
1498
|
-
update(newCriteria, index);
|
|
1499
|
-
} else {
|
|
1500
|
-
update({ ...currentCriteria, l: selection.id, t: "q", op: "=", r: "" }, index);
|
|
1501
|
-
}
|
|
1502
|
-
},
|
|
1503
|
-
value: currentDimension != null ? currentDimension : currentQuirk,
|
|
1504
|
-
onMenuOpen,
|
|
1505
|
-
onMenuClose
|
|
1506
|
-
}
|
|
1507
|
-
)
|
|
1610
|
+
type: "button",
|
|
1611
|
+
onClick: () => removeFromList(index),
|
|
1612
|
+
title: `Delete Personalization`,
|
|
1613
|
+
css: { backgroundColor: "transparent", backgroundImage: "none", borderWidth: 0 },
|
|
1614
|
+
"data-testid": "button-delete",
|
|
1615
|
+
children: /* @__PURE__ */ jsx17(Icon5, { icon: CgCloseO2, iconColor: "red", size: "1.5rem" })
|
|
1508
1616
|
}
|
|
1509
1617
|
),
|
|
1510
|
-
/* @__PURE__ */ jsx17(
|
|
1618
|
+
index > 0 ? /* @__PURE__ */ jsx17(
|
|
1511
1619
|
"div",
|
|
1512
1620
|
{
|
|
1513
|
-
|
|
1514
|
-
|
|
1515
|
-
|
|
1621
|
+
className: "criteria-group-operation",
|
|
1622
|
+
css: {
|
|
1623
|
+
position: "absolute",
|
|
1624
|
+
top: "-4rem",
|
|
1625
|
+
transform: "translateX(calc(1.5rem - 50%))"
|
|
1626
|
+
},
|
|
1516
1627
|
children: /* @__PURE__ */ jsx17(
|
|
1517
|
-
|
|
1518
|
-
{
|
|
1519
|
-
name: `op-${index}`,
|
|
1520
|
-
css: expand,
|
|
1521
|
-
styles: { control: (base) => ({ ...base, height: "100%" }) },
|
|
1522
|
-
value: currentCriteria.op,
|
|
1523
|
-
rhsType: currentQuirk ? "QUIRK" : currentDimension == null ? void 0 : currentDimension.category,
|
|
1524
|
-
onChange: (op) => {
|
|
1525
|
-
if (op === "+" || op === "-") {
|
|
1526
|
-
update({ ...currentCriteria, op, r: void 0, rDim: void 0 }, index);
|
|
1527
|
-
} else {
|
|
1528
|
-
update({ ...currentCriteria, op }, index);
|
|
1529
|
-
}
|
|
1530
|
-
},
|
|
1531
|
-
onMenuOpen,
|
|
1532
|
-
onMenuClose
|
|
1533
|
-
}
|
|
1534
|
-
)
|
|
1535
|
-
}
|
|
1536
|
-
),
|
|
1537
|
-
critHasRhs ? /* @__PURE__ */ jsx17(
|
|
1538
|
-
"div",
|
|
1539
|
-
{
|
|
1540
|
-
css: [criteriaWrapper, criteriaOperandWrapper],
|
|
1541
|
-
className: "criteria-wrapper",
|
|
1542
|
-
"data-testid": "select-match-criteria",
|
|
1543
|
-
children: currentQuirk ? /* @__PURE__ */ jsx17(
|
|
1544
|
-
"div",
|
|
1545
|
-
{
|
|
1546
|
-
css: css7`
|
|
1547
|
-
width: 100%;
|
|
1548
|
-
// InputSelect wrapper is unstylable so need a descendant selector
|
|
1549
|
-
// to full-width it
|
|
1550
|
-
& > * {
|
|
1551
|
-
width: 100%;
|
|
1552
|
-
}
|
|
1553
|
-
`,
|
|
1554
|
-
children: currentQuirk.options ? /* @__PURE__ */ jsx17(
|
|
1555
|
-
InputSelect2,
|
|
1556
|
-
{
|
|
1557
|
-
label: "quirk match value",
|
|
1558
|
-
showLabel: false,
|
|
1559
|
-
value: (_c = currentCriteria.r) != null ? _c : "",
|
|
1560
|
-
errorMessage: (_d = errors.rhs) == null ? void 0 : _d[index],
|
|
1561
|
-
onChange: (e) => update({ ...currentCriteria, r: e.currentTarget.value }, index),
|
|
1562
|
-
options: [
|
|
1563
|
-
{ label: "Select\u2026", value: "" },
|
|
1564
|
-
...currentQuirk.options.map((o) => ({ label: o.name, value: o.value }))
|
|
1565
|
-
]
|
|
1566
|
-
}
|
|
1567
|
-
) : /* @__PURE__ */ jsx17(
|
|
1568
|
-
Input2,
|
|
1569
|
-
{
|
|
1570
|
-
type: "text",
|
|
1571
|
-
label: "quirk match value",
|
|
1572
|
-
showLabel: false,
|
|
1573
|
-
value: (_e = currentCriteria.r) != null ? _e : "",
|
|
1574
|
-
errorMessage: (_f = errors.rhs) == null ? void 0 : _f[index],
|
|
1575
|
-
onChange: (e) => update({ ...currentCriteria, r: e.currentTarget.value }, index),
|
|
1576
|
-
placeholder: "Enter a value"
|
|
1577
|
-
}
|
|
1578
|
-
)
|
|
1579
|
-
}
|
|
1580
|
-
) : /* @__PURE__ */ jsx17(
|
|
1581
|
-
CriteriaMatchMenu,
|
|
1628
|
+
InputInlineSelect,
|
|
1582
1629
|
{
|
|
1583
|
-
|
|
1584
|
-
|
|
1585
|
-
|
|
1586
|
-
|
|
1587
|
-
|
|
1588
|
-
|
|
1589
|
-
|
|
1590
|
-
|
|
1591
|
-
|
|
1592
|
-
|
|
1593
|
-
onMenuClose
|
|
1630
|
+
"data-testid": "dropdown-button-combine",
|
|
1631
|
+
disabled: index > 1,
|
|
1632
|
+
value: (_h = currentValue.op) != null ? _h : "&",
|
|
1633
|
+
options: [
|
|
1634
|
+
{ label: "AND", value: "&" },
|
|
1635
|
+
{ label: "OR", value: "|" }
|
|
1636
|
+
],
|
|
1637
|
+
onChange: (v) => {
|
|
1638
|
+
setOp(v.value);
|
|
1639
|
+
}
|
|
1594
1640
|
}
|
|
1595
1641
|
)
|
|
1596
1642
|
}
|
|
1597
1643
|
) : null
|
|
1598
|
-
] })
|
|
1599
|
-
|
|
1600
|
-
|
|
1601
|
-
|
|
1602
|
-
|
|
1603
|
-
|
|
1604
|
-
|
|
1605
|
-
|
|
1606
|
-
|
|
1607
|
-
|
|
1608
|
-
|
|
1609
|
-
|
|
1610
|
-
index > 0 ? /* @__PURE__ */ jsx17(
|
|
1611
|
-
"div",
|
|
1612
|
-
{
|
|
1613
|
-
className: "criteria-group-operation",
|
|
1614
|
-
css: {
|
|
1615
|
-
position: "absolute",
|
|
1616
|
-
top: "-4rem",
|
|
1617
|
-
transform: "translateX(calc(1.5rem - 50%))"
|
|
1618
|
-
},
|
|
1619
|
-
children: /* @__PURE__ */ jsx17(
|
|
1620
|
-
InputInlineSelect,
|
|
1621
|
-
{
|
|
1622
|
-
"data-testid": "dropdown-button-combine",
|
|
1623
|
-
disabled: index > 1,
|
|
1624
|
-
value: (_h = currentValue.op) != null ? _h : "&",
|
|
1625
|
-
options: [
|
|
1626
|
-
{ label: "AND", value: "&" },
|
|
1627
|
-
{ label: "OR", value: "|" }
|
|
1628
|
-
],
|
|
1629
|
-
onChange: (v) => {
|
|
1630
|
-
setOp(v.value);
|
|
1631
|
-
}
|
|
1632
|
-
}
|
|
1633
|
-
)
|
|
1634
|
-
}
|
|
1635
|
-
) : null
|
|
1636
|
-
] }, index);
|
|
1637
|
-
}) }),
|
|
1638
|
-
dimensions.dimensions.length === 0 && !(quirks == null ? void 0 : quirks.length) ? (components == null ? void 0 : components.NoDimensionsDefined) ? /* @__PURE__ */ jsx17(components.NoDimensionsDefined, {}) : /* @__PURE__ */ jsx17(Callout3, { title: "Dimensions", type: "info", css: { marginBlock: "var(--spacing-base)" }, children: /* @__PURE__ */ jsx17("p", { children: "You do not have any dimensions configured." }) }) : /* @__PURE__ */ jsx17(
|
|
1639
|
-
AddListButton3,
|
|
1640
|
-
{
|
|
1641
|
-
"data-testid": "button-add-criteria",
|
|
1642
|
-
className: "add-more",
|
|
1643
|
-
buttonText: "Add Criteria",
|
|
1644
|
-
onButtonClick: addToList
|
|
1645
|
-
}
|
|
1646
|
-
)
|
|
1644
|
+
] }, index);
|
|
1645
|
+
}) }),
|
|
1646
|
+
dimensions.dimensions.length === 0 && !(quirks == null ? void 0 : quirks.length) ? (components == null ? void 0 : components.NoDimensionsDefined) ? /* @__PURE__ */ jsx17(components.NoDimensionsDefined, {}) : /* @__PURE__ */ jsx17(Callout3, { title: "Dimensions", type: "info", css: { marginBlock: "var(--spacing-base)" }, children: /* @__PURE__ */ jsx17("p", { children: "You do not have any dimensions configured." }) }) : /* @__PURE__ */ jsx17(
|
|
1647
|
+
AddListButton3,
|
|
1648
|
+
{
|
|
1649
|
+
"data-testid": "button-add-criteria",
|
|
1650
|
+
className: "add-more",
|
|
1651
|
+
buttonText: "Add Criteria",
|
|
1652
|
+
onButtonClick: addToList
|
|
1653
|
+
}
|
|
1654
|
+
)
|
|
1655
|
+
] })
|
|
1647
1656
|
] });
|
|
1648
1657
|
};
|
|
1649
1658
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@uniformdev/context-ui",
|
|
3
|
-
"version": "20.36.1
|
|
3
|
+
"version": "20.36.1",
|
|
4
4
|
"description": "React-based functionality and components for Uniform Context",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE.txt",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -29,8 +29,8 @@
|
|
|
29
29
|
"dependencies": {
|
|
30
30
|
"@emotion/react": "11.13.5",
|
|
31
31
|
"@react-icons/all-files": "https://github.com/react-icons/react-icons/releases/download/v5.5.0/react-icons-all-files-5.5.0.tgz",
|
|
32
|
-
"@uniformdev/context": "20.36.1
|
|
33
|
-
"@uniformdev/design-system": "20.36.1
|
|
32
|
+
"@uniformdev/context": "20.36.1",
|
|
33
|
+
"@uniformdev/design-system": "20.36.1",
|
|
34
34
|
"immer": "10.1.1",
|
|
35
35
|
"react-beautiful-dnd": "13.1.1",
|
|
36
36
|
"react-select": "5.10.0",
|
|
@@ -64,5 +64,5 @@
|
|
|
64
64
|
"publishConfig": {
|
|
65
65
|
"access": "public"
|
|
66
66
|
},
|
|
67
|
-
"gitHead": "
|
|
67
|
+
"gitHead": "cced31b4edaff96f2eec23f2336ee0873663066a"
|
|
68
68
|
}
|