alicia-design-system 1.76.4 → 1.76.6

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.
Files changed (5) hide show
  1. package/dist/cjs/alicia/common/Card/CardV2.js +5 -5
  2. package/dist/cjs/alicia/common/List/List.js +1 -1
  3. package/dist/esm/alicia/common/Card/CardV2.js +5 -5
  4. package/dist/esm/alicia/common/List/List.js +1 -1
  5. package/package.json +1 -1
package/dist/cjs/alicia/common/Card/CardV2.js CHANGED
@@ -19,15 +19,15 @@ const CardV2 = ({ header = undefined, headerIcon = undefined, tag = undefined, p
19
19
  } : {
20
20
  mt: (0, polished_1.rem)(16),
21
21
  mb: (0, polished_1.rem)((checklist === null || checklist === void 0 ? void 0 : checklist.isVisible) ? 8 : 0)
22
- } }, { children: (0, jsx_runtime_1.jsx)(react_1.Text, { color: (_e = header === null || header === void 0 ? void 0 : header.descriptionColor) !== null && _e !== void 0 ? _e : "#000000", fontSize: (0, polished_1.rem)(16), lineHeight: (0, polished_1.rem)(24), mb: (0, polished_1.rem)((checklist === null || checklist === void 0 ? void 0 : checklist.isVisible) ? 8 : 0), dangerouslySetInnerHTML: {
22
+ } }, { children: (0, jsx_runtime_1.jsx)(react_1.Text, { color: (_e = header === null || header === void 0 ? void 0 : header.descriptionColor) !== null && _e !== void 0 ? _e : "#000000", fontSize: (0, polished_1.rem)(18), lineHeight: (0, polished_1.rem)(24), mb: (0, polished_1.rem)((checklist === null || checklist === void 0 ? void 0 : checklist.isVisible) ? 8 : 0), dangerouslySetInnerHTML: {
23
23
  __html: header.description
24
- } }) }))), (checklist === null || checklist === void 0 ? void 0 : checklist.isVisible) && Boolean((_f = checklist === null || checklist === void 0 ? void 0 : checklist.data) === null || _f === void 0 ? void 0 : _f.length) && (0, jsx_runtime_1.jsx)(react_1.Flex, Object.assign({ direction: "column" }, { children: (_g = checklist === null || checklist === void 0 ? void 0 : checklist.data) === null || _g === void 0 ? void 0 : _g.map((list, index) => ((0, jsx_runtime_1.jsxs)(react_1.Flex, Object.assign({ mt: (0, polished_1.rem)((index === 0) ? 18 : 12), direction: "row", fontSize: (0, polished_1.rem)(14), fontWeight: 400, lineHeight: (0, polished_1.rem)(20) }, { children: [(0, jsx_runtime_1.jsx)(react_1.Box, Object.assign({ mr: (0, polished_1.rem)(8) }, { children: (0, jsx_runtime_1.jsx)(react_1.Icon, { as: list.icon, w: (0, polished_1.rem)(14), height: (0, polished_1.rem)(14) }) })), (0, jsx_runtime_1.jsx)(react_1.Text, { fontSize: (0, polished_1.rem)(16), lineHeight: (0, polished_1.rem)(24), dangerouslySetInnerHTML: {
24
+ } }) }))), (checklist === null || checklist === void 0 ? void 0 : checklist.isVisible) && Boolean((_f = checklist === null || checklist === void 0 ? void 0 : checklist.data) === null || _f === void 0 ? void 0 : _f.length) && (0, jsx_runtime_1.jsx)(react_1.Flex, Object.assign({ direction: "column" }, { children: (_g = checklist === null || checklist === void 0 ? void 0 : checklist.data) === null || _g === void 0 ? void 0 : _g.map((list, index) => ((0, jsx_runtime_1.jsxs)(react_1.Flex, Object.assign({ mt: (0, polished_1.rem)((index === 0) ? 18 : 12), direction: "row", fontSize: (0, polished_1.rem)(14), fontWeight: 400, lineHeight: (0, polished_1.rem)(20) }, { children: [(0, jsx_runtime_1.jsx)(react_1.Box, Object.assign({ mr: (0, polished_1.rem)(8) }, { children: (0, jsx_runtime_1.jsx)(react_1.Icon, { as: list.icon, w: (0, polished_1.rem)(14), height: (0, polished_1.rem)(14) }) })), (0, jsx_runtime_1.jsx)(react_1.Text, { fontSize: (0, polished_1.rem)(18), lineHeight: (0, polished_1.rem)(24), dangerouslySetInnerHTML: {
25
25
  __html: list.label
26
- } })] }), list.id))) })), ((checklist === null || checklist === void 0 ? void 0 : checklist.isVisible) && (addons === null || addons === void 0 ? void 0 : addons.isVisible)) && ((0, jsx_runtime_1.jsx)(react_1.Divider, { mt: (0, polished_1.rem)(18), mb: (0, polished_1.rem)(16) })), (addons === null || addons === void 0 ? void 0 : addons.isVisible) && Boolean((_h = addons === null || addons === void 0 ? void 0 : addons.data) === null || _h === void 0 ? void 0 : _h.length) && (0, jsx_runtime_1.jsx)(react_1.Flex, Object.assign({ direction: "column" }, { children: (_j = addons === null || addons === void 0 ? void 0 : addons.data) === null || _j === void 0 ? void 0 : _j.map((list, index) => ((0, jsx_runtime_1.jsxs)(react_1.Flex, Object.assign({ mt: (0, polished_1.rem)(((checklist === null || checklist === void 0 ? void 0 : checklist.isVisible) && (addons === null || addons === void 0 ? void 0 : addons.isVisible) && index === 0) ? 0 : (index === 0) ? 18 : 12), direction: "row", width: "100%", alignItems: "center" }, { children: [(0, jsx_runtime_1.jsx)(react_1.Box, Object.assign({ mr: (0, polished_1.rem)(8) }, { children: (0, jsx_runtime_1.jsx)(react_1.Icon, { as: list.icon, w: (0, polished_1.rem)(14), height: (0, polished_1.rem)(14) }) })), (0, jsx_runtime_1.jsxs)(react_1.Flex, Object.assign({ justifyContent: "space-between", direction: "row", width: "inherit", fontSize: (0, polished_1.rem)(14), fontWeight: 400, lineHeight: (0, polished_1.rem)(20) }, { children: [(0, jsx_runtime_1.jsx)(react_1.Text, { fontSize: (0, polished_1.rem)(16), lineHeight: (0, polished_1.rem)(24), dangerouslySetInnerHTML: {
26
+ } })] }), list.id))) })), ((checklist === null || checklist === void 0 ? void 0 : checklist.isVisible) && (addons === null || addons === void 0 ? void 0 : addons.isVisible)) && ((0, jsx_runtime_1.jsx)(react_1.Divider, { mt: (0, polished_1.rem)(18), mb: (0, polished_1.rem)(16) })), (addons === null || addons === void 0 ? void 0 : addons.isVisible) && Boolean((_h = addons === null || addons === void 0 ? void 0 : addons.data) === null || _h === void 0 ? void 0 : _h.length) && (0, jsx_runtime_1.jsx)(react_1.Flex, Object.assign({ direction: "column" }, { children: (_j = addons === null || addons === void 0 ? void 0 : addons.data) === null || _j === void 0 ? void 0 : _j.map((list, index) => ((0, jsx_runtime_1.jsxs)(react_1.Flex, Object.assign({ mt: (0, polished_1.rem)(((checklist === null || checklist === void 0 ? void 0 : checklist.isVisible) && (addons === null || addons === void 0 ? void 0 : addons.isVisible) && index === 0) ? 0 : (index === 0) ? 18 : 12), direction: "row", width: "100%", alignItems: "center" }, { children: [(0, jsx_runtime_1.jsx)(react_1.Box, Object.assign({ mr: (0, polished_1.rem)(8) }, { children: (0, jsx_runtime_1.jsx)(react_1.Icon, { as: list.icon, w: (0, polished_1.rem)(14), height: (0, polished_1.rem)(14) }) })), (0, jsx_runtime_1.jsxs)(react_1.Flex, Object.assign({ justifyContent: "space-between", direction: "row", width: "inherit", fontSize: (0, polished_1.rem)(14), fontWeight: 400, lineHeight: (0, polished_1.rem)(20) }, { children: [(0, jsx_runtime_1.jsx)(react_1.Text, { fontSize: (0, polished_1.rem)(18), lineHeight: (0, polished_1.rem)(24), dangerouslySetInnerHTML: {
27
27
  __html: list.text
28
- } }), (0, jsx_runtime_1.jsx)(react_1.Text, { fontSize: (0, polished_1.rem)(16), lineHeight: (0, polished_1.rem)(24), dangerouslySetInnerHTML: {
28
+ } }), (0, jsx_runtime_1.jsx)(react_1.Text, { fontSize: (0, polished_1.rem)(18), lineHeight: (0, polished_1.rem)(24), dangerouslySetInnerHTML: {
29
29
  __html: list.price
30
- } })] }))] }), list.id))) })), ((_k = readMore === null || readMore === void 0 ? void 0 : readMore.isVisible) !== null && _k !== void 0 ? _k : readMore === null || readMore === void 0 ? void 0 : readMore.isPriceVisible) && ((0, jsx_runtime_1.jsxs)(react_1.Flex, Object.assign({ justifyContent: "space-between", w: !(readMore === null || readMore === void 0 ? void 0 : readMore.isVisible) && (readMore === null || readMore === void 0 ? void 0 : readMore.isPriceVisible) ? "100%" : undefined, mt: (0, polished_1.rem)(16), cursor: "pointer" }, { children: [(readMore === null || readMore === void 0 ? void 0 : readMore.isVisible) && (0, jsx_runtime_1.jsxs)(react_1.Flex, Object.assign({ direction: "row", alignItems: "center", paddingBottom: (0, polished_1.rem)(6), gap: (0, polished_1.rem)(7), borderBottom: "1px solid", sx: (_l = readMore === null || readMore === void 0 ? void 0 : readMore.sx) !== null && _l !== void 0 ? _l : { borderColor: (_m = readMore === null || readMore === void 0 ? void 0 : readMore.color) !== null && _m !== void 0 ? _m : "#00000033" } }, { children: [(0, jsx_runtime_1.jsx)(react_1.Text, Object.assign({ fontSize: (0, polished_1.rem)(16), color: (_o = readMore === null || readMore === void 0 ? void 0 : readMore.color) !== null && _o !== void 0 ? _o : "#000000", lineHeight: (0, polished_1.rem)(24), fontWeight: 400, "data-testid": "read-more", onClick: readMore === null || readMore === void 0 ? void 0 : readMore.action }, { children: readMore === null || readMore === void 0 ? void 0 : readMore.text })), (0, jsx_runtime_1.jsx)(react_1.Icon, { color: (_p = readMore === null || readMore === void 0 ? void 0 : readMore.color) !== null && _p !== void 0 ? _p : "#000000", as: readMore.icon, w: (0, polished_1.rem)(10), height: (0, polished_1.rem)(10) })] })), (readMore === null || readMore === void 0 ? void 0 : readMore.isPriceVisible) && (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (_q = price === null || price === void 0 ? void 0 : price.customPriceTag) !== null && _q !== void 0 ? _q : ((price === null || price === void 0 ? void 0 : price.label) && (price === null || price === void 0 ? void 0 : price.perMonthText) && (0, jsx_runtime_1.jsxs)(react_1.Text, Object.assign({ fontSize: (0, polished_1.rem)(14), lineHeight: (0, polished_1.rem)(24), fontWeight: 400, textAlign: "right", width: "inherit" }, { children: [price === null || price === void 0 ? void 0 : price.fromText, " ", (0, jsx_runtime_1.jsx)("b", Object.assign({ style: { fontSize: (0, polished_1.rem)(16), fontWeight: "bold" } }, { children: price.label })), " ", price === null || price === void 0 ? void 0 : price.perMonthText] }))) })] }))), (CTA === null || CTA === void 0 ? void 0 : CTA.isVisible) && ((0, jsx_runtime_1.jsxs)(react_1.Flex, Object.assign({ height: "100%", mt: (0, polished_1.rem)(22), direction: "row", wrap: ["wrap", "wrap", "wrap", "inherit"], gap: 2, justifyContent: "start", alignItems: "end", w: CTA.isPriceVisible ? "100%" : undefined }, { children: [((_r = CTA.primary) === null || _r === void 0 ? void 0 : _r.isVisible) &&
30
+ } })] }))] }), list.id))) })), ((_k = readMore === null || readMore === void 0 ? void 0 : readMore.isVisible) !== null && _k !== void 0 ? _k : readMore === null || readMore === void 0 ? void 0 : readMore.isPriceVisible) && ((0, jsx_runtime_1.jsxs)(react_1.Flex, Object.assign({ justifyContent: "space-between", w: !(readMore === null || readMore === void 0 ? void 0 : readMore.isVisible) && (readMore === null || readMore === void 0 ? void 0 : readMore.isPriceVisible) ? "100%" : undefined, mt: (0, polished_1.rem)(16), cursor: "pointer" }, { children: [(readMore === null || readMore === void 0 ? void 0 : readMore.isVisible) && (0, jsx_runtime_1.jsxs)(react_1.Flex, Object.assign({ direction: "row", alignItems: "center", paddingBottom: (0, polished_1.rem)(6), gap: (0, polished_1.rem)(7), borderBottom: "1px solid", sx: (_l = readMore === null || readMore === void 0 ? void 0 : readMore.sx) !== null && _l !== void 0 ? _l : { borderColor: (_m = readMore === null || readMore === void 0 ? void 0 : readMore.color) !== null && _m !== void 0 ? _m : "#00000033" } }, { children: [(0, jsx_runtime_1.jsx)(react_1.Text, Object.assign({ fontSize: (0, polished_1.rem)(18), color: (_o = readMore === null || readMore === void 0 ? void 0 : readMore.color) !== null && _o !== void 0 ? _o : "#000000", lineHeight: (0, polished_1.rem)(24), fontWeight: 400, "data-testid": "read-more", onClick: readMore === null || readMore === void 0 ? void 0 : readMore.action }, { children: readMore === null || readMore === void 0 ? void 0 : readMore.text })), (0, jsx_runtime_1.jsx)(react_1.Icon, { color: (_p = readMore === null || readMore === void 0 ? void 0 : readMore.color) !== null && _p !== void 0 ? _p : "#000000", as: readMore.icon, w: (0, polished_1.rem)(10), height: (0, polished_1.rem)(10) })] })), (readMore === null || readMore === void 0 ? void 0 : readMore.isPriceVisible) && (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (_q = price === null || price === void 0 ? void 0 : price.customPriceTag) !== null && _q !== void 0 ? _q : ((price === null || price === void 0 ? void 0 : price.label) && (price === null || price === void 0 ? void 0 : price.perMonthText) && (0, jsx_runtime_1.jsxs)(react_1.Text, Object.assign({ fontSize: (0, polished_1.rem)(14), lineHeight: (0, polished_1.rem)(24), fontWeight: 400, textAlign: "right", width: "inherit" }, { children: [price === null || price === void 0 ? void 0 : price.fromText, " ", (0, jsx_runtime_1.jsx)("b", Object.assign({ style: { fontSize: (0, polished_1.rem)(16), fontWeight: "bold" } }, { children: price.label })), " ", price === null || price === void 0 ? void 0 : price.perMonthText] }))) })] }))), (CTA === null || CTA === void 0 ? void 0 : CTA.isVisible) && ((0, jsx_runtime_1.jsxs)(react_1.Flex, Object.assign({ height: "100%", mt: (0, polished_1.rem)(22), direction: "row", wrap: ["wrap", "wrap", "wrap", "inherit"], gap: 2, justifyContent: "start", alignItems: "end", w: CTA.isPriceVisible ? "100%" : undefined }, { children: [((_r = CTA.primary) === null || _r === void 0 ? void 0 : _r.isVisible) &&
31
31
  (0, jsx_runtime_1.jsx)(react_1.Flex, { children: (0, jsx_runtime_1.jsx)(react_1.Button, Object.assign({ "data-testid": "primary-action", onClick: (_s = CTA.primary) === null || _s === void 0 ? void 0 : _s.onClick, outline: "none", isDisabled: (_t = CTA.primary) === null || _t === void 0 ? void 0 : _t.isDisabled, isLoading: (_u = CTA.primary) === null || _u === void 0 ? void 0 : _u.isLoading, rightIcon: (((_v = CTA.primary) === null || _v === void 0 ? void 0 : _v.iconPosition) === "right" && ((_w = CTA.primary) === null || _w === void 0 ? void 0 : _w.icon)) ? (0, jsx_runtime_1.jsx)(react_1.Icon, { as: (_x = CTA.primary) === null || _x === void 0 ? void 0 : _x.icon }) : undefined, leftIcon: (((_y = CTA.primary) === null || _y === void 0 ? void 0 : _y.iconPosition) === "left" && ((_z = CTA.primary) === null || _z === void 0 ? void 0 : _z.icon)) ? (0, jsx_runtime_1.jsx)(react_1.Icon, { as: (_0 = CTA.primary) === null || _0 === void 0 ? void 0 : _0.icon }) : undefined, variant: (_1 = CTA.primary) === null || _1 === void 0 ? void 0 : _1.variant, color: (_2 = CTA === null || CTA === void 0 ? void 0 : CTA.primary) === null || _2 === void 0 ? void 0 : _2.color, fill: (_3 = CTA === null || CTA === void 0 ? void 0 : CTA.primary) === null || _3 === void 0 ? void 0 : _3.color, stroke: (_4 = CTA === null || CTA === void 0 ? void 0 : CTA.primary) === null || _4 === void 0 ? void 0 : _4.color, borderRadius: (0, polished_1.rem)(56), _hover: {
32
32
  bg: (_5 = CTA.primary) === null || _5 === void 0 ? void 0 : _5.hoverBG,
33
33
  color: (_6 = CTA.primary) === null || _6 === void 0 ? void 0 : _6.hoverColor,
package/dist/cjs/alicia/common/List/List.js CHANGED
@@ -35,7 +35,7 @@ const CustomListItem = ({ list, withLeftIcon, rightIconColor, itemFontSize, with
35
35
  ? itemColor
36
36
  : selectedItemBackgroundColor}`, mr: "1.5", fontSize: 20, bg: enableVisualEffects
37
37
  ? 'transparent'
38
- : selectedItemBackgroundColor, color: enableVisualEffects ? undefined : 'white' }, { children: Number(data === null || data === void 0 ? void 0 : data.index) + 1 }))] })))] })), (0, jsx_runtime_1.jsxs)(react_1.Flex, Object.assign({ flexDirection: "column" }, { children: [(0, jsx_runtime_1.jsx)(react_1.Text, Object.assign({ as: "span", fontSize: itemFontSize, wordBreak: "break-word" }, { children: data === null || data === void 0 ? void 0 : data.label })), (data === null || data === void 0 ? void 0 : data.description) && ((0, jsx_runtime_1.jsx)(react_1.Text, Object.assign({ as: "span", fontSize: (0, polished_1.rem)(14) }, { children: data === null || data === void 0 ? void 0 : data.description })))] }))] })), withRightIcon && ((0, jsx_runtime_1.jsx)(ArrowIcon, { fill: rightIconColor, pr: (0, polished_1.rem)(10), float: "right", width: (0, polished_1.rem)(30), height: (0, polished_1.rem)(30) }))] })), isClickable && (hoveredItem === data.value) && ((0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, { initial: { width: '0', transform: "rotate(0deg)" }, animate: {
38
+ : selectedItemBackgroundColor, color: enableVisualEffects ? undefined : 'white' }, { children: Number(data === null || data === void 0 ? void 0 : data.index) + 1 }))] })))] })), (0, jsx_runtime_1.jsxs)(react_1.Flex, Object.assign({ flexDirection: "column" }, { children: [(0, jsx_runtime_1.jsx)(react_1.Text, Object.assign({ as: "span", fontSize: itemFontSize, wordBreak: "break-word" }, { children: data === null || data === void 0 ? void 0 : data.label })), (data === null || data === void 0 ? void 0 : data.description) && ((0, jsx_runtime_1.jsx)(react_1.Text, Object.assign({ as: "span", fontSize: (0, polished_1.rem)(16) }, { children: data === null || data === void 0 ? void 0 : data.description })))] }))] })), withRightIcon && ((0, jsx_runtime_1.jsx)(ArrowIcon, { fill: rightIconColor, pr: (0, polished_1.rem)(10), float: "right", width: (0, polished_1.rem)(30), height: (0, polished_1.rem)(30) }))] })), isClickable && (hoveredItem === data.value) && ((0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, { initial: { width: '0', transform: "rotate(0deg)" }, animate: {
39
39
  width: '100%',
40
40
  transform: enableVisualEffects
41
41
  ? 'rotate(-0.4deg)'
package/dist/esm/alicia/common/Card/CardV2.js CHANGED
@@ -16,15 +16,15 @@ export const CardV2 = ({ header = undefined, headerIcon = undefined, tag = undef
16
16
  } : {
17
17
  mt: rem(16),
18
18
  mb: rem((checklist === null || checklist === void 0 ? void 0 : checklist.isVisible) ? 8 : 0)
19
- } }, { children: _jsx(Text, { color: (_e = header === null || header === void 0 ? void 0 : header.descriptionColor) !== null && _e !== void 0 ? _e : "#000000", fontSize: rem(16), lineHeight: rem(24), mb: rem((checklist === null || checklist === void 0 ? void 0 : checklist.isVisible) ? 8 : 0), dangerouslySetInnerHTML: {
19
+ } }, { children: _jsx(Text, { color: (_e = header === null || header === void 0 ? void 0 : header.descriptionColor) !== null && _e !== void 0 ? _e : "#000000", fontSize: rem(18), lineHeight: rem(24), mb: rem((checklist === null || checklist === void 0 ? void 0 : checklist.isVisible) ? 8 : 0), dangerouslySetInnerHTML: {
20
20
  __html: header.description
21
- } }) }))), (checklist === null || checklist === void 0 ? void 0 : checklist.isVisible) && Boolean((_f = checklist === null || checklist === void 0 ? void 0 : checklist.data) === null || _f === void 0 ? void 0 : _f.length) && _jsx(Flex, Object.assign({ direction: "column" }, { children: (_g = checklist === null || checklist === void 0 ? void 0 : checklist.data) === null || _g === void 0 ? void 0 : _g.map((list, index) => (_jsxs(Flex, Object.assign({ mt: rem((index === 0) ? 18 : 12), direction: "row", fontSize: rem(14), fontWeight: 400, lineHeight: rem(20) }, { children: [_jsx(Box, Object.assign({ mr: rem(8) }, { children: _jsx(Icon, { as: list.icon, w: rem(14), height: rem(14) }) })), _jsx(Text, { fontSize: rem(16), lineHeight: rem(24), dangerouslySetInnerHTML: {
21
+ } }) }))), (checklist === null || checklist === void 0 ? void 0 : checklist.isVisible) && Boolean((_f = checklist === null || checklist === void 0 ? void 0 : checklist.data) === null || _f === void 0 ? void 0 : _f.length) && _jsx(Flex, Object.assign({ direction: "column" }, { children: (_g = checklist === null || checklist === void 0 ? void 0 : checklist.data) === null || _g === void 0 ? void 0 : _g.map((list, index) => (_jsxs(Flex, Object.assign({ mt: rem((index === 0) ? 18 : 12), direction: "row", fontSize: rem(14), fontWeight: 400, lineHeight: rem(20) }, { children: [_jsx(Box, Object.assign({ mr: rem(8) }, { children: _jsx(Icon, { as: list.icon, w: rem(14), height: rem(14) }) })), _jsx(Text, { fontSize: rem(18), lineHeight: rem(24), dangerouslySetInnerHTML: {
22
22
  __html: list.label
23
- } })] }), list.id))) })), ((checklist === null || checklist === void 0 ? void 0 : checklist.isVisible) && (addons === null || addons === void 0 ? void 0 : addons.isVisible)) && (_jsx(Divider, { mt: rem(18), mb: rem(16) })), (addons === null || addons === void 0 ? void 0 : addons.isVisible) && Boolean((_h = addons === null || addons === void 0 ? void 0 : addons.data) === null || _h === void 0 ? void 0 : _h.length) && _jsx(Flex, Object.assign({ direction: "column" }, { children: (_j = addons === null || addons === void 0 ? void 0 : addons.data) === null || _j === void 0 ? void 0 : _j.map((list, index) => (_jsxs(Flex, Object.assign({ mt: rem(((checklist === null || checklist === void 0 ? void 0 : checklist.isVisible) && (addons === null || addons === void 0 ? void 0 : addons.isVisible) && index === 0) ? 0 : (index === 0) ? 18 : 12), direction: "row", width: "100%", alignItems: "center" }, { children: [_jsx(Box, Object.assign({ mr: rem(8) }, { children: _jsx(Icon, { as: list.icon, w: rem(14), height: rem(14) }) })), _jsxs(Flex, Object.assign({ justifyContent: "space-between", direction: "row", width: "inherit", fontSize: rem(14), fontWeight: 400, lineHeight: rem(20) }, { children: [_jsx(Text, { fontSize: rem(16), lineHeight: rem(24), dangerouslySetInnerHTML: {
23
+ } })] }), list.id))) })), ((checklist === null || checklist === void 0 ? void 0 : checklist.isVisible) && (addons === null || addons === void 0 ? void 0 : addons.isVisible)) && (_jsx(Divider, { mt: rem(18), mb: rem(16) })), (addons === null || addons === void 0 ? void 0 : addons.isVisible) && Boolean((_h = addons === null || addons === void 0 ? void 0 : addons.data) === null || _h === void 0 ? void 0 : _h.length) && _jsx(Flex, Object.assign({ direction: "column" }, { children: (_j = addons === null || addons === void 0 ? void 0 : addons.data) === null || _j === void 0 ? void 0 : _j.map((list, index) => (_jsxs(Flex, Object.assign({ mt: rem(((checklist === null || checklist === void 0 ? void 0 : checklist.isVisible) && (addons === null || addons === void 0 ? void 0 : addons.isVisible) && index === 0) ? 0 : (index === 0) ? 18 : 12), direction: "row", width: "100%", alignItems: "center" }, { children: [_jsx(Box, Object.assign({ mr: rem(8) }, { children: _jsx(Icon, { as: list.icon, w: rem(14), height: rem(14) }) })), _jsxs(Flex, Object.assign({ justifyContent: "space-between", direction: "row", width: "inherit", fontSize: rem(14), fontWeight: 400, lineHeight: rem(20) }, { children: [_jsx(Text, { fontSize: rem(18), lineHeight: rem(24), dangerouslySetInnerHTML: {
24
24
  __html: list.text
25
- } }), _jsx(Text, { fontSize: rem(16), lineHeight: rem(24), dangerouslySetInnerHTML: {
25
+ } }), _jsx(Text, { fontSize: rem(18), lineHeight: rem(24), dangerouslySetInnerHTML: {
26
26
  __html: list.price
27
- } })] }))] }), list.id))) })), ((_k = readMore === null || readMore === void 0 ? void 0 : readMore.isVisible) !== null && _k !== void 0 ? _k : readMore === null || readMore === void 0 ? void 0 : readMore.isPriceVisible) && (_jsxs(Flex, Object.assign({ justifyContent: "space-between", w: !(readMore === null || readMore === void 0 ? void 0 : readMore.isVisible) && (readMore === null || readMore === void 0 ? void 0 : readMore.isPriceVisible) ? "100%" : undefined, mt: rem(16), cursor: "pointer" }, { children: [(readMore === null || readMore === void 0 ? void 0 : readMore.isVisible) && _jsxs(Flex, Object.assign({ direction: "row", alignItems: "center", paddingBottom: rem(6), gap: rem(7), borderBottom: "1px solid", sx: (_l = readMore === null || readMore === void 0 ? void 0 : readMore.sx) !== null && _l !== void 0 ? _l : { borderColor: (_m = readMore === null || readMore === void 0 ? void 0 : readMore.color) !== null && _m !== void 0 ? _m : "#00000033" } }, { children: [_jsx(Text, Object.assign({ fontSize: rem(16), color: (_o = readMore === null || readMore === void 0 ? void 0 : readMore.color) !== null && _o !== void 0 ? _o : "#000000", lineHeight: rem(24), fontWeight: 400, "data-testid": "read-more", onClick: readMore === null || readMore === void 0 ? void 0 : readMore.action }, { children: readMore === null || readMore === void 0 ? void 0 : readMore.text })), _jsx(Icon, { color: (_p = readMore === null || readMore === void 0 ? void 0 : readMore.color) !== null && _p !== void 0 ? _p : "#000000", as: readMore.icon, w: rem(10), height: rem(10) })] })), (readMore === null || readMore === void 0 ? void 0 : readMore.isPriceVisible) && _jsx(_Fragment, { children: (_q = price === null || price === void 0 ? void 0 : price.customPriceTag) !== null && _q !== void 0 ? _q : ((price === null || price === void 0 ? void 0 : price.label) && (price === null || price === void 0 ? void 0 : price.perMonthText) && _jsxs(Text, Object.assign({ fontSize: rem(14), lineHeight: rem(24), fontWeight: 400, textAlign: "right", width: "inherit" }, { children: [price === null || price === void 0 ? void 0 : price.fromText, " ", _jsx("b", Object.assign({ style: { fontSize: rem(16), fontWeight: "bold" } }, { children: price.label })), " ", price === null || price === void 0 ? void 0 : price.perMonthText] }))) })] }))), (CTA === null || CTA === void 0 ? void 0 : CTA.isVisible) && (_jsxs(Flex, Object.assign({ height: "100%", mt: rem(22), direction: "row", wrap: ["wrap", "wrap", "wrap", "inherit"], gap: 2, justifyContent: "start", alignItems: "end", w: CTA.isPriceVisible ? "100%" : undefined }, { children: [((_r = CTA.primary) === null || _r === void 0 ? void 0 : _r.isVisible) &&
27
+ } })] }))] }), list.id))) })), ((_k = readMore === null || readMore === void 0 ? void 0 : readMore.isVisible) !== null && _k !== void 0 ? _k : readMore === null || readMore === void 0 ? void 0 : readMore.isPriceVisible) && (_jsxs(Flex, Object.assign({ justifyContent: "space-between", w: !(readMore === null || readMore === void 0 ? void 0 : readMore.isVisible) && (readMore === null || readMore === void 0 ? void 0 : readMore.isPriceVisible) ? "100%" : undefined, mt: rem(16), cursor: "pointer" }, { children: [(readMore === null || readMore === void 0 ? void 0 : readMore.isVisible) && _jsxs(Flex, Object.assign({ direction: "row", alignItems: "center", paddingBottom: rem(6), gap: rem(7), borderBottom: "1px solid", sx: (_l = readMore === null || readMore === void 0 ? void 0 : readMore.sx) !== null && _l !== void 0 ? _l : { borderColor: (_m = readMore === null || readMore === void 0 ? void 0 : readMore.color) !== null && _m !== void 0 ? _m : "#00000033" } }, { children: [_jsx(Text, Object.assign({ fontSize: rem(18), color: (_o = readMore === null || readMore === void 0 ? void 0 : readMore.color) !== null && _o !== void 0 ? _o : "#000000", lineHeight: rem(24), fontWeight: 400, "data-testid": "read-more", onClick: readMore === null || readMore === void 0 ? void 0 : readMore.action }, { children: readMore === null || readMore === void 0 ? void 0 : readMore.text })), _jsx(Icon, { color: (_p = readMore === null || readMore === void 0 ? void 0 : readMore.color) !== null && _p !== void 0 ? _p : "#000000", as: readMore.icon, w: rem(10), height: rem(10) })] })), (readMore === null || readMore === void 0 ? void 0 : readMore.isPriceVisible) && _jsx(_Fragment, { children: (_q = price === null || price === void 0 ? void 0 : price.customPriceTag) !== null && _q !== void 0 ? _q : ((price === null || price === void 0 ? void 0 : price.label) && (price === null || price === void 0 ? void 0 : price.perMonthText) && _jsxs(Text, Object.assign({ fontSize: rem(14), lineHeight: rem(24), fontWeight: 400, textAlign: "right", width: "inherit" }, { children: [price === null || price === void 0 ? void 0 : price.fromText, " ", _jsx("b", Object.assign({ style: { fontSize: rem(16), fontWeight: "bold" } }, { children: price.label })), " ", price === null || price === void 0 ? void 0 : price.perMonthText] }))) })] }))), (CTA === null || CTA === void 0 ? void 0 : CTA.isVisible) && (_jsxs(Flex, Object.assign({ height: "100%", mt: rem(22), direction: "row", wrap: ["wrap", "wrap", "wrap", "inherit"], gap: 2, justifyContent: "start", alignItems: "end", w: CTA.isPriceVisible ? "100%" : undefined }, { children: [((_r = CTA.primary) === null || _r === void 0 ? void 0 : _r.isVisible) &&
28
28
  _jsx(Flex, { children: _jsx(Button, Object.assign({ "data-testid": "primary-action", onClick: (_s = CTA.primary) === null || _s === void 0 ? void 0 : _s.onClick, outline: "none", isDisabled: (_t = CTA.primary) === null || _t === void 0 ? void 0 : _t.isDisabled, isLoading: (_u = CTA.primary) === null || _u === void 0 ? void 0 : _u.isLoading, rightIcon: (((_v = CTA.primary) === null || _v === void 0 ? void 0 : _v.iconPosition) === "right" && ((_w = CTA.primary) === null || _w === void 0 ? void 0 : _w.icon)) ? _jsx(Icon, { as: (_x = CTA.primary) === null || _x === void 0 ? void 0 : _x.icon }) : undefined, leftIcon: (((_y = CTA.primary) === null || _y === void 0 ? void 0 : _y.iconPosition) === "left" && ((_z = CTA.primary) === null || _z === void 0 ? void 0 : _z.icon)) ? _jsx(Icon, { as: (_0 = CTA.primary) === null || _0 === void 0 ? void 0 : _0.icon }) : undefined, variant: (_1 = CTA.primary) === null || _1 === void 0 ? void 0 : _1.variant, color: (_2 = CTA === null || CTA === void 0 ? void 0 : CTA.primary) === null || _2 === void 0 ? void 0 : _2.color, fill: (_3 = CTA === null || CTA === void 0 ? void 0 : CTA.primary) === null || _3 === void 0 ? void 0 : _3.color, stroke: (_4 = CTA === null || CTA === void 0 ? void 0 : CTA.primary) === null || _4 === void 0 ? void 0 : _4.color, borderRadius: rem(56), _hover: {
29
29
  bg: (_5 = CTA.primary) === null || _5 === void 0 ? void 0 : _5.hoverBG,
30
30
  color: (_6 = CTA.primary) === null || _6 === void 0 ? void 0 : _6.hoverColor,
package/dist/esm/alicia/common/List/List.js CHANGED
@@ -32,7 +32,7 @@ export const CustomListItem = ({ list, withLeftIcon, rightIconColor, itemFontSiz
32
32
  ? itemColor
33
33
  : selectedItemBackgroundColor}`, mr: "1.5", fontSize: 20, bg: enableVisualEffects
34
34
  ? 'transparent'
35
- : selectedItemBackgroundColor, color: enableVisualEffects ? undefined : 'white' }, { children: Number(data === null || data === void 0 ? void 0 : data.index) + 1 }))] })))] })), _jsxs(Flex, Object.assign({ flexDirection: "column" }, { children: [_jsx(Text, Object.assign({ as: "span", fontSize: itemFontSize, wordBreak: "break-word" }, { children: data === null || data === void 0 ? void 0 : data.label })), (data === null || data === void 0 ? void 0 : data.description) && (_jsx(Text, Object.assign({ as: "span", fontSize: rem(14) }, { children: data === null || data === void 0 ? void 0 : data.description })))] }))] })), withRightIcon && (_jsx(ArrowIcon, { fill: rightIconColor, pr: rem(10), float: "right", width: rem(30), height: rem(30) }))] })), isClickable && (hoveredItem === data.value) && (_jsx(motion.div, { initial: { width: '0', transform: "rotate(0deg)" }, animate: {
35
+ : selectedItemBackgroundColor, color: enableVisualEffects ? undefined : 'white' }, { children: Number(data === null || data === void 0 ? void 0 : data.index) + 1 }))] })))] })), _jsxs(Flex, Object.assign({ flexDirection: "column" }, { children: [_jsx(Text, Object.assign({ as: "span", fontSize: itemFontSize, wordBreak: "break-word" }, { children: data === null || data === void 0 ? void 0 : data.label })), (data === null || data === void 0 ? void 0 : data.description) && (_jsx(Text, Object.assign({ as: "span", fontSize: rem(16) }, { children: data === null || data === void 0 ? void 0 : data.description })))] }))] })), withRightIcon && (_jsx(ArrowIcon, { fill: rightIconColor, pr: rem(10), float: "right", width: rem(30), height: rem(30) }))] })), isClickable && (hoveredItem === data.value) && (_jsx(motion.div, { initial: { width: '0', transform: "rotate(0deg)" }, animate: {
36
36
  width: '100%',
37
37
  transform: enableVisualEffects
38
38
  ? 'rotate(-0.4deg)'
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "alicia-design-system",
3
- "version": "1.76.4",
3
+ "version": "1.76.6",
4
4
  "main": "dist/cjs/index.js",
5
5
  "module": "dist/esm/index.js",
6
6
  "types": "dist/esm/index.d.ts",