@tipp/ui 1.0.38 → 1.0.41

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 (133) hide show
  1. package/dist/atoms/avatar.d.cts +3 -3
  2. package/dist/atoms/avatar.d.ts +3 -3
  3. package/dist/atoms/badge.d.cts +3 -3
  4. package/dist/atoms/badge.d.ts +3 -3
  5. package/dist/atoms/button.d.cts +3 -3
  6. package/dist/atoms/button.d.ts +3 -3
  7. package/dist/atoms/card.cjs +27 -2
  8. package/dist/atoms/card.cjs.map +1 -1
  9. package/dist/atoms/card.d.cts +15 -3
  10. package/dist/atoms/card.d.ts +15 -3
  11. package/dist/atoms/card.js +1 -1
  12. package/dist/atoms/check-box-group.d.cts +4 -4
  13. package/dist/atoms/check-box-group.d.ts +4 -4
  14. package/dist/atoms/check-box.d.cts +3 -3
  15. package/dist/atoms/check-box.d.ts +3 -3
  16. package/dist/atoms/collapse.d.cts +3 -3
  17. package/dist/atoms/collapse.d.ts +3 -3
  18. package/dist/atoms/drawer.d.cts +8 -8
  19. package/dist/atoms/drawer.d.ts +8 -8
  20. package/dist/atoms/drawer.js +2 -2
  21. package/dist/atoms/dropdown-menu.cjs +51 -1
  22. package/dist/atoms/dropdown-menu.cjs.map +1 -1
  23. package/dist/atoms/dropdown-menu.d.cts +26 -1
  24. package/dist/atoms/dropdown-menu.d.ts +26 -1
  25. package/dist/atoms/dropdown-menu.js +1 -1
  26. package/dist/atoms/ellipsis-tooltip.d.cts +2 -2
  27. package/dist/atoms/ellipsis-tooltip.d.ts +2 -2
  28. package/dist/atoms/field-error-wrapper.d.cts +3 -3
  29. package/dist/atoms/field-error-wrapper.d.ts +3 -3
  30. package/dist/atoms/field-error-wrapper.js +2 -2
  31. package/dist/atoms/form.d.cts +7 -7
  32. package/dist/atoms/form.d.ts +7 -7
  33. package/dist/atoms/index.cjs +109 -75
  34. package/dist/atoms/index.cjs.map +1 -1
  35. package/dist/atoms/index.d.cts +2 -1
  36. package/dist/atoms/index.d.ts +2 -1
  37. package/dist/atoms/index.js +36 -36
  38. package/dist/atoms/pagination.d.cts +2 -2
  39. package/dist/atoms/pagination.d.ts +2 -2
  40. package/dist/atoms/pagination.js +2 -2
  41. package/dist/atoms/typo.d.cts +2 -2
  42. package/dist/atoms/typo.d.ts +2 -2
  43. package/dist/charts/horizontal-bar-chart.d.cts +2 -2
  44. package/dist/charts/horizontal-bar-chart.d.ts +2 -2
  45. package/dist/chunk-2UMG6ERT.js +29 -0
  46. package/dist/chunk-2UMG6ERT.js.map +1 -0
  47. package/dist/chunk-3RZUYZ77.js +39 -0
  48. package/dist/chunk-3RZUYZ77.js.map +1 -0
  49. package/dist/chunk-46A3Q5FJ.js +59 -0
  50. package/dist/chunk-46A3Q5FJ.js.map +1 -0
  51. package/dist/chunk-4AI7AKMF.js +34 -0
  52. package/dist/chunk-4AI7AKMF.js.map +1 -0
  53. package/dist/chunk-4D6AW2AL.js +36 -0
  54. package/dist/chunk-4D6AW2AL.js.map +1 -0
  55. package/dist/chunk-4ZCLCSZJ.js +59 -0
  56. package/dist/chunk-4ZCLCSZJ.js.map +1 -0
  57. package/dist/chunk-6XEKRSH4.js +119 -0
  58. package/dist/chunk-6XEKRSH4.js.map +1 -0
  59. package/dist/chunk-7A7J457W.js +63 -0
  60. package/dist/chunk-7A7J457W.js.map +1 -0
  61. package/dist/chunk-7DMFFGJO.js +36 -0
  62. package/dist/chunk-7DMFFGJO.js.map +1 -0
  63. package/dist/chunk-AH3JQGIV.js +36 -0
  64. package/dist/chunk-AH3JQGIV.js.map +1 -0
  65. package/dist/chunk-BGEMXQCK.js +59 -0
  66. package/dist/chunk-BGEMXQCK.js.map +1 -0
  67. package/dist/chunk-CAIVA7UA.js +42 -0
  68. package/dist/chunk-CAIVA7UA.js.map +1 -0
  69. package/dist/chunk-E237B7Y6.js +33 -0
  70. package/dist/chunk-E237B7Y6.js.map +1 -0
  71. package/dist/chunk-EIRUKSOW.js +34 -0
  72. package/dist/chunk-EIRUKSOW.js.map +1 -0
  73. package/dist/chunk-EKFTULUP.js +34 -0
  74. package/dist/chunk-EKFTULUP.js.map +1 -0
  75. package/dist/chunk-FXU6OEPZ.js +12 -0
  76. package/dist/chunk-FXU6OEPZ.js.map +1 -0
  77. package/dist/chunk-GAXVJHRD.js +104 -0
  78. package/dist/chunk-GAXVJHRD.js.map +1 -0
  79. package/dist/chunk-MFLJ2V3R.js +63 -0
  80. package/dist/chunk-MFLJ2V3R.js.map +1 -0
  81. package/dist/chunk-MV7J3V5O.js +31 -0
  82. package/dist/chunk-MV7J3V5O.js.map +1 -0
  83. package/dist/chunk-NSSO2QWC.js +63 -0
  84. package/dist/chunk-NSSO2QWC.js.map +1 -0
  85. package/dist/chunk-P4T2KKQP.js +63 -0
  86. package/dist/chunk-P4T2KKQP.js.map +1 -0
  87. package/dist/chunk-QYJNB7TS.js +43 -0
  88. package/dist/chunk-QYJNB7TS.js.map +1 -0
  89. package/dist/chunk-R43PBEHD.js +63 -0
  90. package/dist/chunk-R43PBEHD.js.map +1 -0
  91. package/dist/chunk-RKLEKAON.js +63 -0
  92. package/dist/chunk-RKLEKAON.js.map +1 -0
  93. package/dist/chunk-S6R7UAYR.js +36 -0
  94. package/dist/chunk-S6R7UAYR.js.map +1 -0
  95. package/dist/chunk-SXYLPM76.js +119 -0
  96. package/dist/chunk-SXYLPM76.js.map +1 -0
  97. package/dist/chunk-UMZNOFYA.js +33 -0
  98. package/dist/chunk-UMZNOFYA.js.map +1 -0
  99. package/dist/chunk-Z32GH5FC.js +8 -0
  100. package/dist/chunk-Z32GH5FC.js.map +1 -0
  101. package/dist/icons/down.d.cts +2 -2
  102. package/dist/icons/down.d.ts +2 -2
  103. package/dist/icons/up.d.cts +2 -2
  104. package/dist/icons/up.d.ts +2 -2
  105. package/dist/index.cjs +166 -128
  106. package/dist/index.cjs.map +1 -1
  107. package/dist/index.css +29 -2
  108. package/dist/index.css.map +1 -1
  109. package/dist/index.d.cts +2 -1
  110. package/dist/index.d.ts +2 -1
  111. package/dist/index.js +67 -67
  112. package/dist/molecules/date-picker/index.d.cts +2 -2
  113. package/dist/molecules/date-picker/index.d.ts +2 -2
  114. package/dist/molecules/expand-table/index.d.cts +3 -3
  115. package/dist/molecules/expand-table/index.d.ts +3 -3
  116. package/dist/molecules/expand-table/index.js +22 -22
  117. package/dist/molecules/expand-table/row.d.cts +3 -3
  118. package/dist/molecules/expand-table/row.d.ts +3 -3
  119. package/dist/molecules/expand-table/row.js +19 -19
  120. package/dist/molecules/index.cjs +6 -2
  121. package/dist/molecules/index.cjs.map +1 -1
  122. package/dist/molecules/index.js +23 -23
  123. package/dist/molecules/navigation.cjs +6 -2
  124. package/dist/molecules/navigation.cjs.map +1 -1
  125. package/dist/molecules/navigation.d.cts +4 -4
  126. package/dist/molecules/navigation.d.ts +4 -4
  127. package/dist/molecules/navigation.js +20 -20
  128. package/dist/theme/theme-provider.d.cts +4 -4
  129. package/dist/theme/theme-provider.d.ts +4 -4
  130. package/package.json +1 -1
  131. package/src/atoms/card.tsx +25 -3
  132. package/src/atoms/dropdown-menu.tsx +29 -1
  133. package/src/molecules/navigation.tsx +6 -2
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/molecules/navigation.tsx"],"sourcesContent":["import React from 'react';\nimport { Button, Flex, Typo } from '../atoms';\n\ninterface Item {\n itemRender?: (item: Item) => React.ReactNode;\n key: string;\n onClick?: () => void;\n title: string;\n icon?: React.ReactNode;\n children?: Item[];\n}\n\nexport interface NavigationProps {\n items?: Item[];\n fontColor?: string;\n backgroundColor?: string;\n activeKey?: string;\n}\n\nexport function Navigation({\n items,\n fontColor,\n backgroundColor,\n activeKey,\n}: NavigationProps): React.ReactNode {\n return (\n <Flex\n direction=\"column\"\n gap=\"4\"\n pr=\"3\"\n style={{\n color: fontColor || 'var(--white-a12)',\n backgroundColor: backgroundColor || 'var(--black-a12)',\n }}\n >\n {items?.map((item) => {\n const { key, title, icon, itemRender, onClick, children } = item;\n return (\n <Flex direction=\"column\" key={key} onClick={onClick}>\n {itemRender ? (\n itemRender(item)\n ) : (\n <Flex align=\"center\" gap=\"3\" height=\"36px\" pl=\"4\" pr=\"4\">\n {icon}\n <Typo variant=\"subtitle\">{title}</Typo>\n </Flex>\n )}\n {children?.map((menu) => {\n return menu.itemRender ? (\n menu.itemRender(menu)\n ) : (\n <Button\n className={`tipp-navigation-button ${activeKey === menu.key ? 'active' : ''}`}\n key={menu.key}\n ml=\"6\"\n onClick={menu.onClick}\n size=\"medium\"\n style={{ color: 'var(--white-a12)' }}\n >\n {menu.title}\n </Button>\n );\n })}\n </Flex>\n );\n })}\n </Flex>\n );\n}\n"],"mappings":";;;;;;;;;;;AA0Cc,SAEE,KAFF;AAvBP,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAqC;AACnC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAU;AAAA,MACV,KAAI;AAAA,MACJ,IAAG;AAAA,MACH,OAAO;AAAA,QACL,OAAO,aAAa;AAAA,QACpB,iBAAiB,mBAAmB;AAAA,MACtC;AAAA,MAEC,yCAAO,IAAI,CAAC,SAAS;AACpB,cAAM,EAAE,KAAK,OAAO,MAAM,YAAY,SAAS,SAAS,IAAI;AAC5D,eACE,qBAAC,QAAK,WAAU,UAAmB,SAChC;AAAA,uBACC,WAAW,IAAI,IAEf,qBAAC,QAAK,OAAM,UAAS,KAAI,KAAI,QAAO,QAAO,IAAG,KAAI,IAAG,KAClD;AAAA;AAAA,YACD,oBAAC,QAAK,SAAQ,YAAY,iBAAM;AAAA,aAClC;AAAA,UAED,qCAAU,IAAI,CAAC,SAAS;AACvB,mBAAO,KAAK,aACV,KAAK,WAAW,IAAI,IAEpB;AAAA,cAAC;AAAA;AAAA,gBACC,WAAW,0BAA0B,cAAc,KAAK,MAAM,WAAW,EAAE;AAAA,gBAE3E,IAAG;AAAA,gBACH,SAAS,KAAK;AAAA,gBACd,MAAK;AAAA,gBACL,OAAO,EAAE,OAAO,mBAAmB;AAAA,gBAElC,eAAK;AAAA;AAAA,cAND,KAAK;AAAA,YAOZ;AAAA,UAEJ;AAAA,aAxB4B,GAyB9B;AAAA,MAEJ;AAAA;AAAA,EACF;AAEJ;","names":[]}
@@ -0,0 +1,34 @@
1
+ import {
2
+ __objRest,
3
+ __spreadProps,
4
+ __spreadValues
5
+ } from "./chunk-N552FDTV.js";
6
+
7
+ // src/atoms/dropdown-menu.tsx
8
+ import { DropdownMenu as RadixDropdownMenu } from "@radix-ui/themes";
9
+ import { forwardRef, useMemo } from "react";
10
+ import { jsx } from "react/jsx-runtime";
11
+ var Content = forwardRef((props, ref) => {
12
+ const _a = props, { isNavigation, className } = _a, rest = __objRest(_a, ["isNavigation", "className"]);
13
+ const etcClassName = useMemo(() => {
14
+ return isNavigation ? "dropdown-navigation" : "";
15
+ }, [isNavigation]);
16
+ console.log({ isNavigation, etcClassName });
17
+ return /* @__PURE__ */ jsx(
18
+ RadixDropdownMenu.Content,
19
+ __spreadProps(__spreadValues({
20
+ ref
21
+ }, rest), {
22
+ className: `${className} ${etcClassName}`
23
+ })
24
+ );
25
+ });
26
+ Content.displayName = "DropdownMenu.Content";
27
+ var DropdownMenu = __spreadProps(__spreadValues({}, RadixDropdownMenu), {
28
+ Content
29
+ });
30
+
31
+ export {
32
+ DropdownMenu
33
+ };
34
+ //# sourceMappingURL=chunk-4AI7AKMF.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/atoms/dropdown-menu.tsx"],"sourcesContent":["import { DropdownMenu as RadixDropdownMenu } from '@radix-ui/themes';\nimport { forwardRef, useMemo } from 'react';\n\nexport type ContentProps = RadixDropdownMenu.ContentProps & {\n isNavigation?: boolean;\n};\n\nconst Content = forwardRef<HTMLDivElement, ContentProps>((props, ref) => {\n const { isNavigation, className, ...rest } = props;\n const etcClassName = useMemo(() => {\n return isNavigation ? 'dropdown-navigation' : '';\n }, [isNavigation]);\n console.log({ isNavigation, etcClassName });\n\n return (\n <RadixDropdownMenu.Content\n ref={ref}\n {...rest}\n className={`${className} ${etcClassName}`}\n />\n );\n});\n\nContent.displayName = 'DropdownMenu.Content';\n\nexport const DropdownMenu = {\n ...RadixDropdownMenu,\n Content,\n};\n"],"mappings":";;;;;;;AAAA,SAAS,gBAAgB,yBAAyB;AAClD,SAAS,YAAY,eAAe;AAchC;AARJ,IAAM,UAAU,WAAyC,CAAC,OAAO,QAAQ;AACvE,QAA6C,YAArC,gBAAc,UARxB,IAQ+C,IAAT,iBAAS,IAAT,CAA5B,gBAAc;AACtB,QAAM,eAAe,QAAQ,MAAM;AACjC,WAAO,eAAe,wBAAwB;AAAA,EAChD,GAAG,CAAC,YAAY,CAAC;AACjB,UAAQ,IAAI,EAAE,cAAc,aAAa,CAAC;AAE1C,SACE;AAAA,IAAC,kBAAkB;AAAA,IAAlB;AAAA,MACC;AAAA,OACI,OAFL;AAAA,MAGC,WAAW,GAAG,SAAS,IAAI,YAAY;AAAA;AAAA,EACzC;AAEJ,CAAC;AAED,QAAQ,cAAc;AAEf,IAAM,eAAe,iCACvB,oBADuB;AAAA,EAE1B;AACF;","names":[]}
@@ -0,0 +1,36 @@
1
+ import {
2
+ __objRest,
3
+ __spreadProps,
4
+ __spreadValues
5
+ } from "./chunk-N552FDTV.js";
6
+
7
+ // src/atoms/select.tsx
8
+ import { Select as RadixSelect } from "@radix-ui/themes";
9
+ import { forwardRef, useMemo } from "react";
10
+ import { jsx } from "react/jsx-runtime";
11
+ var Content = forwardRef(
12
+ (props, ref) => {
13
+ const _a = props, { isNavigation, className } = _a, rest = __objRest(_a, ["isNavigation", "className"]);
14
+ const etcClassName = useMemo(() => {
15
+ return isNavigation ? "select-navigation" : "";
16
+ }, [isNavigation]);
17
+ return /* @__PURE__ */ jsx(
18
+ RadixSelect.Content,
19
+ __spreadProps(__spreadValues({
20
+ ref
21
+ }, rest), {
22
+ className: `${className} ${etcClassName}`
23
+ })
24
+ );
25
+ }
26
+ );
27
+ Content.displayName = "Select.Content";
28
+ var Select = __spreadProps(__spreadValues({}, RadixSelect), {
29
+ Content
30
+ });
31
+
32
+ export {
33
+ Content,
34
+ Select
35
+ };
36
+ //# sourceMappingURL=chunk-4D6AW2AL.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/atoms/select.tsx"],"sourcesContent":["import { Select as RadixSelect } from '@radix-ui/themes';\nimport { forwardRef, useMemo } from 'react';\n\nexport type ContentProps = RadixSelect.ContentProps & {\n isNavigation?: boolean;\n};\n\nexport const Content = forwardRef<HTMLDivElement, ContentProps>(\n (props, ref) => {\n const { isNavigation, className, ...rest } = props;\n const etcClassName = useMemo(() => {\n return isNavigation ? 'select-navigation' : '';\n }, [isNavigation]);\n\n return (\n <RadixSelect.Content\n ref={ref}\n {...rest}\n className={`${className} ${etcClassName}`}\n />\n );\n }\n);\n\nContent.displayName = 'Select.Content';\n\nexport const Select = {\n ...RadixSelect,\n Content,\n};\n"],"mappings":";;;;;;;AAAA,SAAS,UAAU,mBAAmB;AACtC,SAAS,YAAY,eAAe;AAc9B;AARC,IAAM,UAAU;AAAA,EACrB,CAAC,OAAO,QAAQ;AACd,UAA6C,YAArC,gBAAc,UAT1B,IASiD,IAAT,iBAAS,IAAT,CAA5B,gBAAc;AACtB,UAAM,eAAe,QAAQ,MAAM;AACjC,aAAO,eAAe,sBAAsB;AAAA,IAC9C,GAAG,CAAC,YAAY,CAAC;AAEjB,WACE;AAAA,MAAC,YAAY;AAAA,MAAZ;AAAA,QACC;AAAA,SACI,OAFL;AAAA,QAGC,WAAW,GAAG,SAAS,IAAI,YAAY;AAAA;AAAA,IACzC;AAAA,EAEJ;AACF;AAEA,QAAQ,cAAc;AAEf,IAAM,SAAS,iCACjB,cADiB;AAAA,EAEpB;AACF;","names":[]}
@@ -0,0 +1,59 @@
1
+ import {
2
+ Flex
3
+ } from "./chunk-25HMMI7R.js";
4
+ import {
5
+ Typo
6
+ } from "./chunk-O3XTRD7R.js";
7
+ import {
8
+ Button
9
+ } from "./chunk-AQX7DQLI.js";
10
+
11
+ // src/molecules/navigation.tsx
12
+ import { jsx, jsxs } from "react/jsx-runtime";
13
+ function Navigation({
14
+ items,
15
+ fontColor,
16
+ backgroundColor,
17
+ activeKey
18
+ }) {
19
+ return /* @__PURE__ */ jsx(
20
+ Flex,
21
+ {
22
+ direction: "column",
23
+ gap: "4",
24
+ pr: "3",
25
+ style: {
26
+ color: fontColor || "var(--white-a12)",
27
+ backgroundColor: backgroundColor || "var(--black-a12)"
28
+ },
29
+ children: items == null ? void 0 : items.map((item) => {
30
+ const { key, title, icon, itemRender, onClick, children } = item;
31
+ return /* @__PURE__ */ jsxs(Flex, { direction: "column", onClick, children: [
32
+ itemRender ? itemRender(item) : /* @__PURE__ */ jsxs(Flex, { align: "center", gap: "3", height: "36px", pl: "4", pr: "4", children: [
33
+ icon,
34
+ /* @__PURE__ */ jsx(Typo, { variant: "subtitle", children: title })
35
+ ] }),
36
+ children == null ? void 0 : children.map((menu) => {
37
+ return menu.itemRender ? menu.itemRender(menu) : /* @__PURE__ */ jsx(
38
+ Button,
39
+ {
40
+ className: `tipp-navigation-button ${activeKey === menu.key ? "active" : ""}`,
41
+ ml: "6",
42
+ onClick: menu.onClick,
43
+ size: "large",
44
+ style: { color: "var(--white-a12)", height: "32px" },
45
+ children: menu.title
46
+ },
47
+ menu.key
48
+ );
49
+ })
50
+ ] }, key);
51
+ })
52
+ }
53
+ );
54
+ }
55
+
56
+ export {
57
+ Navigation
58
+ };
59
+ //# sourceMappingURL=chunk-4ZCLCSZJ.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/molecules/navigation.tsx"],"sourcesContent":["import React from 'react';\nimport { Button, Flex, Typo } from '../atoms';\n\ninterface Item {\n itemRender?: (item: Item) => React.ReactNode;\n key: string;\n onClick?: () => void;\n title: string;\n icon?: React.ReactNode;\n children?: Item[];\n}\n\nexport interface NavigationProps {\n items?: Item[];\n fontColor?: string;\n backgroundColor?: string;\n activeKey?: string;\n}\n\nexport function Navigation({\n items,\n fontColor,\n backgroundColor,\n activeKey,\n}: NavigationProps): React.ReactNode {\n return (\n <Flex\n direction=\"column\"\n gap=\"4\"\n pr=\"3\"\n style={{\n color: fontColor || 'var(--white-a12)',\n backgroundColor: backgroundColor || 'var(--black-a12)',\n }}\n >\n {items?.map((item) => {\n const { key, title, icon, itemRender, onClick, children } = item;\n return (\n <Flex direction=\"column\" key={key} onClick={onClick}>\n {itemRender ? (\n itemRender(item)\n ) : (\n <Flex align=\"center\" gap=\"3\" height=\"36px\" pl=\"4\" pr=\"4\">\n {icon}\n <Typo variant=\"subtitle\">{title}</Typo>\n </Flex>\n )}\n {children?.map((menu) => {\n return menu.itemRender ? (\n menu.itemRender(menu)\n ) : (\n <Button\n className={`tipp-navigation-button ${activeKey === menu.key ? 'active' : ''}`}\n key={menu.key}\n ml=\"6\"\n onClick={menu.onClick}\n size=\"large\"\n style={{ color: 'var(--white-a12)', height: '32px' }}\n >\n {menu.title}\n </Button>\n );\n })}\n </Flex>\n );\n })}\n </Flex>\n );\n}\n"],"mappings":";;;;;;;;;;;AA0Cc,SAEE,KAFF;AAvBP,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAqC;AACnC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAU;AAAA,MACV,KAAI;AAAA,MACJ,IAAG;AAAA,MACH,OAAO;AAAA,QACL,OAAO,aAAa;AAAA,QACpB,iBAAiB,mBAAmB;AAAA,MACtC;AAAA,MAEC,yCAAO,IAAI,CAAC,SAAS;AACpB,cAAM,EAAE,KAAK,OAAO,MAAM,YAAY,SAAS,SAAS,IAAI;AAC5D,eACE,qBAAC,QAAK,WAAU,UAAmB,SAChC;AAAA,uBACC,WAAW,IAAI,IAEf,qBAAC,QAAK,OAAM,UAAS,KAAI,KAAI,QAAO,QAAO,IAAG,KAAI,IAAG,KAClD;AAAA;AAAA,YACD,oBAAC,QAAK,SAAQ,YAAY,iBAAM;AAAA,aAClC;AAAA,UAED,qCAAU,IAAI,CAAC,SAAS;AACvB,mBAAO,KAAK,aACV,KAAK,WAAW,IAAI,IAEpB;AAAA,cAAC;AAAA;AAAA,gBACC,WAAW,0BAA0B,cAAc,KAAK,MAAM,WAAW,EAAE;AAAA,gBAE3E,IAAG;AAAA,gBACH,SAAS,KAAK;AAAA,gBACd,MAAK;AAAA,gBACL,OAAO,EAAE,OAAO,oBAAoB,QAAQ,OAAO;AAAA,gBAElD,eAAK;AAAA;AAAA,cAND,KAAK;AAAA,YAOZ;AAAA,UAEJ;AAAA,aAxB4B,GAyB9B;AAAA,MAEJ;AAAA;AAAA,EACF;AAEJ;","names":[]}
@@ -0,0 +1,119 @@
1
+ import {
2
+ TriangleArrowDownIcon
3
+ } from "./chunk-BSTJBBEX.js";
4
+ import {
5
+ TriangleArrowUpIcon
6
+ } from "./chunk-NDUKDKGB.js";
7
+ import {
8
+ Row
9
+ } from "./chunk-XHNYNSZZ.js";
10
+ import {
11
+ Flex
12
+ } from "./chunk-25HMMI7R.js";
13
+ import {
14
+ Typo
15
+ } from "./chunk-O3XTRD7R.js";
16
+
17
+ // src/molecules/expand-table/index.tsx
18
+ import {
19
+ flexRender,
20
+ getCoreRowModel,
21
+ useReactTable,
22
+ getSortedRowModel,
23
+ createColumnHelper
24
+ } from "@tanstack/react-table";
25
+ import { useMemo, useState } from "react";
26
+ import { jsx, jsxs } from "react/jsx-runtime";
27
+ function ExpandTable(props) {
28
+ const { data, columns, ExpandComp, placeholder, onRowClick } = props;
29
+ const [sorting, setSorting] = useState([]);
30
+ const { getRowModel, getHeaderGroups } = useReactTable({
31
+ data: data || [],
32
+ columns,
33
+ getCoreRowModel: getCoreRowModel(),
34
+ getSortedRowModel: getSortedRowModel(),
35
+ state: {
36
+ sorting
37
+ },
38
+ onSortingChange: setSorting
39
+ });
40
+ const gridColTemp = useMemo(() => {
41
+ return columns.map((col) => {
42
+ var _a;
43
+ if ((_a = col.meta) == null ? void 0 : _a.autoSize)
44
+ return "1fr";
45
+ return `${col.size || 150}px`;
46
+ }).join(" ");
47
+ }, [columns]);
48
+ const rowModels = getRowModel();
49
+ return /* @__PURE__ */ jsxs("div", { className: "expand-table", children: [
50
+ /* @__PURE__ */ jsx("div", { className: "thead", children: getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx(
51
+ "div",
52
+ {
53
+ className: "tr",
54
+ style: { gridTemplateColumns: gridColTemp },
55
+ children: headerGroup.headers.map((header) => {
56
+ const sortable = header.column.getCanSort();
57
+ const sortedState = header.column.getIsSorted();
58
+ return /* @__PURE__ */ jsx("div", { className: "th", children: /* @__PURE__ */ jsxs(
59
+ "button",
60
+ {
61
+ onClick: header.column.getToggleSortingHandler(),
62
+ style: sortable ? { cursor: "pointer" } : void 0,
63
+ type: "button",
64
+ children: [
65
+ /* @__PURE__ */ jsx(Typo, { variant: "body", children: flexRender(
66
+ header.column.columnDef.header,
67
+ header.getContext()
68
+ ) }),
69
+ sortable ? /* @__PURE__ */ jsxs(
70
+ Flex,
71
+ {
72
+ direction: "column",
73
+ style: { marginLeft: "var(--space-2)" },
74
+ children: [
75
+ /* @__PURE__ */ jsx(
76
+ TriangleArrowUpIcon,
77
+ {
78
+ color: sortedState === "asc" ? "var(--iris-10)" : "var(--iris-6)"
79
+ }
80
+ ),
81
+ /* @__PURE__ */ jsx(
82
+ TriangleArrowDownIcon,
83
+ {
84
+ color: sortedState === "desc" ? "var(--iris-10)" : "var(--iris-6)"
85
+ }
86
+ )
87
+ ]
88
+ }
89
+ ) : null
90
+ ]
91
+ }
92
+ ) }, header.id);
93
+ })
94
+ },
95
+ headerGroup.id
96
+ )) }),
97
+ /* @__PURE__ */ jsxs("div", { className: "tbody", children: [
98
+ rowModels.rows.length === 0 && /* @__PURE__ */ jsx("div", { className: "tr", children: /* @__PURE__ */ jsx(Flex, { align: "center", justify: "center", children: placeholder || /* @__PURE__ */ jsx(Typo, { color: "gray", mb: "6", mt: "6", variant: "body", children: "\uB370\uC774\uD130\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4" }) }) }, "expand_placeholder"),
99
+ rowModels.rows.map((row) => {
100
+ return /* @__PURE__ */ jsx(
101
+ Row,
102
+ {
103
+ ExpandComp,
104
+ gridColTemp,
105
+ onRowClick,
106
+ row
107
+ },
108
+ `row_${row.id}`
109
+ );
110
+ })
111
+ ] })
112
+ ] });
113
+ }
114
+
115
+ export {
116
+ createColumnHelper,
117
+ ExpandTable
118
+ };
119
+ //# sourceMappingURL=chunk-6XEKRSH4.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/molecules/expand-table/index.tsx"],"sourcesContent":["import type {\n ColumnDef,\n SortingState,\n RowData,\n Row as RowType,\n} from '@tanstack/react-table';\nimport type { CSSProperties } from 'react';\nimport {\n flexRender,\n getCoreRowModel,\n useReactTable,\n getSortedRowModel,\n createColumnHelper,\n} from '@tanstack/react-table';\nimport React, { useMemo, useState } from 'react';\nimport { Flex, Typo } from '../../atoms';\nimport { TriangleArrowDownIcon } from '../../icons/down';\nimport { TriangleArrowUpIcon } from '../../icons/up';\nimport { Row, type ExpandComp, type OnRowClick } from './row';\n\nexport type { ExpandComp, OnRowClick, ColumnDef, RowType as Row };\nexport { createColumnHelper };\n\nexport interface ExpandTableProps<Datum extends RowData> {\n /** 렌더할 데이터 배열 */\n data?: Datum[];\n /** 테이블 컬럼의 메타 데이터 */\n columns: ColumnDef<Datum>[];\n /** Row의 open이 true인 경우 하단의 collapse에 렌더할 컴포넌트 */\n ExpandComp?: ExpandComp<Datum>;\n /** 데이테가 없을 시 화면에 표시할 컴포넌트 */\n placeholder?: React.ReactNode;\n /** 행 클릭 시 실행할 콜백 */\n onRowClick?: OnRowClick<Datum>;\n rowStyle?: CSSProperties;\n}\n\nexport function ExpandTable<Datum extends RowData>(\n props: ExpandTableProps<Datum>\n): React.ReactNode {\n const { data, columns, ExpandComp, placeholder, onRowClick } = props;\n\n const [sorting, setSorting] = useState<SortingState>([]);\n const { getRowModel, getHeaderGroups } = useReactTable({\n data: data || [],\n columns,\n getCoreRowModel: getCoreRowModel(),\n getSortedRowModel: getSortedRowModel(),\n state: {\n sorting,\n },\n onSortingChange: setSorting,\n });\n\n const gridColTemp = useMemo<string>(() => {\n return columns\n .map((col) => {\n if (col.meta?.autoSize) return '1fr';\n return `${col.size || 150}px`;\n })\n .join(' ');\n }, [columns]);\n\n const rowModels = getRowModel();\n\n return (\n <div className=\"expand-table\">\n <div className=\"thead\">\n {getHeaderGroups().map((headerGroup) => (\n <div\n className=\"tr\"\n key={headerGroup.id}\n style={{ gridTemplateColumns: gridColTemp }}\n >\n {headerGroup.headers.map((header) => {\n const sortable = header.column.getCanSort();\n const sortedState = header.column.getIsSorted();\n\n return (\n <div className=\"th\" key={header.id}>\n <button\n onClick={header.column.getToggleSortingHandler()}\n style={sortable ? { cursor: 'pointer' } : undefined}\n type=\"button\"\n >\n <Typo variant=\"body\">\n {flexRender(\n header.column.columnDef.header,\n header.getContext()\n )}\n </Typo>\n {sortable ? (\n <Flex\n direction=\"column\"\n style={{ marginLeft: 'var(--space-2)' }}\n >\n <TriangleArrowUpIcon\n color={\n sortedState === 'asc'\n ? 'var(--iris-10)'\n : 'var(--iris-6)'\n }\n />\n <TriangleArrowDownIcon\n color={\n sortedState === 'desc'\n ? 'var(--iris-10)'\n : 'var(--iris-6)'\n }\n />\n </Flex>\n ) : null}\n </button>\n </div>\n );\n })}\n </div>\n ))}\n </div>\n <div className=\"tbody\">\n {/* 데이터가 없을 시 표시되는 노드 */}\n {rowModels.rows.length === 0 && (\n <div className=\"tr\" key=\"expand_placeholder\">\n <Flex align=\"center\" justify=\"center\">\n {placeholder || (\n <Typo color=\"gray\" mb=\"6\" mt=\"6\" variant=\"body\">\n 데이터가 없습니다\n </Typo>\n )}\n </Flex>\n </div>\n )}\n\n {/* 행을 렌더하는 로직 */}\n {rowModels.rows.map((row) => {\n return (\n <Row\n ExpandComp={ExpandComp}\n gridColTemp={gridColTemp}\n key={`row_${row.id}`}\n onRowClick={onRowClick}\n row={row}\n />\n );\n })}\n </div>\n </div>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAOA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAgB,SAAS,gBAAgB;AAuErB,cAOE,YAPF;AAhDb,SAAS,YACd,OACiB;AACjB,QAAM,EAAE,MAAM,SAAS,YAAY,aAAa,WAAW,IAAI;AAE/D,QAAM,CAAC,SAAS,UAAU,IAAI,SAAuB,CAAC,CAAC;AACvD,QAAM,EAAE,aAAa,gBAAgB,IAAI,cAAc;AAAA,IACrD,MAAM,QAAQ,CAAC;AAAA,IACf;AAAA,IACA,iBAAiB,gBAAgB;AAAA,IACjC,mBAAmB,kBAAkB;AAAA,IACrC,OAAO;AAAA,MACL;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,EACnB,CAAC;AAED,QAAM,cAAc,QAAgB,MAAM;AACxC,WAAO,QACJ,IAAI,CAAC,QAAQ;AAxDpB;AAyDQ,WAAI,SAAI,SAAJ,mBAAU;AAAU,eAAO;AAC/B,aAAO,GAAG,IAAI,QAAQ,GAAG;AAAA,IAC3B,CAAC,EACA,KAAK,GAAG;AAAA,EACb,GAAG,CAAC,OAAO,CAAC;AAEZ,QAAM,YAAY,YAAY;AAE9B,SACE,qBAAC,SAAI,WAAU,gBACb;AAAA,wBAAC,SAAI,WAAU,SACZ,0BAAgB,EAAE,IAAI,CAAC,gBACtB;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QAEV,OAAO,EAAE,qBAAqB,YAAY;AAAA,QAEzC,sBAAY,QAAQ,IAAI,CAAC,WAAW;AACnC,gBAAM,WAAW,OAAO,OAAO,WAAW;AAC1C,gBAAM,cAAc,OAAO,OAAO,YAAY;AAE9C,iBACE,oBAAC,SAAI,WAAU,MACb;AAAA,YAAC;AAAA;AAAA,cACC,SAAS,OAAO,OAAO,wBAAwB;AAAA,cAC/C,OAAO,WAAW,EAAE,QAAQ,UAAU,IAAI;AAAA,cAC1C,MAAK;AAAA,cAEL;AAAA,oCAAC,QAAK,SAAQ,QACX;AAAA,kBACC,OAAO,OAAO,UAAU;AAAA,kBACxB,OAAO,WAAW;AAAA,gBACpB,GACF;AAAA,gBACC,WACC;AAAA,kBAAC;AAAA;AAAA,oBACC,WAAU;AAAA,oBACV,OAAO,EAAE,YAAY,iBAAiB;AAAA,oBAEtC;AAAA;AAAA,wBAAC;AAAA;AAAA,0BACC,OACE,gBAAgB,QACZ,mBACA;AAAA;AAAA,sBAER;AAAA,sBACA;AAAA,wBAAC;AAAA;AAAA,0BACC,OACE,gBAAgB,SACZ,mBACA;AAAA;AAAA,sBAER;AAAA;AAAA;AAAA,gBACF,IACE;AAAA;AAAA;AAAA,UACN,KAjCuB,OAAO,EAkChC;AAAA,QAEJ,CAAC;AAAA;AAAA,MA5CI,YAAY;AAAA,IA6CnB,CACD,GACH;AAAA,IACA,qBAAC,SAAI,WAAU,SAEZ;AAAA,gBAAU,KAAK,WAAW,KACzB,oBAAC,SAAI,WAAU,MACb,8BAAC,QAAK,OAAM,UAAS,SAAQ,UAC1B,yBACC,oBAAC,QAAK,OAAM,QAAO,IAAG,KAAI,IAAG,KAAI,SAAQ,QAAO,+DAEhD,GAEJ,KAPsB,oBAQxB;AAAA,MAID,UAAU,KAAK,IAAI,CAAC,QAAQ;AAC3B,eACE;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YAEA;AAAA,YACA;AAAA;AAAA,UAFK,OAAO,IAAI,EAAE;AAAA,QAGpB;AAAA,MAEJ,CAAC;AAAA,OACH;AAAA,KACF;AAEJ;","names":[]}
@@ -0,0 +1,63 @@
1
+ import {
2
+ Typo
3
+ } from "./chunk-O3XTRD7R.js";
4
+ import {
5
+ Flex
6
+ } from "./chunk-25HMMI7R.js";
7
+ import {
8
+ Button
9
+ } from "./chunk-AQX7DQLI.js";
10
+
11
+ // src/molecules/navigation.tsx
12
+ import { jsx, jsxs } from "react/jsx-runtime";
13
+ function Navigation({
14
+ items,
15
+ fontColor,
16
+ backgroundColor,
17
+ activeKey
18
+ }) {
19
+ return /* @__PURE__ */ jsx(
20
+ Flex,
21
+ {
22
+ direction: "column",
23
+ gap: "4",
24
+ pr: "3",
25
+ style: {
26
+ color: fontColor || "var(--white-a12)",
27
+ backgroundColor: backgroundColor || "var(--black-a12)"
28
+ },
29
+ children: items == null ? void 0 : items.map((item) => {
30
+ const { key, title, icon, itemRender, onClick, children } = item;
31
+ return /* @__PURE__ */ jsxs(Flex, { direction: "column", onClick, children: [
32
+ itemRender ? itemRender(item) : /* @__PURE__ */ jsxs(Flex, { align: "center", gap: "3", height: "36px", pl: "4", pr: "4", children: [
33
+ icon,
34
+ /* @__PURE__ */ jsx(Typo, { variant: "subtitle", children: title })
35
+ ] }),
36
+ children == null ? void 0 : children.map((menu) => {
37
+ return menu.itemRender ? menu.itemRender(menu) : /* @__PURE__ */ jsx(
38
+ Button,
39
+ {
40
+ className: `tipp-navigation-button ${activeKey === menu.key ? "active" : ""}`,
41
+ ml: "37px",
42
+ onClick: menu.onClick,
43
+ size: "large",
44
+ style: {
45
+ color: "var(--white-a12)",
46
+ height: "32px",
47
+ paddingLeft: "var(--space-2)"
48
+ },
49
+ children: menu.title
50
+ },
51
+ menu.key
52
+ );
53
+ })
54
+ ] }, key);
55
+ })
56
+ }
57
+ );
58
+ }
59
+
60
+ export {
61
+ Navigation
62
+ };
63
+ //# sourceMappingURL=chunk-7A7J457W.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/molecules/navigation.tsx"],"sourcesContent":["import React from 'react';\nimport { Button, Flex, Typo } from '../atoms';\n\ninterface Item {\n itemRender?: (item: Item) => React.ReactNode;\n key: string;\n onClick?: () => void;\n title: string;\n icon?: React.ReactNode;\n children?: Item[];\n}\n\nexport interface NavigationProps {\n items?: Item[];\n fontColor?: string;\n backgroundColor?: string;\n activeKey?: string;\n}\n\nexport function Navigation({\n items,\n fontColor,\n backgroundColor,\n activeKey,\n}: NavigationProps): React.ReactNode {\n return (\n <Flex\n direction=\"column\"\n gap=\"4\"\n pr=\"3\"\n style={{\n color: fontColor || 'var(--white-a12)',\n backgroundColor: backgroundColor || 'var(--black-a12)',\n }}\n >\n {items?.map((item) => {\n const { key, title, icon, itemRender, onClick, children } = item;\n return (\n <Flex direction=\"column\" key={key} onClick={onClick}>\n {itemRender ? (\n itemRender(item)\n ) : (\n <Flex align=\"center\" gap=\"3\" height=\"36px\" pl=\"4\" pr=\"4\">\n {icon}\n <Typo variant=\"subtitle\">{title}</Typo>\n </Flex>\n )}\n {children?.map((menu) => {\n return menu.itemRender ? (\n menu.itemRender(menu)\n ) : (\n <Button\n className={`tipp-navigation-button ${activeKey === menu.key ? 'active' : ''}`}\n key={menu.key}\n ml=\"37px\"\n onClick={menu.onClick}\n size=\"large\"\n style={{\n color: 'var(--white-a12)',\n height: '32px',\n paddingLeft: 'var(--space-2)',\n }}\n >\n {menu.title}\n </Button>\n );\n })}\n </Flex>\n );\n })}\n </Flex>\n );\n}\n"],"mappings":";;;;;;;;;;;AA0Cc,SAEE,KAFF;AAvBP,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAqC;AACnC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAU;AAAA,MACV,KAAI;AAAA,MACJ,IAAG;AAAA,MACH,OAAO;AAAA,QACL,OAAO,aAAa;AAAA,QACpB,iBAAiB,mBAAmB;AAAA,MACtC;AAAA,MAEC,yCAAO,IAAI,CAAC,SAAS;AACpB,cAAM,EAAE,KAAK,OAAO,MAAM,YAAY,SAAS,SAAS,IAAI;AAC5D,eACE,qBAAC,QAAK,WAAU,UAAmB,SAChC;AAAA,uBACC,WAAW,IAAI,IAEf,qBAAC,QAAK,OAAM,UAAS,KAAI,KAAI,QAAO,QAAO,IAAG,KAAI,IAAG,KAClD;AAAA;AAAA,YACD,oBAAC,QAAK,SAAQ,YAAY,iBAAM;AAAA,aAClC;AAAA,UAED,qCAAU,IAAI,CAAC,SAAS;AACvB,mBAAO,KAAK,aACV,KAAK,WAAW,IAAI,IAEpB;AAAA,cAAC;AAAA;AAAA,gBACC,WAAW,0BAA0B,cAAc,KAAK,MAAM,WAAW,EAAE;AAAA,gBAE3E,IAAG;AAAA,gBACH,SAAS,KAAK;AAAA,gBACd,MAAK;AAAA,gBACL,OAAO;AAAA,kBACL,OAAO;AAAA,kBACP,QAAQ;AAAA,kBACR,aAAa;AAAA,gBACf;AAAA,gBAEC,eAAK;AAAA;AAAA,cAVD,KAAK;AAAA,YAWZ;AAAA,UAEJ;AAAA,aA5B4B,GA6B9B;AAAA,MAEJ;AAAA;AAAA,EACF;AAEJ;","names":[]}
@@ -0,0 +1,36 @@
1
+ import {
2
+ __objRest,
3
+ __spreadProps,
4
+ __spreadValues
5
+ } from "./chunk-N552FDTV.js";
6
+
7
+ // src/atoms/dropdown-menu.tsx
8
+ import { DropdownMenu as RadixDropdownMenu } from "@radix-ui/themes";
9
+ import { forwardRef, useMemo } from "react";
10
+ import { jsx } from "react/jsx-runtime";
11
+ var Content = forwardRef(
12
+ (props, ref) => {
13
+ const _a = props, { isNavigation, className } = _a, rest = __objRest(_a, ["isNavigation", "className"]);
14
+ const etcClassName = useMemo(() => {
15
+ return isNavigation ? "dropdown-navigation" : "";
16
+ }, [isNavigation]);
17
+ return /* @__PURE__ */ jsx(
18
+ RadixDropdownMenu.Content,
19
+ __spreadProps(__spreadValues({
20
+ ref
21
+ }, rest), {
22
+ className: `${className} ${etcClassName}`
23
+ })
24
+ );
25
+ }
26
+ );
27
+ Content.displayName = "DropdownMenu.Content";
28
+ var DropdownMenu = __spreadProps(__spreadValues({}, RadixDropdownMenu), {
29
+ Content
30
+ });
31
+
32
+ export {
33
+ Content,
34
+ DropdownMenu
35
+ };
36
+ //# sourceMappingURL=chunk-7DMFFGJO.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/atoms/dropdown-menu.tsx"],"sourcesContent":["import { DropdownMenu as RadixDropdownMenu } from '@radix-ui/themes';\nimport { forwardRef, useMemo } from 'react';\n\nexport type ContentProps = RadixDropdownMenu.ContentProps & {\n isNavigation?: boolean;\n};\n\nexport const Content = forwardRef<HTMLDivElement, ContentProps>(\n (props, ref) => {\n const { isNavigation, className, ...rest } = props;\n const etcClassName = useMemo(() => {\n return isNavigation ? 'dropdown-navigation' : '';\n }, [isNavigation]);\n\n return (\n <RadixDropdownMenu.Content\n ref={ref}\n {...rest}\n className={`${className} ${etcClassName}`}\n />\n );\n }\n);\n\nContent.displayName = 'DropdownMenu.Content';\n\nexport const DropdownMenu = {\n ...RadixDropdownMenu,\n Content,\n};\n"],"mappings":";;;;;;;AAAA,SAAS,gBAAgB,yBAAyB;AAClD,SAAS,YAAY,eAAe;AAc9B;AARC,IAAM,UAAU;AAAA,EACrB,CAAC,OAAO,QAAQ;AACd,UAA6C,YAArC,gBAAc,UAT1B,IASiD,IAAT,iBAAS,IAAT,CAA5B,gBAAc;AACtB,UAAM,eAAe,QAAQ,MAAM;AACjC,aAAO,eAAe,wBAAwB;AAAA,IAChD,GAAG,CAAC,YAAY,CAAC;AAEjB,WACE;AAAA,MAAC,kBAAkB;AAAA,MAAlB;AAAA,QACC;AAAA,SACI,OAFL;AAAA,QAGC,WAAW,GAAG,SAAS,IAAI,YAAY;AAAA;AAAA,IACzC;AAAA,EAEJ;AACF;AAEA,QAAQ,cAAc;AAEf,IAAM,eAAe,iCACvB,oBADuB;AAAA,EAE1B;AACF;","names":[]}
@@ -0,0 +1,36 @@
1
+ import {
2
+ __objRest,
3
+ __spreadProps,
4
+ __spreadValues
5
+ } from "./chunk-N552FDTV.js";
6
+
7
+ // src/atoms/dropdown-menu.tsx
8
+ import { DropdownMenu as RadixDropdownMenu } from "@radix-ui/themes";
9
+ import { forwardRef, useMemo } from "react";
10
+ import { jsx } from "react/jsx-runtime";
11
+ var Content = forwardRef(
12
+ (props, ref) => {
13
+ const _a = props, { isNavigation, className } = _a, rest = __objRest(_a, ["isNavigation", "className"]);
14
+ const etcClassName = useMemo(() => {
15
+ return isNavigation ? "dropdown-navigation" : "";
16
+ }, [isNavigation]);
17
+ return /* @__PURE__ */ jsx(
18
+ RadixDropdownMenu.Content,
19
+ __spreadProps(__spreadValues({
20
+ ref
21
+ }, rest), {
22
+ className: `${className} ${etcClassName}`
23
+ })
24
+ );
25
+ }
26
+ );
27
+ Content.displayName = "etcClassName.Content";
28
+ var DropdownMenu = __spreadProps(__spreadValues({}, RadixDropdownMenu), {
29
+ Content
30
+ });
31
+
32
+ export {
33
+ Content,
34
+ DropdownMenu
35
+ };
36
+ //# sourceMappingURL=chunk-AH3JQGIV.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/atoms/dropdown-menu.tsx"],"sourcesContent":["import { DropdownMenu as RadixDropdownMenu } from '@radix-ui/themes';\nimport { forwardRef, useMemo } from 'react';\n\nexport type ContentProps = RadixDropdownMenu.ContentProps & {\n isNavigation?: boolean;\n};\n\nexport const Content = forwardRef<HTMLDivElement, ContentProps>(\n (props, ref) => {\n const { isNavigation, className, ...rest } = props;\n const etcClassName = useMemo(() => {\n return isNavigation ? 'dropdown-navigation' : '';\n }, [isNavigation]);\n\n return (\n <RadixDropdownMenu.Content\n ref={ref}\n {...rest}\n className={`${className} ${etcClassName}`}\n />\n );\n }\n);\n\nContent.displayName = 'etcClassName.Content';\n\nexport const DropdownMenu = {\n ...RadixDropdownMenu,\n Content,\n};\n"],"mappings":";;;;;;;AAAA,SAAS,gBAAgB,yBAAyB;AAClD,SAAS,YAAY,eAAe;AAc9B;AARC,IAAM,UAAU;AAAA,EACrB,CAAC,OAAO,QAAQ;AACd,UAA6C,YAArC,gBAAc,UAT1B,IASiD,IAAT,iBAAS,IAAT,CAA5B,gBAAc;AACtB,UAAM,eAAe,QAAQ,MAAM;AACjC,aAAO,eAAe,wBAAwB;AAAA,IAChD,GAAG,CAAC,YAAY,CAAC;AAEjB,WACE;AAAA,MAAC,kBAAkB;AAAA,MAAlB;AAAA,QACC;AAAA,SACI,OAFL;AAAA,QAGC,WAAW,GAAG,SAAS,IAAI,YAAY;AAAA;AAAA,IACzC;AAAA,EAEJ;AACF;AAEA,QAAQ,cAAc;AAEf,IAAM,eAAe,iCACvB,oBADuB;AAAA,EAE1B;AACF;","names":[]}
@@ -0,0 +1,59 @@
1
+ import {
2
+ Flex
3
+ } from "./chunk-25HMMI7R.js";
4
+ import {
5
+ Typo
6
+ } from "./chunk-O3XTRD7R.js";
7
+ import {
8
+ Button
9
+ } from "./chunk-AQX7DQLI.js";
10
+
11
+ // src/molecules/navigation.tsx
12
+ import { jsx, jsxs } from "react/jsx-runtime";
13
+ function Navigation({
14
+ items,
15
+ fontColor,
16
+ backgroundColor,
17
+ activeKey
18
+ }) {
19
+ return /* @__PURE__ */ jsx(
20
+ Flex,
21
+ {
22
+ direction: "column",
23
+ gap: "4",
24
+ pr: "3",
25
+ style: {
26
+ color: fontColor || "var(--white-a12)",
27
+ backgroundColor: backgroundColor || "var(--black-a12)"
28
+ },
29
+ children: items == null ? void 0 : items.map((item) => {
30
+ const { key, title, icon, itemRender, onClick, children } = item;
31
+ return /* @__PURE__ */ jsxs(Flex, { direction: "column", onClick, children: [
32
+ itemRender ? itemRender(item) : /* @__PURE__ */ jsxs(Flex, { align: "center", gap: "3", height: "36px", pl: "4", pr: "4", children: [
33
+ icon,
34
+ /* @__PURE__ */ jsx(Typo, { variant: "subtitle", children: title })
35
+ ] }),
36
+ children == null ? void 0 : children.map((menu) => {
37
+ return menu.itemRender ? menu.itemRender(menu) : /* @__PURE__ */ jsx(
38
+ Button,
39
+ {
40
+ className: `tipp-navigation-button ${activeKey === menu.key ? "active" : ""}`,
41
+ ml: "6",
42
+ onClick: menu.onClick,
43
+ size: "medium",
44
+ style: { color: "var(--white-a12)", height: "32px" },
45
+ children: menu.title
46
+ },
47
+ menu.key
48
+ );
49
+ })
50
+ ] }, key);
51
+ })
52
+ }
53
+ );
54
+ }
55
+
56
+ export {
57
+ Navigation
58
+ };
59
+ //# sourceMappingURL=chunk-BGEMXQCK.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/molecules/navigation.tsx"],"sourcesContent":["import React from 'react';\nimport { Button, Flex, Typo } from '../atoms';\n\ninterface Item {\n itemRender?: (item: Item) => React.ReactNode;\n key: string;\n onClick?: () => void;\n title: string;\n icon?: React.ReactNode;\n children?: Item[];\n}\n\nexport interface NavigationProps {\n items?: Item[];\n fontColor?: string;\n backgroundColor?: string;\n activeKey?: string;\n}\n\nexport function Navigation({\n items,\n fontColor,\n backgroundColor,\n activeKey,\n}: NavigationProps): React.ReactNode {\n return (\n <Flex\n direction=\"column\"\n gap=\"4\"\n pr=\"3\"\n style={{\n color: fontColor || 'var(--white-a12)',\n backgroundColor: backgroundColor || 'var(--black-a12)',\n }}\n >\n {items?.map((item) => {\n const { key, title, icon, itemRender, onClick, children } = item;\n return (\n <Flex direction=\"column\" key={key} onClick={onClick}>\n {itemRender ? (\n itemRender(item)\n ) : (\n <Flex align=\"center\" gap=\"3\" height=\"36px\" pl=\"4\" pr=\"4\">\n {icon}\n <Typo variant=\"subtitle\">{title}</Typo>\n </Flex>\n )}\n {children?.map((menu) => {\n return menu.itemRender ? (\n menu.itemRender(menu)\n ) : (\n <Button\n className={`tipp-navigation-button ${activeKey === menu.key ? 'active' : ''}`}\n key={menu.key}\n ml=\"6\"\n onClick={menu.onClick}\n size=\"medium\"\n style={{ color: 'var(--white-a12)', height: '32px' }}\n >\n {menu.title}\n </Button>\n );\n })}\n </Flex>\n );\n })}\n </Flex>\n );\n}\n"],"mappings":";;;;;;;;;;;AA0Cc,SAEE,KAFF;AAvBP,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAqC;AACnC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAU;AAAA,MACV,KAAI;AAAA,MACJ,IAAG;AAAA,MACH,OAAO;AAAA,QACL,OAAO,aAAa;AAAA,QACpB,iBAAiB,mBAAmB;AAAA,MACtC;AAAA,MAEC,yCAAO,IAAI,CAAC,SAAS;AACpB,cAAM,EAAE,KAAK,OAAO,MAAM,YAAY,SAAS,SAAS,IAAI;AAC5D,eACE,qBAAC,QAAK,WAAU,UAAmB,SAChC;AAAA,uBACC,WAAW,IAAI,IAEf,qBAAC,QAAK,OAAM,UAAS,KAAI,KAAI,QAAO,QAAO,IAAG,KAAI,IAAG,KAClD;AAAA;AAAA,YACD,oBAAC,QAAK,SAAQ,YAAY,iBAAM;AAAA,aAClC;AAAA,UAED,qCAAU,IAAI,CAAC,SAAS;AACvB,mBAAO,KAAK,aACV,KAAK,WAAW,IAAI,IAEpB;AAAA,cAAC;AAAA;AAAA,gBACC,WAAW,0BAA0B,cAAc,KAAK,MAAM,WAAW,EAAE;AAAA,gBAE3E,IAAG;AAAA,gBACH,SAAS,KAAK;AAAA,gBACd,MAAK;AAAA,gBACL,OAAO,EAAE,OAAO,oBAAoB,QAAQ,OAAO;AAAA,gBAElD,eAAK;AAAA;AAAA,cAND,KAAK;AAAA,YAOZ;AAAA,UAEJ;AAAA,aAxB4B,GAyB9B;AAAA,MAEJ;AAAA;AAAA,EACF;AAEJ;","names":[]}
@@ -0,0 +1,42 @@
1
+ import {
2
+ __objRest,
3
+ __spreadProps,
4
+ __spreadValues
5
+ } from "./chunk-N552FDTV.js";
6
+
7
+ // src/atoms/card.tsx
8
+ import { forwardRef, useMemo } from "react";
9
+ import {
10
+ Card as RadixCard
11
+ } from "@radix-ui/themes";
12
+ import { jsx } from "react/jsx-runtime";
13
+ var Card = forwardRef(
14
+ (props, forwardedRef) => {
15
+ const _a = props, { borderDisable, borderRadius } = _a, rest = __objRest(_a, ["borderDisable", "borderRadius"]);
16
+ const borderInsetClassName = useMemo(() => {
17
+ if (!borderDisable)
18
+ return "";
19
+ const { left, right, top, bottom } = borderDisable;
20
+ return [
21
+ left && "disable-inset-left",
22
+ right && "disable-inset-right",
23
+ top && "disable-inset-top",
24
+ bottom && "disable-inset-bottom"
25
+ ].filter(Boolean).join(" ");
26
+ }, [borderDisable]);
27
+ return /* @__PURE__ */ jsx(
28
+ RadixCard,
29
+ __spreadProps(__spreadValues({}, rest), {
30
+ className: `${borderInsetClassName} ${rest.className}`,
31
+ "data-radius": borderRadius,
32
+ ref: forwardedRef
33
+ })
34
+ );
35
+ }
36
+ );
37
+ Card.displayName = "Card";
38
+
39
+ export {
40
+ Card
41
+ };
42
+ //# sourceMappingURL=chunk-CAIVA7UA.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/atoms/card.tsx"],"sourcesContent":["import { forwardRef, useMemo } from 'react';\nimport {\n Card as RadixCard,\n type CardProps as RadixCardProps,\n} from '@radix-ui/themes';\n\nexport type CardProps = RadixCardProps & {\n borderRadius?: 'none';\n borderDisable?: {\n left?: boolean;\n right?: boolean;\n top?: boolean;\n bottom?: boolean;\n };\n};\n\nexport const Card = forwardRef<HTMLDivElement, CardProps>(\n (props, forwardedRef) => {\n const { borderDisable, borderRadius, ...rest } = props;\n\n const borderInsetClassName = useMemo(() => {\n if (!borderDisable) return '';\n const { left, right, top, bottom } = borderDisable;\n return [\n left && 'disable-inset-left',\n right && 'disable-inset-right',\n top && 'disable-inset-top',\n bottom && 'disable-inset-bottom',\n ]\n .filter(Boolean)\n .join(' ');\n }, [borderDisable]);\n\n return (\n <RadixCard\n {...rest}\n className={`${borderInsetClassName} ${rest.className}`}\n data-radius={borderRadius}\n ref={forwardedRef}\n />\n );\n }\n);\n\nCard.displayName = 'Card';\n"],"mappings":";;;;;;;AAAA,SAAS,YAAY,eAAe;AACpC;AAAA,EACE,QAAQ;AAAA,OAEH;AA8BD;AAlBC,IAAM,OAAO;AAAA,EAClB,CAAC,OAAO,iBAAiB;AACvB,UAAiD,YAAzC,iBAAe,aAlB3B,IAkBqD,IAAT,iBAAS,IAAT,CAAhC,iBAAe;AAEvB,UAAM,uBAAuB,QAAQ,MAAM;AACzC,UAAI,CAAC;AAAe,eAAO;AAC3B,YAAM,EAAE,MAAM,OAAO,KAAK,OAAO,IAAI;AACrC,aAAO;AAAA,QACL,QAAQ;AAAA,QACR,SAAS;AAAA,QACT,OAAO;AAAA,QACP,UAAU;AAAA,MACZ,EACG,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,IACb,GAAG,CAAC,aAAa,CAAC;AAElB,WACE;AAAA,MAAC;AAAA,uCACK,OADL;AAAA,QAEC,WAAW,GAAG,oBAAoB,IAAI,KAAK,SAAS;AAAA,QACpD,eAAa;AAAA,QACb,KAAK;AAAA;AAAA,IACP;AAAA,EAEJ;AACF;AAEA,KAAK,cAAc;","names":[]}
@@ -0,0 +1,33 @@
1
+ import {
2
+ __objRest,
3
+ __spreadProps,
4
+ __spreadValues
5
+ } from "./chunk-N552FDTV.js";
6
+
7
+ // src/atoms/dropdown-menu.tsx
8
+ import { DropdownMenu as RadixDropdownMenu } from "@radix-ui/themes";
9
+ import { forwardRef, useMemo } from "react";
10
+ import { jsx } from "react/jsx-runtime";
11
+ var Content = forwardRef((props, ref) => {
12
+ const _a = props, { isNavigation, className } = _a, rest = __objRest(_a, ["isNavigation", "className"]);
13
+ const etcClassName = useMemo(() => {
14
+ return isNavigation ? "dropdown-navigation" : "";
15
+ }, [isNavigation]);
16
+ return /* @__PURE__ */ jsx(
17
+ RadixDropdownMenu.Content,
18
+ __spreadProps(__spreadValues({
19
+ ref
20
+ }, rest), {
21
+ className: `${className || ""} ${etcClassName}`
22
+ })
23
+ );
24
+ });
25
+ Content.displayName = "DropdownMenu.Content";
26
+ var DropdownMenu = __spreadProps(__spreadValues({}, RadixDropdownMenu), {
27
+ Content
28
+ });
29
+
30
+ export {
31
+ DropdownMenu
32
+ };
33
+ //# sourceMappingURL=chunk-E237B7Y6.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/atoms/dropdown-menu.tsx"],"sourcesContent":["import { DropdownMenu as RadixDropdownMenu } from '@radix-ui/themes';\nimport { forwardRef, useMemo } from 'react';\n\nexport type ContentProps = RadixDropdownMenu.ContentProps & {\n isNavigation?: boolean;\n};\n\nconst Content = forwardRef<HTMLDivElement, ContentProps>((props, ref) => {\n const { isNavigation, className, ...rest } = props;\n const etcClassName = useMemo(() => {\n return isNavigation ? 'dropdown-navigation' : '';\n }, [isNavigation]);\n\n return (\n <RadixDropdownMenu.Content\n ref={ref}\n {...rest}\n className={`${className || ''} ${etcClassName}`}\n />\n );\n});\n\nContent.displayName = 'DropdownMenu.Content';\n\nexport const DropdownMenu = {\n ...RadixDropdownMenu,\n Content,\n};\n"],"mappings":";;;;;;;AAAA,SAAS,gBAAgB,yBAAyB;AAClD,SAAS,YAAY,eAAe;AAahC;AAPJ,IAAM,UAAU,WAAyC,CAAC,OAAO,QAAQ;AACvE,QAA6C,YAArC,gBAAc,UARxB,IAQ+C,IAAT,iBAAS,IAAT,CAA5B,gBAAc;AACtB,QAAM,eAAe,QAAQ,MAAM;AACjC,WAAO,eAAe,wBAAwB;AAAA,EAChD,GAAG,CAAC,YAAY,CAAC;AAEjB,SACE;AAAA,IAAC,kBAAkB;AAAA,IAAlB;AAAA,MACC;AAAA,OACI,OAFL;AAAA,MAGC,WAAW,GAAG,aAAa,EAAE,IAAI,YAAY;AAAA;AAAA,EAC/C;AAEJ,CAAC;AAED,QAAQ,cAAc;AAEf,IAAM,eAAe,iCACvB,oBADuB;AAAA,EAE1B;AACF;","names":[]}
@@ -0,0 +1,34 @@
1
+ import {
2
+ __objRest,
3
+ __spreadProps,
4
+ __spreadValues
5
+ } from "./chunk-N552FDTV.js";
6
+
7
+ // src/atoms/dropdown-menu.tsx
8
+ import { DropdownMenu as RadixDropdownMenu } from "@radix-ui/themes";
9
+ import { forwardRef, useMemo } from "react";
10
+ import { jsx } from "react/jsx-runtime";
11
+ var Content = forwardRef((props, ref) => {
12
+ const _a = props, { isNavigation, className } = _a, rest = __objRest(_a, ["isNavigation", "className"]);
13
+ const contentClassName = useMemo(() => {
14
+ const cls = isNavigation ? "dropdown-navigation" : "";
15
+ return [cls, className].join(" ");
16
+ }, [isNavigation, className]);
17
+ return /* @__PURE__ */ jsx(
18
+ RadixDropdownMenu.Content,
19
+ __spreadProps(__spreadValues({
20
+ ref
21
+ }, rest), {
22
+ className: contentClassName
23
+ })
24
+ );
25
+ });
26
+ Content.displayName = "DropdownMenu.Content";
27
+ var DropdownMenu = __spreadProps(__spreadValues({}, RadixDropdownMenu), {
28
+ Content
29
+ });
30
+
31
+ export {
32
+ DropdownMenu
33
+ };
34
+ //# sourceMappingURL=chunk-EIRUKSOW.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/atoms/dropdown-menu.tsx"],"sourcesContent":["import { DropdownMenu as RadixDropdownMenu } from '@radix-ui/themes';\nimport { forwardRef, useMemo } from 'react';\n\nexport type ContentProps = RadixDropdownMenu.ContentProps & {\n isNavigation?: boolean;\n};\n\nconst Content = forwardRef<HTMLDivElement, ContentProps>((props, ref) => {\n const { isNavigation, className, ...rest } = props;\n const contentClassName = useMemo(() => {\n const cls = isNavigation ? 'dropdown-navigation' : '';\n return [cls, className].join(' ');\n }, [isNavigation, className]);\n\n return (\n <RadixDropdownMenu.Content\n ref={ref}\n {...rest}\n className={contentClassName}\n />\n );\n});\n\nContent.displayName = 'DropdownMenu.Content';\n\nexport const DropdownMenu = {\n ...RadixDropdownMenu,\n Content,\n};\n"],"mappings":";;;;;;;AAAA,SAAS,gBAAgB,yBAAyB;AAClD,SAAS,YAAY,eAAe;AAchC;AARJ,IAAM,UAAU,WAAyC,CAAC,OAAO,QAAQ;AACvE,QAA6C,YAArC,gBAAc,UARxB,IAQ+C,IAAT,iBAAS,IAAT,CAA5B,gBAAc;AACtB,QAAM,mBAAmB,QAAQ,MAAM;AACrC,UAAM,MAAM,eAAe,wBAAwB;AACnD,WAAO,CAAC,KAAK,SAAS,EAAE,KAAK,GAAG;AAAA,EAClC,GAAG,CAAC,cAAc,SAAS,CAAC;AAE5B,SACE;AAAA,IAAC,kBAAkB;AAAA,IAAlB;AAAA,MACC;AAAA,OACI,OAFL;AAAA,MAGC,WAAW;AAAA;AAAA,EACb;AAEJ,CAAC;AAED,QAAQ,cAAc;AAEf,IAAM,eAAe,iCACvB,oBADuB;AAAA,EAE1B;AACF;","names":[]}