react-restyle-components 0.2.74 → 0.2.76

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/lib/index.d.ts CHANGED
@@ -1,2 +1,3 @@
1
1
  export * from './src/core-components';
2
+ export * from './src/core-utils';
2
3
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AAEA,cAAc,uBAAuB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AAEA,cAAc,uBAAuB,CAAC;AACtC,cAAc,kBAAkB,CAAC"}
package/lib/index.js CHANGED
@@ -1,3 +1,4 @@
1
1
  // import './tc.css';
2
2
  // import './global.css';
3
3
  export * from './src/core-components';
4
+ export * from './src/core-utils';
package/lib/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-restyle-components",
3
- "version": "0.2.73",
3
+ "version": "0.2.76",
4
4
  "private": false,
5
5
  "description": "Easy use restyle components",
6
6
  "author": {
@@ -14,8 +14,6 @@ export * from './atoms/timer/timer.component';
14
14
  export * from './atoms/tooltip/tooltip.component';
15
15
  export * from './atoms/icons/icons.component';
16
16
  export * from './atoms/tabs/tabs.component';
17
- export * from './atoms/grid/grid.component';
18
- export * from './atoms/list/list.component';
19
17
  export * from './atoms/pdf/pdf-images.components';
20
18
  export * from './atoms/pdf/pdf-table.components';
21
19
  export * from './atoms/pdf/pdf-typography.components';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/core-components/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,IAAI,MAAM,6BAA6B,CAAC;AACpD,cAAc,iCAAiC,CAAC;AAChD,cAAc,kDAAkD,CAAC;AACjE,cAAc,sCAAsC,CAAC;AACrD,cAAc,2CAA2C,CAAC;AAC1D,cAAc,mCAAmC,CAAC;AAClD,cAAc,mCAAmC,CAAC;AAClD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,iDAAiD,CAAC;AAChE,cAAc,iCAAiC,CAAC;AAChD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,mCAAmC,CAAC;AAClD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,mCAAmC,CAAC;AAClD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,mCAAmC,CAAC;AAClD,cAAc,kCAAkC,CAAC;AACjD,cAAc,uCAAuC,CAAC;AACtD,cAAc,yCAAyC,CAAC;AAExD,cAAc,+DAA+D,CAAC;AAC9E,cAAc,iJAAiJ,CAAC;AAChK,cAAc,6IAA6I,CAAC;AAC5J,cAAc,iDAAiD,CAAC;AAChE,cAAc,uEAAuE,CAAC;AACtF,cAAc,mCAAmC,CAAC;AAClD,cAAc,mDAAmD,CAAC;AAClE,cAAc,uCAAuC,CAAC;AACtD,cAAc,qEAAqE,CAAC;AACpF,cAAc,iDAAiD,CAAC;AAChE,cAAc,6DAA6D,CAAC;AAC5E,cAAc,6FAA6F,CAAC;AAE5G,OAAO,EAAC,IAAI,EAAC,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/core-components/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,IAAI,MAAM,6BAA6B,CAAC;AACpD,cAAc,iCAAiC,CAAC;AAChD,cAAc,kDAAkD,CAAC;AACjE,cAAc,sCAAsC,CAAC;AACrD,cAAc,2CAA2C,CAAC;AAC1D,cAAc,mCAAmC,CAAC;AAClD,cAAc,mCAAmC,CAAC;AAClD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,iDAAiD,CAAC;AAChE,cAAc,iCAAiC,CAAC;AAChD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,mCAAmC,CAAC;AAClD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,mCAAmC,CAAC;AAClD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,mCAAmC,CAAC;AAClD,cAAc,kCAAkC,CAAC;AACjD,cAAc,uCAAuC,CAAC;AACtD,cAAc,yCAAyC,CAAC;AAExD,cAAc,+DAA+D,CAAC;AAC9E,cAAc,iJAAiJ,CAAC;AAChK,cAAc,6IAA6I,CAAC;AAC5J,cAAc,iDAAiD,CAAC;AAChE,cAAc,uEAAuE,CAAC;AACtF,cAAc,mCAAmC,CAAC;AAClD,cAAc,mDAAmD,CAAC;AAClE,cAAc,uCAAuC,CAAC;AACtD,cAAc,qEAAqE,CAAC;AACpF,cAAc,iDAAiD,CAAC;AAChE,cAAc,6DAA6D,CAAC;AAC5E,cAAc,6FAA6F,CAAC;AAE5G,OAAO,EAAC,IAAI,EAAC,CAAC"}
@@ -14,8 +14,6 @@ export * from './atoms/timer/timer.component';
14
14
  export * from './atoms/tooltip/tooltip.component';
15
15
  export * from './atoms/icons/icons.component';
16
16
  export * from './atoms/tabs/tabs.component';
17
- export * from './atoms/grid/grid.component';
18
- export * from './atoms/list/list.component';
19
17
  export * from './atoms/pdf/pdf-images.components';
20
18
  export * from './atoms/pdf/pdf-table.components';
21
19
  export * from './atoms/pdf/pdf-typography.components';
@@ -1 +1 @@
1
- {"version":3,"file":"modal.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/molecules/modal/modal.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAEvC,MAAM,WAAW,UAAU;IACzB,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,KAAK,wDAMf,UAAU,4CAyCZ,CAAC"}
1
+ {"version":3,"file":"modal.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/molecules/modal/modal.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAIvC,MAAM,WAAW,UAAU;IACzB,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,KAAK,wDAMf,UAAU,4CAyHZ,CAAC"}
@@ -1,5 +1,7 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
2
  import React, { useEffect } from 'react';
3
+ import s from '../../../tc.module.css';
4
+ import { cn } from '../../../core-utils';
3
5
  export const Modal = ({ visible, title = '', onClose, isAutoClose = false, children, }) => {
4
6
  const [showModal, setShowModal] = React.useState(visible);
5
7
  useEffect(() => {
@@ -10,8 +12,8 @@ export const Modal = ({ visible, title = '', onClose, isAutoClose = false, child
10
12
  }, 1000);
11
13
  }
12
14
  }, [visible]);
13
- return (_jsx(_Fragment, { children: showModal && (_jsxs(_Fragment, { children: [_jsx("div", { className: "justify-center items-center overflow-x-hidden overflow-y-auto fixed inset-0 z-50 outline-none focus:outline-none", children: _jsx("div", { className: "relative w-auto my-5 mx-auto max-w-7xl", children: _jsxs("div", { className: "border-0 rounded-lg shadow-lg relative flex flex-col bg-white outline-none focus:outline-none", children: [_jsxs("div", { className: "flex items-start justify-between p-2 border-b border-solid border-gray-300 rounded-t", children: [_jsx("h3", { className: "text-xl font-semibold", children: title }), _jsx("button", { className: "p-1 border-0 text-black opacity-1 ml-6 float-right text-3xl leading-none font-semibold outline-none focus:outline-none", onClick: () => {
15
+ return (_jsx(_Fragment, { children: showModal && (_jsxs(_Fragment, { children: [_jsx("div", { className: cn(s['flex'], s['justify-center'], s['items-center'], s['overflow-x-hidden'], s['overflow-y-auto'], s['fixed'], s['inset-0'], s['z-50'], s['outline-none'], s['focus:outline-none']), children: _jsx("div", { className: cn(s['relative'], s['w-auto'], s['my-5'], s['mx-auto'], s['max-w-7xl']), children: _jsxs("div", { className: cn(s['border-0'], s['rounded-lg'], s['shadow-lg'], s['relative'], s['flex'], s['flex-col'], s['bg-white'], s['outline-none'], s['focus:outline-none']), children: [_jsxs("div", { className: cn(s['flex'], s['items-start'], s['justify-between'], s['p-2'], s['border-b'], s['border-solid'], s['border-gray-300'], s['rounded-t']), children: [_jsx("h3", { className: cn(s['text-xl'], s['font-semibold']), children: title }), _jsx("button", { className: cn(s['p-1'], s['border-0'], s['text-black'], s['opacity-1'], s['ml-6'], s['float-right'], s['text-3xl'], s['leading-none'], s['font-semibold'], s['outline-none'], s['focus:outline-none']), onClick: () => {
14
16
  onClose && onClose();
15
17
  setShowModal(false);
16
- }, children: _jsx("span", { className: " text-black h-6 w-6 text-2xl block outline-none focus:outline-none", children: "\u00D7" }) })] }), _jsx("div", { className: "flex p-2 w-auto h-auto ", children: children })] }) }) }), _jsx("div", { className: "opacity-25 fixed inset-0 z-40 bg-black" })] })) }));
18
+ }, children: _jsx("span", { className: cn(s['text-black'], s['h-6'], s['w-6'], s['text-2xl'], s['block'], s['outline-none'], s['focus:outline-none']), children: "\u00D7" }) })] }), _jsx("div", { className: cn(s['flex'], s['p-2'], s['w-auto'], s['h-auto']), children: children })] }) }) }), _jsx("div", { className: cn(s['opacity-25'], s['fixed'], s['inset-0'], s['z-40'], s['bg-black']) })] })) }));
17
19
  };
@@ -0,0 +1,27 @@
1
+ type Amounts = {
2
+ grossAmount: number;
3
+ netAmount: number;
4
+ discountedAmount: number;
5
+ discountPercent: number;
6
+ };
7
+ type AmountKey = 'grossAmount' | 'netAmount' | 'discountedAmount' | 'discountPercent';
8
+ type AmountMode = 'gross-net' | 'gross-discountPercent' | 'net-discountPercent' | 'gross-discounted' | 'net-discounted';
9
+ /**
10
+ * Calculates all amount fields based on the last changed key.
11
+ * @param amounts The amounts object.
12
+ * @param changedKey The key that was last changed.
13
+ */
14
+ export declare function calculateAmount(amounts: Amounts, changedKey: AmountKey): {
15
+ grossAmount: number;
16
+ netAmount: number;
17
+ discountedAmount: number;
18
+ discountPercent: number;
19
+ };
20
+ export declare const calculateAmountByKey: (amounts: Amounts, mode: AmountMode) => {
21
+ grossAmount: number;
22
+ netAmount: number;
23
+ discountedAmount: number;
24
+ discountPercent: number;
25
+ };
26
+ export {};
27
+ //# sourceMappingURL=calculation.util.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"calculation.util.d.ts","sourceRoot":"","sources":["../../../../src/core-utils/calculation/calculation.util.ts"],"names":[],"mappings":"AAAA,KAAK,OAAO,GAAG;IACb,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,gBAAgB,EAAE,MAAM,CAAC;IACzB,eAAe,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,KAAK,SAAS,GACV,aAAa,GACb,WAAW,GACX,kBAAkB,GAClB,iBAAiB,CAAC;AAEtB,KAAK,UAAU,GACX,WAAW,GACX,uBAAuB,GACvB,qBAAqB,GACrB,kBAAkB,GAClB,gBAAgB,CAAC;AAqBrB;;;;GAIG;AACH,wBAAgB,eAAe,CAC7B,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,SAAS,GACpB;IACD,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,gBAAgB,EAAE,MAAM,CAAC;IACzB,eAAe,EAAE,MAAM,CAAC;CACzB,CAGA;AAED,eAAO,MAAM,oBAAoB,YACtB,OAAO,QACV,UAAU;iBAEH,MAAM;eACR,MAAM;sBACC,MAAM;qBACP,MAAM;CA+DxB,CAAC"}
@@ -0,0 +1,89 @@
1
+ /**
2
+ * Maps the changed AmountKey to the correct AmountMode.
3
+ * You can adjust this mapping as per your business logic.
4
+ */
5
+ function getAmountModeByKey(key) {
6
+ switch (key) {
7
+ case 'grossAmount':
8
+ return 'gross-net';
9
+ case 'netAmount':
10
+ return 'gross-net';
11
+ case 'discountedAmount':
12
+ return 'gross-discounted';
13
+ case 'discountPercent':
14
+ return 'gross-discountPercent';
15
+ default:
16
+ return 'gross-net';
17
+ }
18
+ }
19
+ /**
20
+ * Calculates all amount fields based on the last changed key.
21
+ * @param amounts The amounts object.
22
+ * @param changedKey The key that was last changed.
23
+ */
24
+ export function calculateAmount(amounts, changedKey) {
25
+ const mode = getAmountModeByKey(changedKey);
26
+ return calculateAmountByKey(amounts, mode);
27
+ }
28
+ export const calculateAmountByKey = (amounts, mode) => {
29
+ const { grossAmount, netAmount, discountedAmount, discountPercent } = amounts;
30
+ switch (mode) {
31
+ case 'gross-discountPercent': {
32
+ const discountedAmountCalc = (grossAmount * discountPercent) / 100;
33
+ const netAmountCalc = grossAmount - discountedAmountCalc;
34
+ return {
35
+ grossAmount: Number(grossAmount?.toFixed(2)),
36
+ netAmount: Number(netAmountCalc?.toFixed(2)),
37
+ discountedAmount: Number(discountedAmountCalc?.toFixed(2)),
38
+ discountPercent: Number(discountPercent?.toFixed(2)),
39
+ };
40
+ }
41
+ case 'gross-net': {
42
+ const discountedAmountCalc = grossAmount - netAmount;
43
+ const discountPercentCalc = (discountedAmountCalc / grossAmount) * 100;
44
+ return {
45
+ grossAmount: Number(grossAmount?.toFixed(2)),
46
+ netAmount: Number(netAmount?.toFixed(2)),
47
+ discountedAmount: Number(discountedAmountCalc?.toFixed(2)),
48
+ discountPercent: Number(discountPercentCalc?.toFixed(2)),
49
+ };
50
+ }
51
+ case 'net-discountPercent': {
52
+ const grossAmountCalc = netAmount / (1 - discountPercent / 100);
53
+ const discountedAmountCalc = grossAmountCalc - netAmount;
54
+ return {
55
+ grossAmount: Number(grossAmountCalc?.toFixed(2)),
56
+ netAmount: Number(netAmount?.toFixed(2)),
57
+ discountedAmount: Number(discountedAmountCalc?.toFixed(2)),
58
+ discountPercent: Number(discountPercent?.toFixed(2)),
59
+ };
60
+ }
61
+ case 'gross-discounted': {
62
+ const netAmountCalc = grossAmount - discountedAmount;
63
+ const discountPercentCalc = (discountedAmount / grossAmount) * 100;
64
+ return {
65
+ grossAmount: Number(grossAmount?.toFixed(2)),
66
+ netAmount: Number(netAmountCalc?.toFixed(2)),
67
+ discountedAmount: Number(discountedAmount?.toFixed(2)),
68
+ discountPercent: Number(discountPercentCalc?.toFixed(2)),
69
+ };
70
+ }
71
+ case 'net-discounted': {
72
+ const grossAmountCalc = netAmount + discountedAmount;
73
+ const discountPercentCalc = (discountedAmount / grossAmountCalc) * 100;
74
+ return {
75
+ grossAmount: Number(grossAmountCalc?.toFixed(2)),
76
+ netAmount: Number(netAmount?.toFixed(2)),
77
+ discountedAmount: Number(discountedAmount?.toFixed(2)),
78
+ discountPercent: Number(discountPercentCalc?.toFixed(2)),
79
+ };
80
+ }
81
+ default:
82
+ return {
83
+ grossAmount,
84
+ netAmount,
85
+ discountedAmount,
86
+ discountPercent,
87
+ };
88
+ }
89
+ };
@@ -1,2 +1,3 @@
1
1
  export * from './utility.util';
2
+ export * from './calculation/calculation.util';
2
3
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/core-utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/core-utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gCAAgC,CAAC"}
@@ -1 +1,2 @@
1
1
  export * from './utility.util';
2
+ export * from './calculation/calculation.util';
@@ -45,7 +45,6 @@
45
45
  } .inline-block { display: inline-block;
46
46
  } .flex { display: flex;
47
47
  } .table { display: table;
48
- } .grid { display: grid;
49
48
  } .hidden { display: none;
50
49
  } .h-0\.5 { height: 0.125rem;
51
50
  } .h-10 { height: 2.5rem;
@@ -67,7 +66,6 @@
67
66
  } .min-w-80 { min-width: 20rem;
68
67
  } .max-w-7xl { max-width: 80rem;
69
68
  } .max-w-full { max-width: 100%;
70
- } .flex-1 { flex: 1 1 0%;
71
69
  } .-translate-x-1\/2 { --tw-translate-x: -50%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
72
70
  } .-translate-y-1\/2 { --tw-translate-y: -50%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
73
71
  } .translate-x-1\/2 { --tw-translate-x: 50%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -90,7 +88,6 @@
90
88
  } .justify-between { justify-content: space-between;
91
89
  } .gap-1 { gap: 0.25rem;
92
90
  } .gap-2 { gap: 0.5rem;
93
- } .gap-3 { gap: 0.75rem;
94
91
  } .gap-4 { gap: 1rem;
95
92
  } .space-x-1 > :not([hidden]) ~ :not([hidden]) { --tw-space-x-reverse: 0; margin-right: calc(0.25rem * var(--tw-space-x-reverse)); margin-left: calc(0.25rem * calc(1 - var(--tw-space-x-reverse)));
96
93
  } .divide-y > :not([hidden]) ~ :not([hidden]) { --tw-divide-y-reverse: 0; border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse))); border-bottom-width: calc(1px * var(--tw-divide-y-reverse));
@@ -229,10 +226,7 @@
229
226
  } .dark\:hover\:bg-gray-600:hover:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity));
230
227
  } .dark\:focus\:ring-blue-600:focus:is(.dark *) { --tw-ring-opacity: 1; --tw-ring-color: rgb(37 99 235 / var(--tw-ring-opacity));
231
228
  } @media (min-width: 0px) and (max-width: 767px) { .sm\:block { display: block;
232
- } .sm\:inline-block { display: inline-block;
233
229
  } .sm\:px-8 { padding-left: 2rem; padding-right: 2rem;
234
230
  } .sm\:text-base { font-size: 1rem; line-height: 1.5rem;
235
231
  }
236
- } @media (min-width: 1280px) { .xl\:grid { display: grid;
237
- }
238
232
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-restyle-components",
3
- "version": "0.2.74",
3
+ "version": "0.2.76",
4
4
  "private": false,
5
5
  "description": "Easy use restyle components",
6
6
  "author": {
@@ -1,8 +0,0 @@
1
- import React from 'react';
2
- interface GridProps {
3
- cols?: number;
4
- children?: React.ReactNode;
5
- }
6
- export declare const Grid: React.FunctionComponent<GridProps>;
7
- export {};
8
- //# sourceMappingURL=grid.component.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"grid.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/atoms/grid/grid.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,UAAU,SAAS;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,iBAAiB,CAAC,SAAS,CAInD,CAAC"}
@@ -1,4 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import s from '../../../tc.module.css';
3
- import { cn } from '../../../core-utils';
4
- export const Grid = (props) => (_jsx("div", { className: cn(s[`xl:grid`], s[`sm:inline-block`], s[`grid-cols-${props.cols || 1}`], s[`gap-3`]), children: props.children }));
@@ -1,14 +0,0 @@
1
- import React from 'react';
2
- interface ListProps {
3
- direction?: 'row' | 'col';
4
- space?: number;
5
- padding?: boolean;
6
- background?: boolean;
7
- align?: 'start' | 'between' | 'center' | 'end';
8
- justify?: 'start' | 'end' | 'center' | 'stretch';
9
- fill?: boolean;
10
- children?: React.ReactNode;
11
- }
12
- export declare const List: React.FunctionComponent<ListProps>;
13
- export {};
14
- //# sourceMappingURL=list.component.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"list.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/atoms/list/list.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,UAAU,SAAS;IACjB,SAAS,CAAC,EAAE,KAAK,GAAG,KAAK,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,KAAK,CAAC,EAAE,OAAO,GAAG,SAAS,GAAG,QAAQ,GAAG,KAAK,CAAC;IAC/C,OAAO,CAAC,EAAE,OAAO,GAAG,KAAK,GAAG,QAAQ,GAAG,SAAS,CAAC;IACjD,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,iBAAiB,CAAC,SAAS,CA+BnD,CAAC"}
@@ -1,16 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import s from '../../../tc.module.css';
3
- import { cn } from '../../../core-utils';
4
- export const List = (props) => {
5
- const spacingClass = props.space
6
- ? `space-${props.direction === 'col' ? 'y' : 'x'}-${props.space}`
7
- : '';
8
- const paddingClass = props.padding ? `p-${props.space}` : '';
9
- const backgroundClass = props.background ? 'bg-gray-100' : '';
10
- const alignClass = props.align ? `justify-${props.align}` : '';
11
- const justifyClass = props.justify
12
- ? `items-${props.justify}`
13
- : 'items-center';
14
- const fillClass = props.fill ? 'flex-1' : '';
15
- return (_jsx("span", { className: cn(s.flex, `flex-${props.direction || 'row'}`, spacingClass, paddingClass, backgroundClass, alignClass, fillClass, justifyClass), children: props.children }));
16
- };