softable-pixels-web 1.0.4 → 1.0.5

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 (35) hide show
  1. package/dist/Checkbox-ChOwHDqG.js +149 -0
  2. package/dist/Checkbox-ChOwHDqG.js.map +1 -0
  3. package/dist/Icon-DP_mHQ2j.js +209 -0
  4. package/dist/Icon-DP_mHQ2j.js.map +1 -0
  5. package/dist/{InfoSummary-DVuk2_3H.js → InfoSummary-DG1mzcP0.js} +2 -2
  6. package/dist/{InfoSummary-DVuk2_3H.js.map → InfoSummary-DG1mzcP0.js.map} +1 -1
  7. package/dist/Input-DQA00Ogn.js +398 -0
  8. package/dist/Input-DQA00Ogn.js.map +1 -0
  9. package/dist/{TabSwitch-COP-ySAl.js → TabSwitch-CXyetOBu.js} +3 -3
  10. package/dist/{TabSwitch-COP-ySAl.js.map → TabSwitch-CXyetOBu.js.map} +1 -1
  11. package/dist/{ThemeContext-DiTV3IJz.js → ThemeContext-C0tdHJcj.js} +4 -1
  12. package/dist/ThemeContext-C0tdHJcj.js.map +1 -0
  13. package/dist/{Typography-DRln739F.js → Typography-B9X7_xlT.js} +1 -1
  14. package/dist/{Typography-DRln739F.js.map → Typography-B9X7_xlT.js.map} +1 -1
  15. package/dist/checkbox.d.ts +3 -0
  16. package/dist/checkbox.js +5 -0
  17. package/dist/{index-We1VnYPI.d.ts → index-CCkDXM6z.d.ts} +4 -4
  18. package/dist/{index-BIO2lN3W.d.ts → index-CDW6xFdv.d.ts} +2 -1
  19. package/dist/index-CMnvjaqX.d.ts +31 -0
  20. package/dist/index-DmDV6MR_.d.ts +44 -0
  21. package/dist/index.d.ts +7 -4
  22. package/dist/index.js +8 -5
  23. package/dist/info-summary.js +2 -2
  24. package/dist/input.d.ts +3 -0
  25. package/dist/input.js +5 -0
  26. package/dist/tab-switch.d.ts +1 -1
  27. package/dist/tab-switch.js +2 -2
  28. package/dist/theme-context.d.ts +1 -1
  29. package/dist/theme-context.js +1 -1
  30. package/dist/{index-Bi8K59rR.d.ts → types-2d-4sjMo.d.ts} +3 -7
  31. package/dist/typography.d.ts +8 -2
  32. package/dist/typography.js +1 -1
  33. package/dist/{useThemedStyles-IEQ_4Cqi.d.ts → useThemedStyles-01zK-tbY.d.ts} +9 -2
  34. package/package.json +15 -1
  35. package/dist/ThemeContext-DiTV3IJz.js.map +0 -1
package/dist/Checkbox-ChOwHDqG.js ADDED
@@ -0,0 +1,149 @@
1
+ import { t as Icon } from "./Icon-DP_mHQ2j.js";
2
+ import { n as useThemedStyles, t as Typography } from "./Typography-B9X7_xlT.js";
3
+ import { Checkbox, Label } from "radix-ui";
4
+ import { useId } from "react";
5
+ import { jsx, jsxs } from "react/jsx-runtime";
6
+
7
+ //#region src/components/toolkit/Checkbox/components/Label/styles.ts
8
+ function createLabelStyles(props) {
9
+ const { disabled } = props;
10
+ return { container: {
11
+ userSelect: "none",
12
+ opacity: disabled ? .6 : 1,
13
+ cursor: disabled ? "not-allowed" : "pointer",
14
+ transition: "all 200ms",
15
+ __rules: { ":hover": { color: "var(--px-color-secondary)" } }
16
+ } };
17
+ }
18
+
19
+ //#endregion
20
+ //#region src/components/toolkit/Checkbox/components/Label/index.tsx
21
+ const Label$1 = (props) => {
22
+ const { idFor, label, labelVariant } = props;
23
+ const { styles } = useThemedStyles(props, createLabelStyles, {
24
+ pick: (p) => [
25
+ p.disabled,
26
+ p.labelVariant,
27
+ p.label
28
+ ],
29
+ applyCommonProps: true
30
+ });
31
+ return /* @__PURE__ */ jsx(Label.Root, {
32
+ htmlFor: idFor,
33
+ style: styles.container,
34
+ children: /* @__PURE__ */ jsx(Typography, {
35
+ variant: labelVariant ?? "b1",
36
+ fontWeight: "normal",
37
+ children: label
38
+ })
39
+ });
40
+ };
41
+
42
+ //#endregion
43
+ //#region src/components/toolkit/Checkbox/hooks/useCheckbox.ts
44
+ function useCheckbox() {
45
+ return { id: useId() };
46
+ }
47
+
48
+ //#endregion
49
+ //#region src/components/toolkit/Checkbox/styles.ts
50
+ const CHECKBOX_STYLES = {
51
+ size: {
52
+ sm: {
53
+ width: "1rem",
54
+ height: "1rem"
55
+ },
56
+ md: {
57
+ width: "1.25rem",
58
+ height: "1.25rem"
59
+ },
60
+ lg: {
61
+ width: "1.5rem",
62
+ height: "1.5rem"
63
+ }
64
+ },
65
+ radius: {
66
+ none: { borderRadius: 0 },
67
+ sm: { borderRadius: "0.25rem" },
68
+ md: { borderRadius: "0.375rem" },
69
+ lg: { borderRadius: "0.5rem" },
70
+ full: { borderRadius: "100%" }
71
+ }
72
+ };
73
+ function createCheckBoxStyles(props) {
74
+ const { color, checked, size = "md", radius = "md", disabled = false, labelPlacement = "right" } = props;
75
+ const focusIndicatorOffsetColor = "#fff";
76
+ return {
77
+ container: {
78
+ columnGap: "2rem",
79
+ display: "flex",
80
+ alignItems: "center",
81
+ "--px-ring-color": color ?? void 0,
82
+ flexDirection: labelPlacement === "right" ? "row" : "row-reverse"
83
+ },
84
+ root: {
85
+ display: "flex",
86
+ alignItems: "center",
87
+ justifyContent: "center",
88
+ backgroundColor: checked ? color : "white",
89
+ borderWidth: "1px",
90
+ borderStyle: "solid",
91
+ borderColor: checked ? color : "var(--px-border-primary, #e5e7eb)",
92
+ transition: "color 200ms",
93
+ opacity: disabled ? .5 : 1,
94
+ cursor: disabled ? "not-allowed" : "pointer",
95
+ ...CHECKBOX_STYLES.size[size],
96
+ ...CHECKBOX_STYLES.radius[radius],
97
+ __rules: {
98
+ "&:hover": { borderColor: "var(--px-border-secondary, #e5e7eb)" },
99
+ "&:focus-visible": {
100
+ outline: "none",
101
+ boxShadow: `0 0 0 2px ${focusIndicatorOffsetColor}, 0 0 0 4px var(--px-ring-color, #2b2b2bff)`
102
+ }
103
+ }
104
+ },
105
+ indicator: {
106
+ display: "flex",
107
+ alignItems: "center",
108
+ justifyContent: "center",
109
+ color: "var(--px-text-primary, #4b5563)"
110
+ }
111
+ };
112
+ }
113
+
114
+ //#endregion
115
+ //#region src/components/toolkit/Checkbox/index.tsx
116
+ const Checkbox$1 = (props) => {
117
+ const { icon, label, labelVariant, checked = false, disabled = false, onChange } = props;
118
+ const { id } = useCheckbox();
119
+ const { styles, classes } = useThemedStyles(props, createCheckBoxStyles);
120
+ return /* @__PURE__ */ jsxs("div", {
121
+ style: styles.container,
122
+ children: [/* @__PURE__ */ jsx(Checkbox.Root, {
123
+ style: styles.root,
124
+ className: classes.root,
125
+ id,
126
+ tabIndex: 0,
127
+ checked,
128
+ disabled,
129
+ onCheckedChange: (checked$1) => onChange(checked$1 === true),
130
+ children: /* @__PURE__ */ jsx(Checkbox.Indicator, {
131
+ style: styles.indicator,
132
+ children: icon ?? /* @__PURE__ */ jsx(Icon, {
133
+ name: "general-check",
134
+ size: "sm",
135
+ color: "white"
136
+ })
137
+ })
138
+ }), label ? /* @__PURE__ */ jsx(Label$1, {
139
+ idFor: id,
140
+ label,
141
+ disabled,
142
+ labelVariant
143
+ }) : null]
144
+ });
145
+ };
146
+
147
+ //#endregion
148
+ export { Checkbox$1 as t };
149
+ //# sourceMappingURL=Checkbox-ChOwHDqG.js.map
package/dist/Checkbox-ChOwHDqG.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Checkbox-ChOwHDqG.js","names":["Label: React.FC<LabelProps>","LabelRadix","CHECKBOX_STYLES: Record<string, StyleMap>","Checkbox: React.FC<CheckboxProps>","CheckboxRadix","checked","Label"],"sources":["../src/components/toolkit/Checkbox/components/Label/styles.ts","../src/components/toolkit/Checkbox/components/Label/index.tsx","../src/components/toolkit/Checkbox/hooks/useCheckbox.ts","../src/components/toolkit/Checkbox/styles.ts","../src/components/toolkit/Checkbox/index.tsx"],"sourcesContent":["// Types\nimport type { LabelProps } from './types'\nimport type { StyleMap } from '@hooks/useThemedStyles/types'\n\nexport function createLabelStyles(props: LabelProps): StyleMap {\n const { disabled } = props\n\n return {\n container: {\n userSelect: 'none',\n opacity: disabled ? 0.6 : 1,\n cursor: disabled ? 'not-allowed' : 'pointer',\n\n transition: 'all 200ms',\n\n __rules: {\n ':hover': { color: 'var(--px-color-secondary)' }\n }\n }\n }\n}\n","// External libraries\nimport { Label as LabelRadix } from 'radix-ui'\n\n// Components\nimport { Typography } from '@components/toolkit/Typography'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { LabelProps } from './types'\n\n// Styles\nimport { createLabelStyles } from './styles'\n\nexport const Label: React.FC<LabelProps> = props => {\n const { idFor, label, labelVariant } = props\n\n // Hooks\n const { styles } = useThemedStyles(props, createLabelStyles, {\n pick: p => [p.disabled, p.labelVariant, p.label],\n applyCommonProps: true\n })\n\n return (\n <LabelRadix.Root htmlFor={idFor} style={styles.container}>\n <Typography variant={labelVariant ?? 'b1'} fontWeight=\"normal\">\n {label}\n </Typography>\n </LabelRadix.Root>\n )\n}\n","// External libraries\nimport { useId } from 'react'\n\nexport function useCheckbox() {\n return {\n id: useId()\n }\n}\n","// Types\nimport type { CheckboxProps } from './types'\nimport type { StyleMap } from '@hooks/useThemedStyles/types'\n\nexport const CHECKBOX_STYLES: Record<string, StyleMap> = {\n size: {\n sm: { width: '1rem', height: '1rem' },\n md: { width: '1.25rem', height: '1.25rem' },\n lg: { width: '1.5rem', height: '1.5rem' }\n },\n radius: {\n none: { borderRadius: 0 },\n sm: { borderRadius: '0.25rem' },\n md: { borderRadius: '0.375rem' },\n lg: { borderRadius: '0.5rem' },\n full: { borderRadius: '100%' }\n }\n}\n\nexport function createCheckBoxStyles(props: CheckboxProps): StyleMap {\n const {\n color,\n checked,\n size = 'md',\n radius = 'md',\n disabled = false,\n labelPlacement = 'right'\n } = props\n\n const focusIndicatorOffsetColor = '#fff'\n\n return {\n container: {\n columnGap: '2rem',\n display: 'flex',\n alignItems: 'center',\n '--px-ring-color': color ?? undefined,\n flexDirection: labelPlacement === 'right' ? 'row' : 'row-reverse'\n },\n\n root: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n\n backgroundColor: checked ? color : 'white',\n borderWidth: '1px',\n borderStyle: 'solid',\n borderColor: checked ? color : 'var(--px-border-primary, #e5e7eb)',\n\n transition: 'color 200ms',\n opacity: disabled ? 0.5 : 1,\n cursor: disabled ? 'not-allowed' : 'pointer',\n\n ...CHECKBOX_STYLES.size[size],\n ...CHECKBOX_STYLES.radius[radius],\n\n __rules: {\n '&:hover': { borderColor: 'var(--px-border-secondary, #e5e7eb)' },\n '&:focus-visible': {\n outline: 'none',\n boxShadow: `0 0 0 2px ${focusIndicatorOffsetColor}, 0 0 0 4px var(--px-ring-color, #2b2b2bff)`\n }\n }\n },\n\n indicator: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n color: 'var(--px-text-primary, #4b5563)'\n }\n }\n}\n","// External Libraries\nimport type React from 'react'\nimport { Checkbox as CheckboxRadix } from 'radix-ui'\n\n// Components\nimport { Icon } from '../Icon'\nimport { Label } from './components/Label'\n\n// Hooks\nimport { useCheckbox } from './hooks/useCheckbox'\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { CheckboxProps } from './types'\n\n// Styles\nimport { createCheckBoxStyles } from './styles'\n\nexport const Checkbox: React.FC<CheckboxProps> = props => {\n const {\n icon,\n label,\n labelVariant,\n checked = false,\n disabled = false,\n onChange\n } = props\n\n // Hooks\n const { id } = useCheckbox()\n\n const { styles, classes } = useThemedStyles(props, createCheckBoxStyles)\n\n return (\n <div style={styles.container}>\n <CheckboxRadix.Root\n style={styles.root}\n className={classes.root}\n id={id}\n tabIndex={0}\n checked={checked}\n disabled={disabled}\n onCheckedChange={checked => onChange(checked === true)}\n >\n <CheckboxRadix.Indicator style={styles.indicator}>\n {icon ?? <Icon name=\"general-check\" size=\"sm\" color=\"white\" />}\n </CheckboxRadix.Indicator>\n </CheckboxRadix.Root>\n\n {label ? (\n <Label\n idFor={id}\n label={label}\n disabled={disabled}\n labelVariant={labelVariant}\n />\n ) : null}\n </div>\n )\n}\n"],"mappings":";;;;;;;AAIA,SAAgB,kBAAkB,OAA6B;CAC7D,MAAM,EAAE,aAAa;AAErB,QAAO,EACL,WAAW;EACT,YAAY;EACZ,SAAS,WAAW,KAAM;EAC1B,QAAQ,WAAW,gBAAgB;EAEnC,YAAY;EAEZ,SAAS,EACP,UAAU,EAAE,OAAO,6BAA6B,EACjD;EACF,EACF;;;;;ACJH,MAAaA,WAA8B,UAAS;CAClD,MAAM,EAAE,OAAO,OAAO,iBAAiB;CAGvC,MAAM,EAAE,WAAW,gBAAgB,OAAO,mBAAmB;EAC3D,OAAM,MAAK;GAAC,EAAE;GAAU,EAAE;GAAc,EAAE;GAAM;EAChD,kBAAkB;EACnB,CAAC;AAEF,QACE,oBAACC,MAAW;EAAK,SAAS;EAAO,OAAO,OAAO;YAC7C,oBAAC;GAAW,SAAS,gBAAgB;GAAM,YAAW;aACnD;IACU;GACG;;;;;AC1BtB,SAAgB,cAAc;AAC5B,QAAO,EACL,IAAI,OAAO,EACZ;;;;;ACFH,MAAaC,kBAA4C;CACvD,MAAM;EACJ,IAAI;GAAE,OAAO;GAAQ,QAAQ;GAAQ;EACrC,IAAI;GAAE,OAAO;GAAW,QAAQ;GAAW;EAC3C,IAAI;GAAE,OAAO;GAAU,QAAQ;GAAU;EAC1C;CACD,QAAQ;EACN,MAAM,EAAE,cAAc,GAAG;EACzB,IAAI,EAAE,cAAc,WAAW;EAC/B,IAAI,EAAE,cAAc,YAAY;EAChC,IAAI,EAAE,cAAc,UAAU;EAC9B,MAAM,EAAE,cAAc,QAAQ;EAC/B;CACF;AAED,SAAgB,qBAAqB,OAAgC;CACnE,MAAM,EACJ,OACA,SACA,OAAO,MACP,SAAS,MACT,WAAW,OACX,iBAAiB,YACf;CAEJ,MAAM,4BAA4B;AAElC,QAAO;EACL,WAAW;GACT,WAAW;GACX,SAAS;GACT,YAAY;GACZ,mBAAmB,SAAS;GAC5B,eAAe,mBAAmB,UAAU,QAAQ;GACrD;EAED,MAAM;GACJ,SAAS;GACT,YAAY;GACZ,gBAAgB;GAEhB,iBAAiB,UAAU,QAAQ;GACnC,aAAa;GACb,aAAa;GACb,aAAa,UAAU,QAAQ;GAE/B,YAAY;GACZ,SAAS,WAAW,KAAM;GAC1B,QAAQ,WAAW,gBAAgB;GAEnC,GAAG,gBAAgB,KAAK;GACxB,GAAG,gBAAgB,OAAO;GAE1B,SAAS;IACP,WAAW,EAAE,aAAa,uCAAuC;IACjE,mBAAmB;KACjB,SAAS;KACT,WAAW,aAAa,0BAA0B;KACnD;IACF;GACF;EAED,WAAW;GACT,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,OAAO;GACR;EACF;;;;;ACtDH,MAAaC,cAAoC,UAAS;CACxD,MAAM,EACJ,MACA,OACA,cACA,UAAU,OACV,WAAW,OACX,aACE;CAGJ,MAAM,EAAE,OAAO,aAAa;CAE5B,MAAM,EAAE,QAAQ,YAAY,gBAAgB,OAAO,qBAAqB;AAExE,QACE,qBAAC;EAAI,OAAO,OAAO;aACjB,oBAACC,SAAc;GACb,OAAO,OAAO;GACd,WAAW,QAAQ;GACf;GACJ,UAAU;GACD;GACC;GACV,kBAAiB,cAAW,SAASC,cAAY,KAAK;aAEtD,oBAACD,SAAc;IAAU,OAAO,OAAO;cACpC,QAAQ,oBAAC;KAAK,MAAK;KAAgB,MAAK;KAAK,OAAM;MAAU;KACtC;IACP,EAEpB,QACC,oBAACE;GACC,OAAO;GACA;GACG;GACI;IACd,GACA;GACA"}
package/dist/Icon-DP_mHQ2j.js ADDED
@@ -0,0 +1,209 @@
1
+ import { n as useThemedStyles } from "./Typography-B9X7_xlT.js";
2
+ import { Suspense, useMemo } from "react";
3
+ import { jsx, jsxs } from "react/jsx-runtime";
4
+
5
+ //#region src/assets/icons/__generated__/general/check.tsx
6
+ const Check = ({ title, ...props }) => /* @__PURE__ */ jsxs("svg", {
7
+ width: "16",
8
+ height: "16",
9
+ viewBox: "0 0 24 24",
10
+ fill: "none",
11
+ stroke: "currentColor",
12
+ strokeWidth: 2,
13
+ strokeLinecap: "round",
14
+ strokeLinejoin: "round",
15
+ ...props,
16
+ children: [/* @__PURE__ */ jsx("title", { children: title ?? "check" }), /* @__PURE__ */ jsx("polyline", { points: "20 6 9 17 4 12" })]
17
+ });
18
+
19
+ //#endregion
20
+ //#region src/assets/icons/__generated__/general/eye.tsx
21
+ const Eye = ({ title, ...props }) => /* @__PURE__ */ jsxs("svg", {
22
+ viewBox: "0 0 24 24",
23
+ fill: "none",
24
+ ...props,
25
+ children: [
26
+ /* @__PURE__ */ jsx("path", {
27
+ d: "M2.42012 12.7132C2.28394 12.4975 2.21584 12.3897 2.17772 12.2234C2.14909 12.0985 2.14909 11.9015 2.17772 11.7766C2.21584 11.6103 2.28394 11.5025 2.42012 11.2868C3.54553 9.50484 6.8954 5 12.0004 5C17.1054 5 20.4553 9.50484 21.5807 11.2868C21.7169 11.5025 21.785 11.6103 21.8231 11.7766C21.8517 11.9015 21.8517 12.0985 21.8231 12.2234C21.785 12.3897 21.7169 12.4975 21.5807 12.7132C20.4553 14.4952 17.1054 19 12.0004 19C6.8954 19 3.54553 14.4952 2.42012 12.7132Z",
28
+ stroke: "currentColor",
29
+ strokeWidth: 2,
30
+ strokeLinecap: "round",
31
+ strokeLinejoin: "round"
32
+ }),
33
+ /* @__PURE__ */ jsx("title", { children: title ?? "eye" }),
34
+ /* @__PURE__ */ jsx("path", {
35
+ d: "M12.0004 15C13.6573 15 15.0004 13.6569 15.0004 12C15.0004 10.3431 13.6573 9 12.0004 9C10.3435 9 9.0004 10.3431 9.0004 12C9.0004 13.6569 10.3435 15 12.0004 15Z",
36
+ stroke: "currentColor",
37
+ strokeWidth: 2,
38
+ strokeLinecap: "round",
39
+ strokeLinejoin: "round"
40
+ })
41
+ ]
42
+ });
43
+
44
+ //#endregion
45
+ //#region src/assets/icons/__generated__/general/eye-off.tsx
46
+ const EyeOff = ({ title, ...props }) => /* @__PURE__ */ jsxs("svg", {
47
+ viewBox: "0 0 24 24",
48
+ fill: "none",
49
+ ...props,
50
+ children: [/* @__PURE__ */ jsx("path", {
51
+ d: "M10.7429 5.09232C11.1494 5.03223 11.5686 5 12.0004 5C17.1054 5 20.4553 9.50484 21.5807 11.2868C21.7169 11.5025 21.785 11.6103 21.8231 11.7767C21.8518 11.9016 21.8517 12.0987 21.8231 12.2236C21.7849 12.3899 21.7164 12.4985 21.5792 12.7156C21.2793 13.1901 20.8222 13.8571 20.2165 14.5805M6.72432 6.71504C4.56225 8.1817 3.09445 10.2194 2.42111 11.2853C2.28428 11.5019 2.21587 11.6102 2.17774 11.7765C2.1491 11.9014 2.14909 12.0984 2.17771 12.2234C2.21583 12.3897 2.28393 12.4975 2.42013 12.7132C3.54554 14.4952 6.89541 19 12.0004 19C14.0588 19 15.8319 18.2676 17.2888 17.2766M3.00042 3L21.0004 21M9.8791 9.87868C9.3362 10.4216 9.00042 11.1716 9.00042 12C9.00042 13.6569 10.3436 15 12.0004 15C12.8288 15 13.5788 14.6642 14.1217 14.1213",
52
+ stroke: "currentColor",
53
+ strokeWidth: 2,
54
+ strokeLinecap: "round",
55
+ strokeLinejoin: "round"
56
+ }), /* @__PURE__ */ jsx("title", { children: title ?? "eye-off" })]
57
+ });
58
+
59
+ //#endregion
60
+ //#region src/assets/icons/__generated__/brands/facebook.tsx
61
+ const Facebook = ({ title, ...props }) => /* @__PURE__ */ jsxs("svg", {
62
+ width: "16",
63
+ height: "16",
64
+ viewBox: "0 0 16 16",
65
+ fill: "none",
66
+ ...props,
67
+ children: [/* @__PURE__ */ jsx("path", {
68
+ d: "M16 8C16 11.9927 13.0707 15.3027 9.24667 15.9033V10.328H11.106L11.46 8.02133H9.24667V6.52467C9.24667 5.89333 9.556 5.27867 10.5467 5.27867H11.5527V3.31467C11.5527 3.31467 10.6393 3.15867 9.76667 3.15867C7.944 3.15867 6.75333 4.26333 6.75333 6.26267V8.02067H4.72733V10.3273H6.75333V15.9027C2.93 15.3013 0 11.992 0 8C0 3.582 3.582 0 8 0C12.418 0 16 3.58133 16 8Z",
69
+ fill: "currentColor"
70
+ }), /* @__PURE__ */ jsx("title", { children: title ?? "facebook" })]
71
+ });
72
+
73
+ //#endregion
74
+ //#region src/assets/icons/__generated__/brands/facebook-fit.tsx
75
+ const FacebookFit = ({ title, ...props }) => /* @__PURE__ */ jsxs("svg", {
76
+ viewBox: "0 0 1024 1024",
77
+ id: "facebook",
78
+ ...props,
79
+ children: [
80
+ /* @__PURE__ */ jsx("path", {
81
+ fill: "#1877f2",
82
+ d: "M1024,512C1024,229.23016,794.76978,0,512,0S0,229.23016,0,512c0,255.554,187.231,467.37012,432,505.77777V660H302V512H432V399.2C432,270.87982,508.43854,200,625.38922,200,681.40765,200,740,210,740,210V336H675.43713C611.83508,336,592,375.46667,592,415.95728V512H734L711.3,660H592v357.77777C836.769,979.37012,1024,767.554,1024,512Z"
83
+ }),
84
+ /* @__PURE__ */ jsx("title", { children: title ?? "facebook-fit" }),
85
+ /* @__PURE__ */ jsx("path", {
86
+ fill: "#fff",
87
+ d: "M711.3,660,734,512H592V415.95728C592,375.46667,611.83508,336,675.43713,336H740V210s-58.59235-10-114.61078-10C508.43854,200,432,270.87982,432,399.2V512H302V660H432v357.77777a517.39619,517.39619,0,0,0,160,0V660Z"
88
+ })
89
+ ]
90
+ });
91
+
92
+ //#endregion
93
+ //#region src/assets/icons/__generated__/brands/google.tsx
94
+ const Google = ({ title, ...props }) => /* @__PURE__ */ jsx("svg", {
95
+ width: "800px",
96
+ height: "800px",
97
+ viewBox: "-3 0 262 262",
98
+ version: "1.1",
99
+ preserveAspectRatio: "xMidYMid",
100
+ ...props,
101
+ children: /* @__PURE__ */ jsxs("g", { children: [
102
+ /* @__PURE__ */ jsx("path", {
103
+ d: "M255.878,133.451 C255.878,122.717 255.007,114.884 253.122,106.761 L130.55,106.761 L130.55,155.209 L202.497,155.209 C201.047,167.249 193.214,185.381 175.807,197.565 L175.563,199.187 L214.318,229.21 L217.003,229.478 C241.662,206.704 255.878,173.196 255.878,133.451",
104
+ fill: "#4285F4"
105
+ }),
106
+ /* @__PURE__ */ jsx("title", { children: title ?? "google" }),
107
+ /* @__PURE__ */ jsx("path", {
108
+ d: "M130.55,261.1 C165.798,261.1 195.389,249.495 217.003,229.478 L175.807,197.565 C164.783,205.253 149.987,210.62 130.55,210.62 C96.027,210.62 66.726,187.847 56.281,156.37 L54.75,156.5 L14.452,187.687 L13.925,189.152 C35.393,231.798 79.49,261.1 130.55,261.1",
109
+ fill: "#34A853"
110
+ }),
111
+ /* @__PURE__ */ jsx("path", {
112
+ d: "M56.281,156.37 C53.525,148.247 51.93,139.543 51.93,130.55 C51.93,121.556 53.525,112.853 56.136,104.73 L56.063,103 L15.26,71.312 L13.925,71.947 C5.077,89.644 0,109.517 0,130.55 C0,151.583 5.077,171.455 13.925,189.152 L56.281,156.37",
113
+ fill: "#FBBC05"
114
+ }),
115
+ /* @__PURE__ */ jsx("path", {
116
+ d: "M130.55,50.479 C155.064,50.479 171.6,61.068 181.029,69.917 L217.873,33.943 C195.245,12.91 165.798,0 130.55,0 C79.49,0 35.393,29.301 13.925,71.947 L56.136,104.73 C66.726,73.253 96.027,50.479 130.55,50.479",
117
+ fill: "#EB4335"
118
+ })
119
+ ] })
120
+ });
121
+
122
+ //#endregion
123
+ //#region src/assets/icons/index.tsx
124
+ /** biome-ignore-all lint/suspicious/noShadowRestrictedNames: generated */
125
+ const icons = {
126
+ "brands-facebook": /* @__PURE__ */ jsx(Facebook, {}),
127
+ "brands-facebook-fit": /* @__PURE__ */ jsx(FacebookFit, {}),
128
+ "brands-google": /* @__PURE__ */ jsx(Google, {}),
129
+ "general-check": /* @__PURE__ */ jsx(Check, {}),
130
+ "general-eye": /* @__PURE__ */ jsx(Eye, {}),
131
+ "general-eye-off": /* @__PURE__ */ jsx(EyeOff, {})
132
+ };
133
+ var icons_default = icons;
134
+
135
+ //#endregion
136
+ //#region src/components/toolkit/Icon/constants.ts
137
+ const ICON_SIZE_MAP = {
138
+ xs: {
139
+ width: "0.75rem",
140
+ height: "0.75rem"
141
+ },
142
+ sm: {
143
+ width: "1rem",
144
+ height: "1rem"
145
+ },
146
+ md: {
147
+ width: "1.25rem",
148
+ height: "1.25rem"
149
+ },
150
+ lg: {
151
+ width: "1.5rem",
152
+ height: "1.5rem"
153
+ },
154
+ xl: {
155
+ width: "1.75rem",
156
+ height: "1.75rem"
157
+ },
158
+ "2xl": {
159
+ width: "2rem",
160
+ height: "2rem"
161
+ },
162
+ "3xl": {
163
+ width: "2.5rem",
164
+ height: "2.5rem"
165
+ }
166
+ };
167
+
168
+ //#endregion
169
+ //#region src/components/toolkit/Icon/style.ts
170
+ function createIconStyles(props) {
171
+ const { color, size = "md" } = props;
172
+ return { container: {
173
+ display: "inline-flex",
174
+ alignItems: "center",
175
+ justifyContent: "center",
176
+ color: color === "primary" ? "var(--px-text-primary)" : color === "secondary" ? "var(--px-text-secondary)" : color,
177
+ ...ICON_SIZE_MAP[size]
178
+ } };
179
+ }
180
+
181
+ //#endregion
182
+ //#region src/components/toolkit/Icon/index.tsx
183
+ const Icon = (props) => {
184
+ const { name } = props;
185
+ const { styles, classes } = useThemedStyles(props, createIconStyles, {
186
+ pick: (p) => [p.color, p.size],
187
+ override: props.styles,
188
+ applyCommonProps: true
189
+ });
190
+ const IconComponent = useMemo(() => {
191
+ return icons_default[name];
192
+ }, [name]);
193
+ if (!IconComponent) {
194
+ console.warn(`Icon "${name}" not found.`);
195
+ return null;
196
+ }
197
+ return /* @__PURE__ */ jsx(Suspense, {
198
+ fallback: null,
199
+ children: /* @__PURE__ */ jsx("span", {
200
+ className: classes.container,
201
+ style: styles.container,
202
+ children: IconComponent
203
+ })
204
+ });
205
+ };
206
+
207
+ //#endregion
208
+ export { Icon as t };
209
+ //# sourceMappingURL=Icon-DP_mHQ2j.js.map
package/dist/Icon-DP_mHQ2j.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Icon-DP_mHQ2j.js","names":["ICON_SIZE_MAP: Record<string, CSSProperties>","IconLoaders"],"sources":["../src/assets/icons/__generated__/general/check.tsx","../src/assets/icons/__generated__/general/eye.tsx","../src/assets/icons/__generated__/general/eye-off.tsx","../src/assets/icons/__generated__/brands/facebook.tsx","../src/assets/icons/__generated__/brands/facebook-fit.tsx","../src/assets/icons/__generated__/brands/google.tsx","../src/assets/icons/index.tsx","../src/components/toolkit/Icon/constants.ts","../src/components/toolkit/Icon/style.ts","../src/components/toolkit/Icon/index.tsx"],"sourcesContent":["// Auto-generated from general/check.svg. Do not edit manually.\n\n// External Libraries\nimport type { SVGProps } from 'react'\n\nexport type CheckProps = SVGProps<SVGSVGElement> & { title?: string }\n\nexport const Check = ({ title, ...props }: CheckProps) => (\n<svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth={2} strokeLinecap=\"round\" strokeLinejoin=\"round\" {...props}>\n <title>{title ?? 'check'}</title><polyline points=\"20 6 9 17 4 12\"></polyline></svg>\n)\n","// Auto-generated from general/eye.svg. Do not edit manually.\n\n// External Libraries\nimport type { SVGProps } from 'react'\n\nexport type EyeProps = SVGProps<SVGSVGElement> & { title?: string }\n\nexport const Eye = ({ title, ...props }: EyeProps) => (\n<svg viewBox=\"0 0 24 24\" fill=\"none\" {...props}>\n<path d=\"M2.42012 12.7132C2.28394 12.4975 2.21584 12.3897 2.17772 12.2234C2.14909 12.0985 2.14909 11.9015 2.17772 11.7766C2.21584 11.6103 2.28394 11.5025 2.42012 11.2868C3.54553 9.50484 6.8954 5 12.0004 5C17.1054 5 20.4553 9.50484 21.5807 11.2868C21.7169 11.5025 21.785 11.6103 21.8231 11.7766C21.8517 11.9015 21.8517 12.0985 21.8231 12.2234C21.785 12.3897 21.7169 12.4975 21.5807 12.7132C20.4553 14.4952 17.1054 19 12.0004 19C6.8954 19 3.54553 14.4952 2.42012 12.7132Z\" stroke=\"currentColor\" strokeWidth={2} strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n <title>{title ?? 'eye'}</title>\n<path d=\"M12.0004 15C13.6573 15 15.0004 13.6569 15.0004 12C15.0004 10.3431 13.6573 9 12.0004 9C10.3435 9 9.0004 10.3431 9.0004 12C9.0004 13.6569 10.3435 15 12.0004 15Z\" stroke=\"currentColor\" strokeWidth={2} strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n</svg>\n)\n","// Auto-generated from general/eye-off.svg. Do not edit manually.\n\n// External Libraries\nimport type { SVGProps } from 'react'\n\nexport type EyeOffProps = SVGProps<SVGSVGElement> & { title?: string }\n\nexport const EyeOff = ({ title, ...props }: EyeOffProps) => (\n<svg viewBox=\"0 0 24 24\" fill=\"none\" {...props}>\n<path d=\"M10.7429 5.09232C11.1494 5.03223 11.5686 5 12.0004 5C17.1054 5 20.4553 9.50484 21.5807 11.2868C21.7169 11.5025 21.785 11.6103 21.8231 11.7767C21.8518 11.9016 21.8517 12.0987 21.8231 12.2236C21.7849 12.3899 21.7164 12.4985 21.5792 12.7156C21.2793 13.1901 20.8222 13.8571 20.2165 14.5805M6.72432 6.71504C4.56225 8.1817 3.09445 10.2194 2.42111 11.2853C2.28428 11.5019 2.21587 11.6102 2.17774 11.7765C2.1491 11.9014 2.14909 12.0984 2.17771 12.2234C2.21583 12.3897 2.28393 12.4975 2.42013 12.7132C3.54554 14.4952 6.89541 19 12.0004 19C14.0588 19 15.8319 18.2676 17.2888 17.2766M3.00042 3L21.0004 21M9.8791 9.87868C9.3362 10.4216 9.00042 11.1716 9.00042 12C9.00042 13.6569 10.3436 15 12.0004 15C12.8288 15 13.5788 14.6642 14.1217 14.1213\" stroke=\"currentColor\" strokeWidth={2} strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n <title>{title ?? 'eye-off'}</title>\n</svg>\n)\n","// Auto-generated from brands/facebook.svg. Do not edit manually.\n\n// External Libraries\nimport type { SVGProps } from 'react'\n\nexport type FacebookProps = SVGProps<SVGSVGElement> & { title?: string }\n\nexport const Facebook = ({ title, ...props }: FacebookProps) => (\n<svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" {...props}>\n<path d=\"M16 8C16 11.9927 13.0707 15.3027 9.24667 15.9033V10.328H11.106L11.46 8.02133H9.24667V6.52467C9.24667 5.89333 9.556 5.27867 10.5467 5.27867H11.5527V3.31467C11.5527 3.31467 10.6393 3.15867 9.76667 3.15867C7.944 3.15867 6.75333 4.26333 6.75333 6.26267V8.02067H4.72733V10.3273H6.75333V15.9027C2.93 15.3013 0 11.992 0 8C0 3.582 3.582 0 8 0C12.418 0 16 3.58133 16 8Z\" fill=\"currentColor\"/>\n <title>{title ?? 'facebook'}</title>\n</svg>\n)\n","// Auto-generated from brands/facebook-fit.svg. Do not edit manually.\n\n// External Libraries\nimport type { SVGProps } from 'react'\n\nexport type FacebookFitProps = SVGProps<SVGSVGElement> & { title?: string }\n\nexport const FacebookFit = ({ title, ...props }: FacebookFitProps) => (\n<svg viewBox=\"0 0 1024 1024\" id=\"facebook\" {...props}>\n <path fill=\"#1877f2\" d=\"M1024,512C1024,229.23016,794.76978,0,512,0S0,229.23016,0,512c0,255.554,187.231,467.37012,432,505.77777V660H302V512H432V399.2C432,270.87982,508.43854,200,625.38922,200,681.40765,200,740,210,740,210V336H675.43713C611.83508,336,592,375.46667,592,415.95728V512H734L711.3,660H592v357.77777C836.769,979.37012,1024,767.554,1024,512Z\"></path>\n <title>{title ?? 'facebook-fit'}</title>\n <path fill=\"#fff\" d=\"M711.3,660,734,512H592V415.95728C592,375.46667,611.83508,336,675.43713,336H740V210s-58.59235-10-114.61078-10C508.43854,200,432,270.87982,432,399.2V512H302V660H432v357.77777a517.39619,517.39619,0,0,0,160,0V660Z\"></path>\n</svg>\n)\n","// Auto-generated from brands/google.svg. Do not edit manually.\n\n// External Libraries\nimport type { SVGProps } from 'react'\n\nexport type GoogleProps = SVGProps<SVGSVGElement> & { title?: string }\n\nexport const Google = ({ title, ...props }: GoogleProps) => (\n<svg width=\"800px\" height=\"800px\" viewBox=\"-3 0 262 262\" version=\"1.1\" preserveAspectRatio=\"xMidYMid\" {...props}>\n\t<g>\n\t\t<path d=\"M255.878,133.451 C255.878,122.717 255.007,114.884 253.122,106.761 L130.55,106.761 L130.55,155.209 L202.497,155.209 C201.047,167.249 193.214,185.381 175.807,197.565 L175.563,199.187 L214.318,229.21 L217.003,229.478 C241.662,206.704 255.878,173.196 255.878,133.451\" fill=\"#4285F4\"></path>\n <title>{title ?? 'google'}</title>\n\t\t<path d=\"M130.55,261.1 C165.798,261.1 195.389,249.495 217.003,229.478 L175.807,197.565 C164.783,205.253 149.987,210.62 130.55,210.62 C96.027,210.62 66.726,187.847 56.281,156.37 L54.75,156.5 L14.452,187.687 L13.925,189.152 C35.393,231.798 79.49,261.1 130.55,261.1\" fill=\"#34A853\"></path>\n\t\t<path d=\"M56.281,156.37 C53.525,148.247 51.93,139.543 51.93,130.55 C51.93,121.556 53.525,112.853 56.136,104.73 L56.063,103 L15.26,71.312 L13.925,71.947 C5.077,89.644 0,109.517 0,130.55 C0,151.583 5.077,171.455 13.925,189.152 L56.281,156.37\" fill=\"#FBBC05\"></path>\n\t\t<path d=\"M130.55,50.479 C155.064,50.479 171.6,61.068 181.029,69.917 L217.873,33.943 C195.245,12.91 165.798,0 130.55,0 C79.49,0 35.393,29.301 13.925,71.947 L56.136,104.73 C66.726,73.253 96.027,50.479 130.55,50.479\" fill=\"#EB4335\"></path>\n\t</g>\n</svg>\n)\n","// Auto-generated by generate-icon-components.sh. Do not edit manually.\n/** biome-ignore-all lint/suspicious/noShadowRestrictedNames: generated */\n\nimport { Check } from './__generated__/general/check'\nimport { Eye } from './__generated__/general/eye'\nimport { EyeOff } from './__generated__/general/eye-off'\nimport { Facebook } from './__generated__/brands/facebook'\nimport { FacebookFit } from './__generated__/brands/facebook-fit'\nimport { Google } from './__generated__/brands/google'\n\nconst icons = {\n 'brands-facebook': <Facebook />,\n 'brands-facebook-fit': <FacebookFit />,\n 'brands-google': <Google />,\n 'general-check': <Check />,\n 'general-eye': <Eye />,\n 'general-eye-off': <EyeOff />,\n}\n\nexport type IconName = keyof typeof icons\nexport default icons\n","// External Libraries\nimport type { CSSProperties } from \"react\";\n\nexport const ICON_SIZE_MAP: Record<string, CSSProperties> = {\n xs: {\n width: '0.75rem',\n height: '0.75rem'\n },\n sm: {\n width: '1rem',\n height: '1rem'\n },\n md: {\n width: '1.25rem',\n height: '1.25rem'\n },\n lg: {\n width: '1.5rem',\n height: '1.5rem'\n },\n xl: {\n width: '1.75rem',\n height: '1.75rem'\n },\n '2xl': {\n width: '2rem',\n height: '2rem'\n },\n '3xl': {\n width: '2.5rem',\n height: '2.5rem'\n }\n} as const","// External Libraries\nimport type { CSSProperties } from 'react'\n\n// Types\nimport type { IconProps } from './types'\n\n// Utils\nimport { ICON_SIZE_MAP } from './constants'\n\nexport function createIconStyles(props: IconProps) {\n const { color, size = 'md' } = props\n\n return {\n container: {\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n color:\n color === 'primary'\n ? 'var(--px-text-primary)'\n : color === 'secondary'\n ? 'var(--px-text-secondary)'\n : color,\n ...ICON_SIZE_MAP[size]\n } as CSSProperties\n }\n}\n","// External Libraries\nimport { Suspense, useMemo } from 'react'\n\n// Components\nimport IconLoaders from '@assets/icons'\n\n// Types\nimport type { IconProps } from './types'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Styles\nimport { createIconStyles } from './style'\n\nexport const Icon = (props: IconProps) => {\n const { name } = props\n\n // Hooks\n const { styles, classes } = useThemedStyles(props, createIconStyles, {\n pick: p => [p.color, p.size],\n override: props.styles,\n applyCommonProps: true\n })\n\n // Constants\n const IconComponent = useMemo(() => {\n const loader = IconLoaders[name]\n return loader\n }, [name])\n\n if (!IconComponent) {\n console.warn(`Icon \"${name}\" not found.`)\n return null\n }\n\n return (\n <Suspense fallback={null}>\n <span className={classes.container} style={styles.container}>\n {IconComponent}\n </span>\n </Suspense>\n )\n}\n"],"mappings":"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"}
package/dist/{InfoSummary-DVuk2_3H.js → InfoSummary-DG1mzcP0.js} RENAMED
@@ -1,4 +1,4 @@
1
- import { n as useThemedStyles, t as Typography } from "./Typography-DRln739F.js";
1
+ import { n as useThemedStyles, t as Typography } from "./Typography-B9X7_xlT.js";
2
2
  import { jsx, jsxs } from "react/jsx-runtime";
3
3
 
4
4
  //#region src/components/toolkit/InfoSummary/components/SummaryItem/components/SummaryHeader/styles.ts
@@ -247,4 +247,4 @@ const InfoSummary = ({ infos, loading }) => {
247
247
 
248
248
  //#endregion
249
249
  export { InfoSummary as t };
250
- //# sourceMappingURL=InfoSummary-DVuk2_3H.js.map
250
+ //# sourceMappingURL=InfoSummary-DG1mzcP0.js.map
package/dist/{InfoSummary-DVuk2_3H.js.map → InfoSummary-DG1mzcP0.js.map} RENAMED
@@ -1 +1 @@
1
- {"version":3,"file":"InfoSummary-DVuk2_3H.js","names":["SummaryHeader: React.FC<Props>","SummaryCaption: React.FC<Props>","SummaryHighlight: React.FC<Props>","SummaryItem: React.FC<SummaryItemProps>","InfoSummary: React.FC<InfoSummaryProps>"],"sources":["../src/components/toolkit/InfoSummary/components/SummaryItem/components/SummaryHeader/styles.ts","../src/components/toolkit/InfoSummary/components/SummaryItem/components/SummaryHeader/index.tsx","../src/components/toolkit/InfoSummary/components/SummaryItem/components/SummaryCaption/styles.ts","../src/components/toolkit/InfoSummary/components/SummaryItem/components/SummaryCaption/index.tsx","../src/components/toolkit/InfoSummary/components/SummaryItem/components/SummaryHighlight/styles.ts","../src/components/toolkit/InfoSummary/components/SummaryItem/components/SummaryHighlight/index.tsx","../src/components/toolkit/InfoSummary/components/SummaryItem/styles.ts","../src/components/toolkit/InfoSummary/components/SummaryItem/index.tsx","../src/components/toolkit/InfoSummary/styles.ts","../src/components/toolkit/InfoSummary/index.tsx"],"sourcesContent":["// Types\nimport type { StyleMap } from '@hooks/useThemedStyles/types'\n\nexport function createSummaryHeaderStyles(): StyleMap {\n return {\n container: {\n width: '100%',\n minHeight: '1rem',\n\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'flex-end',\n\n gap: '0.125rem'\n },\n\n iconContainer: {\n display: 'flex',\n alignItems: 'flex-start'\n },\n\n textContainer: {\n flex: '1',\n maxWidth: '8rem',\n\n display: 'flex',\n alignItems: 'flex-start',\n\n __rules: {\n '& > p': {\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis'\n }\n }\n }\n }\n}\n","// External Libraries\nimport type React from 'react'\nimport type { ReactNode } from 'react'\n\n// Components\nimport { Typography } from '@components/toolkit/Typography'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Styles\nimport { createSummaryHeaderStyles } from './styles'\n\ninterface Props {\n title: string\n icon?: ReactNode\n}\n\nexport const SummaryHeader: React.FC<Props> = ({ icon, title }) => {\n const { styles } = useThemedStyles({}, createSummaryHeaderStyles)\n\n return (\n <header style={styles.container}>\n {icon ? <div style={styles.iconContainer}>{icon}</div> : null}\n\n <div style={styles.textContainer}>\n <Typography\n variant=\"b1\"\n fontWeight=\"bold\"\n lineHeight=\"100%\"\n fontSize=\"0.75rem\"\n >\n {title}\n </Typography>\n </div>\n </header>\n )\n}\n","// Types\nimport type { StyleMap } from '@hooks/useThemedStyles/types'\n\nexport function createSummaryCaptionStyles(): StyleMap {\n return {\n container: {\n width: '100%',\n minHeight: '0.625rem',\n\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center',\n justifyItems: 'start',\n\n columnGap: '0.125rem'\n },\n\n textContainer: {\n flex: '1',\n maxWidth: '8rem',\n\n display: 'flex',\n alignItems: 'center',\n\n __rules: {\n '& > p': {\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis'\n }\n }\n }\n }\n}\n","// External Libraries\nimport type React from 'react'\n\n// Components\nimport { Typography } from '@components/toolkit/Typography'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Styles\nimport { createSummaryCaptionStyles } from './styles'\n\ninterface Props {\n loading?: boolean\n captionText?: string\n}\n\nexport const SummaryCaption: React.FC<Props> = ({ loading, captionText }) => {\n // Hooks\n const { styles } = useThemedStyles({}, createSummaryCaptionStyles)\n\n return (\n <div style={styles.container}>\n <div style={styles.textContainer}>\n <Typography\n variant=\"b3\"\n lineHeight=\"100%\"\n isLoading={loading}\n fontSize=\"0.625rem\"\n color=\"var(--px-text-secondary)\"\n >\n {captionText}\n </Typography>\n </div>\n </div>\n )\n}\n","// Types\nimport type { StyleMap } from '@hooks/useThemedStyles/types'\n\nexport function createSummaryHighlightStyles(): StyleMap {\n return {\n container: {\n width: '100%',\n minHeight: '1rem',\n\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'flex-end',\n\n columnGap: '0.125rem'\n },\n\n iconContainer: {\n display: 'flex',\n alignItems: 'flex-start'\n },\n\n textContainer: {\n flex: '1',\n maxWidth: '8rem',\n\n display: 'flex',\n alignItems: 'flex-start',\n\n __rules: {\n '& > p': {\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n lineHeight: '1'\n }\n }\n }\n }\n}\n","// External Libraries\nimport type React from 'react'\nimport type { ReactNode } from 'react'\n\n// Components\nimport { Typography } from '@components/toolkit/Typography'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Styles\nimport { createSummaryHighlightStyles } from './styles'\n\ninterface Props {\n loading?: boolean\n highlightText?: string\n highlightIcon?: ReactNode\n}\n\nexport const SummaryHighlight: React.FC<Props> = ({\n loading,\n highlightText,\n highlightIcon\n}) => {\n // Hooks\n const { styles } = useThemedStyles({}, createSummaryHighlightStyles)\n\n return (\n <div style={styles.container}>\n {highlightIcon ? (\n <div style={styles.iconContainer}>{highlightIcon}</div>\n ) : null}\n\n <div style={styles.textContainer}>\n <Typography\n variant=\"b1\"\n lineHeight=\"100%\"\n fontSize=\"0.875rem\"\n fontWeight=\"normal\"\n isLoading={loading}\n >\n {highlightText}\n </Typography>\n </div>\n </div>\n )\n}\n","// Types\nimport type { SummaryItemProps } from './types'\nimport type { StyleMap } from '@hooks/useThemedStyles/types'\n\nexport function createSummaryItemStyles(props: SummaryItemProps): StyleMap {\n return {\n container: {\n height: '100%',\n borderRight: props.isLast ? 'none' : '2px solid var(--border-secondary)'\n },\n\n content: {\n minWidth: '8rem',\n height: '100%',\n\n display: 'flex',\n flexDirection: 'column',\n justifyContent: 'space-between',\n\n paddingBlock: '0.5rem',\n paddingInline: '1rem'\n }\n }\n}\n","// External Libraries\nimport type React from 'react'\n\n// Components\nimport { SummaryHeader } from './components/SummaryHeader'\nimport { SummaryCaption } from './components/SummaryCaption'\nimport { SummaryHighlight } from './components/SummaryHighlight'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { SummaryItemProps } from './types'\n\n// Styles\nimport { createSummaryItemStyles } from './styles'\n\nexport const SummaryItem: React.FC<SummaryItemProps> = props => {\n // Hooks\n const { styles } = useThemedStyles(props, createSummaryItemStyles)\n\n return (\n <li style={styles.container}>\n <article style={styles.content}>\n <SummaryHeader icon={props.item.titleIcon} title={props.item.title} />\n\n <SummaryHighlight\n loading={props.loading}\n highlightText={props.item.highlight}\n highlightIcon={props.item.highlightIcon}\n />\n\n <SummaryCaption\n loading={props.loading}\n captionText={props.item.caption}\n />\n </article>\n </li>\n )\n}\n","// Types\nimport type { StyleMap } from '@hooks/useThemedStyles/types'\n\nexport function createInfoSummaryStyles(): StyleMap {\n return {\n section: {\n height: '5.5rem',\n minHeight: '5.5rem',\n\n width: 'fit-content',\n\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'flex-start',\n\n backgroundColor: 'var(--px-background-card-primary)',\n\n borderRadius: '10px',\n paddingBlock: 'var(--px-space-sm)'\n },\n\n summaryListContainer: {\n width: '100%',\n height: '100%',\n\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'flex-start'\n }\n }\n}\n","// External Libraries\nimport type React from 'react'\n\n// Components\nimport { SummaryItem } from './components/SummaryItem'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { InfoSummaryProps } from './types'\n\n// Styles\nimport { createInfoSummaryStyles } from './styles'\n\nexport * from './types'\n\nexport const InfoSummary: React.FC<InfoSummaryProps> = ({ infos, loading }) => {\n // Hooks\n const { styles } = useThemedStyles({}, createInfoSummaryStyles)\n\n // Functions\n function renderSummaryItems() {\n return (\n <ul style={styles.summaryListContainer}>\n {infos.map((info, index) => (\n <SummaryItem\n item={info}\n key={info.id}\n loading={loading}\n isLast={index === infos.length - 1}\n />\n ))}\n </ul>\n )\n }\n\n return <section style={styles.section}>{renderSummaryItems()}</section>\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"InfoSummary-DG1mzcP0.js","names":["SummaryHeader: React.FC<Props>","SummaryCaption: React.FC<Props>","SummaryHighlight: React.FC<Props>","SummaryItem: React.FC<SummaryItemProps>","InfoSummary: React.FC<InfoSummaryProps>"],"sources":["../src/components/toolkit/InfoSummary/components/SummaryItem/components/SummaryHeader/styles.ts","../src/components/toolkit/InfoSummary/components/SummaryItem/components/SummaryHeader/index.tsx","../src/components/toolkit/InfoSummary/components/SummaryItem/components/SummaryCaption/styles.ts","../src/components/toolkit/InfoSummary/components/SummaryItem/components/SummaryCaption/index.tsx","../src/components/toolkit/InfoSummary/components/SummaryItem/components/SummaryHighlight/styles.ts","../src/components/toolkit/InfoSummary/components/SummaryItem/components/SummaryHighlight/index.tsx","../src/components/toolkit/InfoSummary/components/SummaryItem/styles.ts","../src/components/toolkit/InfoSummary/components/SummaryItem/index.tsx","../src/components/toolkit/InfoSummary/styles.ts","../src/components/toolkit/InfoSummary/index.tsx"],"sourcesContent":["// Types\nimport type { StyleMap } from '@hooks/useThemedStyles/types'\n\nexport function createSummaryHeaderStyles(): StyleMap {\n return {\n container: {\n width: '100%',\n minHeight: '1rem',\n\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'flex-end',\n\n gap: '0.125rem'\n },\n\n iconContainer: {\n display: 'flex',\n alignItems: 'flex-start'\n },\n\n textContainer: {\n flex: '1',\n maxWidth: '8rem',\n\n display: 'flex',\n alignItems: 'flex-start',\n\n __rules: {\n '& > p': {\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis'\n }\n }\n }\n }\n}\n","// External Libraries\nimport type React from 'react'\nimport type { ReactNode } from 'react'\n\n// Components\nimport { Typography } from '@components/toolkit/Typography'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Styles\nimport { createSummaryHeaderStyles } from './styles'\n\ninterface Props {\n title: string\n icon?: ReactNode\n}\n\nexport const SummaryHeader: React.FC<Props> = ({ icon, title }) => {\n const { styles } = useThemedStyles({}, createSummaryHeaderStyles)\n\n return (\n <header style={styles.container}>\n {icon ? <div style={styles.iconContainer}>{icon}</div> : null}\n\n <div style={styles.textContainer}>\n <Typography\n variant=\"b1\"\n fontWeight=\"bold\"\n lineHeight=\"100%\"\n fontSize=\"0.75rem\"\n >\n {title}\n </Typography>\n </div>\n </header>\n )\n}\n","// Types\nimport type { StyleMap } from '@hooks/useThemedStyles/types'\n\nexport function createSummaryCaptionStyles(): StyleMap {\n return {\n container: {\n width: '100%',\n minHeight: '0.625rem',\n\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center',\n justifyItems: 'start',\n\n columnGap: '0.125rem'\n },\n\n textContainer: {\n flex: '1',\n maxWidth: '8rem',\n\n display: 'flex',\n alignItems: 'center',\n\n __rules: {\n '& > p': {\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis'\n }\n }\n }\n }\n}\n","// External Libraries\nimport type React from 'react'\n\n// Components\nimport { Typography } from '@components/toolkit/Typography'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Styles\nimport { createSummaryCaptionStyles } from './styles'\n\ninterface Props {\n loading?: boolean\n captionText?: string\n}\n\nexport const SummaryCaption: React.FC<Props> = ({ loading, captionText }) => {\n // Hooks\n const { styles } = useThemedStyles({}, createSummaryCaptionStyles)\n\n return (\n <div style={styles.container}>\n <div style={styles.textContainer}>\n <Typography\n variant=\"b3\"\n lineHeight=\"100%\"\n isLoading={loading}\n fontSize=\"0.625rem\"\n color=\"var(--px-text-secondary)\"\n >\n {captionText}\n </Typography>\n </div>\n </div>\n )\n}\n","// Types\nimport type { StyleMap } from '@hooks/useThemedStyles/types'\n\nexport function createSummaryHighlightStyles(): StyleMap {\n return {\n container: {\n width: '100%',\n minHeight: '1rem',\n\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'flex-end',\n\n columnGap: '0.125rem'\n },\n\n iconContainer: {\n display: 'flex',\n alignItems: 'flex-start'\n },\n\n textContainer: {\n flex: '1',\n maxWidth: '8rem',\n\n display: 'flex',\n alignItems: 'flex-start',\n\n __rules: {\n '& > p': {\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n lineHeight: '1'\n }\n }\n }\n }\n}\n","// External Libraries\nimport type React from 'react'\nimport type { ReactNode } from 'react'\n\n// Components\nimport { Typography } from '@components/toolkit/Typography'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Styles\nimport { createSummaryHighlightStyles } from './styles'\n\ninterface Props {\n loading?: boolean\n highlightText?: string\n highlightIcon?: ReactNode\n}\n\nexport const SummaryHighlight: React.FC<Props> = ({\n loading,\n highlightText,\n highlightIcon\n}) => {\n // Hooks\n const { styles } = useThemedStyles({}, createSummaryHighlightStyles)\n\n return (\n <div style={styles.container}>\n {highlightIcon ? (\n <div style={styles.iconContainer}>{highlightIcon}</div>\n ) : null}\n\n <div style={styles.textContainer}>\n <Typography\n variant=\"b1\"\n lineHeight=\"100%\"\n fontSize=\"0.875rem\"\n fontWeight=\"normal\"\n isLoading={loading}\n >\n {highlightText}\n </Typography>\n </div>\n </div>\n )\n}\n","// Types\nimport type { SummaryItemProps } from './types'\nimport type { StyleMap } from '@hooks/useThemedStyles/types'\n\nexport function createSummaryItemStyles(props: SummaryItemProps): StyleMap {\n return {\n container: {\n height: '100%',\n borderRight: props.isLast ? 'none' : '2px solid var(--border-secondary)'\n },\n\n content: {\n minWidth: '8rem',\n height: '100%',\n\n display: 'flex',\n flexDirection: 'column',\n justifyContent: 'space-between',\n\n paddingBlock: '0.5rem',\n paddingInline: '1rem'\n }\n }\n}\n","// External Libraries\nimport type React from 'react'\n\n// Components\nimport { SummaryHeader } from './components/SummaryHeader'\nimport { SummaryCaption } from './components/SummaryCaption'\nimport { SummaryHighlight } from './components/SummaryHighlight'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { SummaryItemProps } from './types'\n\n// Styles\nimport { createSummaryItemStyles } from './styles'\n\nexport const SummaryItem: React.FC<SummaryItemProps> = props => {\n // Hooks\n const { styles } = useThemedStyles(props, createSummaryItemStyles)\n\n return (\n <li style={styles.container}>\n <article style={styles.content}>\n <SummaryHeader icon={props.item.titleIcon} title={props.item.title} />\n\n <SummaryHighlight\n loading={props.loading}\n highlightText={props.item.highlight}\n highlightIcon={props.item.highlightIcon}\n />\n\n <SummaryCaption\n loading={props.loading}\n captionText={props.item.caption}\n />\n </article>\n </li>\n )\n}\n","// Types\nimport type { StyleMap } from '@hooks/useThemedStyles/types'\n\nexport function createInfoSummaryStyles(): StyleMap {\n return {\n section: {\n height: '5.5rem',\n minHeight: '5.5rem',\n\n width: 'fit-content',\n\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'flex-start',\n\n backgroundColor: 'var(--px-background-card-primary)',\n\n borderRadius: '10px',\n paddingBlock: 'var(--px-space-sm)'\n },\n\n summaryListContainer: {\n width: '100%',\n height: '100%',\n\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'flex-start'\n }\n }\n}\n","// External Libraries\nimport type React from 'react'\n\n// Components\nimport { SummaryItem } from './components/SummaryItem'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { InfoSummaryProps } from './types'\n\n// Styles\nimport { createInfoSummaryStyles } from './styles'\n\nexport * from './types'\n\nexport const InfoSummary: React.FC<InfoSummaryProps> = ({ infos, loading }) => {\n // Hooks\n const { styles } = useThemedStyles({}, createInfoSummaryStyles)\n\n // Functions\n function renderSummaryItems() {\n return (\n <ul style={styles.summaryListContainer}>\n {infos.map((info, index) => (\n <SummaryItem\n item={info}\n key={info.id}\n loading={loading}\n isLast={index === infos.length - 1}\n />\n ))}\n </ul>\n )\n }\n\n return <section style={styles.section}>{renderSummaryItems()}</section>\n}\n"],"mappings":"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"}