@petnow/ui 5.1.0 → 5.3.0

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 (135) hide show
  1. package/CHANGELOG.md +50 -0
  2. package/README.md +10 -8
  3. package/dist/{Popup-B2Q-le-6.js → Popup-DRf-ERpL.js} +3 -3
  4. package/dist/Popup-DRf-ERpL.js.map +1 -0
  5. package/dist/badge.js +338 -0
  6. package/dist/badge.js.map +1 -0
  7. package/dist/checkbox.js +38 -0
  8. package/dist/checkbox.js.map +1 -0
  9. package/dist/chip.js +53 -0
  10. package/dist/chip.js.map +1 -0
  11. package/dist/combobox.js +201 -0
  12. package/dist/combobox.js.map +1 -0
  13. package/dist/cta-button.js +62 -0
  14. package/dist/cta-button.js.map +1 -0
  15. package/dist/fieldStyles-DyZu__hI.js +42 -0
  16. package/dist/fieldStyles-DyZu__hI.js.map +1 -0
  17. package/dist/icons/action/cancel-filled.js +22 -0
  18. package/dist/icons/action/cancel-filled.js.map +1 -0
  19. package/dist/icons/action/cancel.js +19 -0
  20. package/dist/icons/action/cancel.js.map +1 -0
  21. package/dist/icons/action/chevron-down.js +19 -0
  22. package/dist/icons/action/chevron-down.js.map +1 -0
  23. package/dist/icons/action/chevron-left.js +19 -0
  24. package/dist/icons/action/chevron-left.js.map +1 -0
  25. package/dist/icons/action/chevron-right.js +19 -0
  26. package/dist/icons/action/chevron-right.js.map +1 -0
  27. package/dist/icons/action/chevron-up.js +19 -0
  28. package/dist/icons/action/chevron-up.js.map +1 -0
  29. package/dist/icons/action/filter.js +19 -0
  30. package/dist/icons/action/filter.js.map +1 -0
  31. package/dist/icons/action/retry.js +19 -0
  32. package/dist/icons/action/retry.js.map +1 -0
  33. package/dist/icons/action/sorting.js +19 -0
  34. package/dist/icons/action/sorting.js.map +1 -0
  35. package/dist/icons/static/close.js +19 -0
  36. package/dist/icons/static/close.js.map +1 -0
  37. package/dist/icons/static/delete.js +30 -0
  38. package/dist/icons/static/delete.js.map +1 -0
  39. package/dist/icons/static/recent.js +32 -0
  40. package/dist/icons/static/recent.js.map +1 -0
  41. package/dist/icons/static/report.js +28 -0
  42. package/dist/icons/static/report.js.map +1 -0
  43. package/dist/icons/static/shield-done.js +21 -0
  44. package/dist/icons/static/shield-done.js.map +1 -0
  45. package/dist/index.d.ts +25 -23
  46. package/dist/index.es.js +26 -24
  47. package/dist/mergeRefs-BHwdBwNQ.js +27 -0
  48. package/dist/mergeRefs-BHwdBwNQ.js.map +1 -0
  49. package/dist/popup.js +4 -0
  50. package/dist/radio.js +17 -0
  51. package/dist/radio.js.map +1 -0
  52. package/dist/select.js +82 -0
  53. package/dist/select.js.map +1 -0
  54. package/dist/src/components/checkbox/Checkbox.d.ts +11 -0
  55. package/dist/src/components/combobox/Combobox.d.ts +35 -0
  56. package/dist/src/components/select/Select.d.ts +24 -0
  57. package/dist/src/components/ui/field.d.ts +15 -0
  58. package/dist/src/components/ui/fieldStyles.d.ts +14 -0
  59. package/dist/src/utils/mergeRefs.d.ts +2 -0
  60. package/dist/tabs.js +73 -0
  61. package/dist/tabs.js.map +1 -0
  62. package/dist/text-field.js +252 -0
  63. package/dist/text-field.js.map +1 -0
  64. package/dist/toggle.js +21 -0
  65. package/dist/toggle.js.map +1 -0
  66. package/dist/v0/checkbox.js +1 -38
  67. package/dist/v0/radio.js +1 -17
  68. package/dist/v0/tabs.js +1 -73
  69. package/dist/v0/toggle.js +1 -21
  70. package/dist/v1/badge.js +1 -338
  71. package/dist/v1/chip.js +1 -53
  72. package/dist/v1/cta-button.js +1 -62
  73. package/dist/v1/icons/action/cancel-filled.js +1 -22
  74. package/dist/v1/icons/action/cancel.js +1 -19
  75. package/dist/v1/icons/action/chevron-down.js +1 -19
  76. package/dist/v1/icons/action/chevron-left.js +1 -19
  77. package/dist/v1/icons/action/chevron-right.js +1 -19
  78. package/dist/v1/icons/action/chevron-up.js +1 -19
  79. package/dist/v1/icons/action/filter.js +1 -19
  80. package/dist/v1/icons/action/retry.js +1 -19
  81. package/dist/v1/icons/action/sorting.js +1 -19
  82. package/dist/v1/icons/static/close.js +1 -19
  83. package/dist/v1/icons/static/delete.js +1 -30
  84. package/dist/v1/icons/static/recent.js +1 -32
  85. package/dist/v1/icons/static/report.js +1 -28
  86. package/dist/v1/icons/static/shield-done.js +1 -21
  87. package/dist/v1/popup.js +1 -4
  88. package/dist/v1/text-field.js +1 -286
  89. package/package.json +149 -48
  90. package/dist/Popup-B2Q-le-6.js.map +0 -1
  91. package/dist/src/components/v0/checkbox/Checkbox.d.ts +0 -10
  92. package/dist/v0/checkbox.js.map +0 -1
  93. package/dist/v0/radio.js.map +0 -1
  94. package/dist/v0/tabs.js.map +0 -1
  95. package/dist/v0/toggle.js.map +0 -1
  96. package/dist/v1/badge.js.map +0 -1
  97. package/dist/v1/chip.js.map +0 -1
  98. package/dist/v1/cta-button.js.map +0 -1
  99. package/dist/v1/icons/action/cancel-filled.js.map +0 -1
  100. package/dist/v1/icons/action/cancel.js.map +0 -1
  101. package/dist/v1/icons/action/chevron-down.js.map +0 -1
  102. package/dist/v1/icons/action/chevron-left.js.map +0 -1
  103. package/dist/v1/icons/action/chevron-right.js.map +0 -1
  104. package/dist/v1/icons/action/chevron-up.js.map +0 -1
  105. package/dist/v1/icons/action/filter.js.map +0 -1
  106. package/dist/v1/icons/action/retry.js.map +0 -1
  107. package/dist/v1/icons/action/sorting.js.map +0 -1
  108. package/dist/v1/icons/static/close.js.map +0 -1
  109. package/dist/v1/icons/static/delete.js.map +0 -1
  110. package/dist/v1/icons/static/recent.js.map +0 -1
  111. package/dist/v1/icons/static/report.js.map +0 -1
  112. package/dist/v1/icons/static/shield-done.js.map +0 -1
  113. package/dist/v1/text-field.js.map +0 -1
  114. /package/dist/src/components/{v1/badge → badge}/Badge.d.ts +0 -0
  115. /package/dist/src/components/{v1/chip → chip}/Chip.d.ts +0 -0
  116. /package/dist/src/components/{v1/cta-button → cta-button}/CTAButton.d.ts +0 -0
  117. /package/dist/src/components/{v1/icons → icons}/action/CancelFilledIcon.d.ts +0 -0
  118. /package/dist/src/components/{v1/icons → icons}/action/CancelIcon.d.ts +0 -0
  119. /package/dist/src/components/{v1/icons → icons}/action/ChevronDownIcon.d.ts +0 -0
  120. /package/dist/src/components/{v1/icons → icons}/action/ChevronLeftIcon.d.ts +0 -0
  121. /package/dist/src/components/{v1/icons → icons}/action/ChevronRightIcon.d.ts +0 -0
  122. /package/dist/src/components/{v1/icons → icons}/action/ChevronUpIcon.d.ts +0 -0
  123. /package/dist/src/components/{v1/icons → icons}/action/FilterIcon.d.ts +0 -0
  124. /package/dist/src/components/{v1/icons → icons}/action/RetryIcon.d.ts +0 -0
  125. /package/dist/src/components/{v1/icons → icons}/action/SortingIcon.d.ts +0 -0
  126. /package/dist/src/components/{v1/icons → icons}/static/CloseIcon.d.ts +0 -0
  127. /package/dist/src/components/{v1/icons → icons}/static/DeleteIcon.d.ts +0 -0
  128. /package/dist/src/components/{v1/icons → icons}/static/RecentIcon.d.ts +0 -0
  129. /package/dist/src/components/{v1/icons → icons}/static/ReportIcon.d.ts +0 -0
  130. /package/dist/src/components/{v1/icons → icons}/static/ShieldDoneIcon.d.ts +0 -0
  131. /package/dist/src/components/{v1/popup → popup}/Popup.d.ts +0 -0
  132. /package/dist/src/components/{v0/radio → radio}/Radio.d.ts +0 -0
  133. /package/dist/src/components/{v0/tabs → tabs}/Tabs.d.ts +0 -0
  134. /package/dist/src/components/{v1/text-field → text-field}/TextField.d.ts +0 -0
  135. /package/dist/src/components/{v0/toggle → toggle}/Toggle.d.ts +0 -0
@@ -0,0 +1,201 @@
1
+ "use client";
2
+ import { t as e } from "./TailwindUtil-DiNvXuNl.js";
3
+ import { a as t, n, o as r, t as ee } from "./fieldStyles-DyZu__hI.js";
4
+ import { ChevronDownIcon as te } from "./icons/action/chevron-down.js";
5
+ import { n as ne, r as re, t as ie } from "./mergeRefs-BHwdBwNQ.js";
6
+ import { jsx as i, jsxs as a } from "react/jsx-runtime";
7
+ import { useEffect as o, useId as s, useMemo as c, useRef as l, useState as u } from "react";
8
+ //#region src/components/combobox/Combobox.tsx
9
+ var d = (e) => e.toLocaleLowerCase().replace(/\s+/g, ""), f = (e, t) => d(e.label).includes(d(t)), p = ({ id: p, label: m, options: ae, value: h, onChange: oe, filter: g = f, emptyText: _, toggleLabel: v, invalidSelectionText: y = "Select an option from the list.", errorText: b, assistiveText: x, size: S = "large", name: C, required: w, disabled: T = !1, placeholder: se, className: ce, autoComplete: le = "off", "aria-describedby": ue, onBlur: de, onKeyDown: fe, onClick: pe, ref: E, ...D }) => {
10
+ let me = s(), O = p ?? me, k = `${O}-listbox`, A = `${O}-message`, j = (e) => `${O}-option-${e}`, M = !!b, he = !!(b || x), N = `${O}-label`, P = l(null), F = c(() => ie(P, E), [E]), I = l(null), L = l(!1), R = ae.map((e) => typeof e == "string" ? {
11
+ value: e,
12
+ label: e
13
+ } : e), z = R.find((e) => e.value === h), [B, V] = u(null), [H, U] = u(!1), [W, G] = u(-1), K = R.map((e, t) => ({
14
+ option: e,
15
+ index: t
16
+ })).filter(({ option: e }) => !B || g(e, B)), q = H && !T && (K.length > 0 || _ !== void 0), J = K.filter(({ option: e }) => !e.disabled);
17
+ o(() => {
18
+ let e = L.current;
19
+ L.current = !1, !(!q || W < 0 || !e) && document.getElementById(j(W))?.scrollIntoView?.({ block: "nearest" });
20
+ }, [q, W]), o(() => {
21
+ h !== I.current && V(null), I.current = null;
22
+ }, [h]), o(() => {
23
+ I.current = null;
24
+ });
25
+ let Y = !!(w && !z && B);
26
+ o(() => {
27
+ P.current?.setCustomValidity(Y ? y : "");
28
+ }, [Y, y]);
29
+ let X = (e) => {
30
+ I.current = e, oe(e);
31
+ }, Z = () => {
32
+ L.current = !0, U(!0), G(z && !z.disabled ? R.indexOf(z) : -1);
33
+ }, Q = () => {
34
+ U(!1), V(null), G(-1);
35
+ }, $ = (e) => {
36
+ e.disabled || (X(e.value), Q());
37
+ }, ge = (e) => {
38
+ if (J.length === 0) return;
39
+ let t = J.findIndex(({ index: e }) => e === W), n = t === -1 ? e === 1 ? 0 : J.length - 1 : (t + e + J.length) % J.length;
40
+ L.current = !0, G(J[n].index);
41
+ }, _e = (e) => {
42
+ if (fe?.(e), !(e.defaultPrevented || e.nativeEvent.isComposing || e.keyCode === 229)) switch (e.key) {
43
+ case "ArrowDown":
44
+ case "ArrowUp":
45
+ if (e.preventDefault(), H && e.altKey && e.key === "ArrowUp") {
46
+ Q();
47
+ return;
48
+ }
49
+ if (!H) {
50
+ U(!0);
51
+ let t = z && !z.disabled ? R.indexOf(z) : -1, n = e.key === "ArrowDown" ? J[0] : J[J.length - 1];
52
+ L.current = !0, G(t >= 0 || e.altKey ? t : n?.index ?? -1);
53
+ return;
54
+ }
55
+ ge(e.key === "ArrowDown" ? 1 : -1);
56
+ return;
57
+ case "Enter":
58
+ q && W >= 0 && (e.preventDefault(), $(R[W]));
59
+ return;
60
+ case "Escape":
61
+ (q || B !== null) && (e.preventDefault(), Q());
62
+ return;
63
+ }
64
+ }, ve = (e) => {
65
+ let t = e.trim() ? R.find((t) => !t.disabled && d(t.label) === d(e)) : void 0;
66
+ if (t ? t.value !== h && X(t.value) : h !== "" && X(""), document.activeElement !== P.current) {
67
+ V(t ? null : e);
68
+ return;
69
+ }
70
+ V(e), U(!0);
71
+ let n = R.findIndex((t) => !t.disabled && (!e || g(t, e)));
72
+ L.current = !0, G(t ? R.indexOf(t) : e ? n : -1);
73
+ };
74
+ return /* @__PURE__ */ a("div", {
75
+ className: e("flex w-full min-w-0 flex-col gap-2", ce),
76
+ children: [
77
+ m && /* @__PURE__ */ i(ne, {
78
+ id: N,
79
+ htmlFor: O,
80
+ size: S,
81
+ required: w,
82
+ children: m
83
+ }),
84
+ /* @__PURE__ */ a("div", {
85
+ className: "relative",
86
+ children: [
87
+ /* @__PURE__ */ a("div", {
88
+ className: "relative",
89
+ children: [/* @__PURE__ */ i("input", {
90
+ ...D,
91
+ ref: F,
92
+ id: O,
93
+ type: "text",
94
+ role: "combobox",
95
+ "aria-expanded": q,
96
+ "aria-controls": k,
97
+ "aria-autocomplete": "list",
98
+ "aria-activedescendant": q && W >= 0 ? j(W) : void 0,
99
+ "aria-invalid": M || void 0,
100
+ "aria-describedby": r(ue, he && A),
101
+ autoComplete: le,
102
+ required: w,
103
+ disabled: T,
104
+ placeholder: se,
105
+ value: B ?? z?.label ?? "",
106
+ onChange: (e) => ve(e.target.value),
107
+ onKeyDown: _e,
108
+ onClick: (e) => {
109
+ pe?.(e), !H && !e.defaultPrevented && Z();
110
+ },
111
+ onBlur: (e) => {
112
+ de?.(e), Q();
113
+ },
114
+ className: e(n({
115
+ size: S,
116
+ hasError: M,
117
+ disabled: T
118
+ }), "text-text-base-neutral-5 placeholder:text-text-base-neutral-2 w-full min-w-0 truncate outline-none disabled:cursor-not-allowed", !T && !M && "focus:border-border-base-neutral-4", S === "large" ? "pr-14" : "pr-12", t(S))
119
+ }), /* @__PURE__ */ i("button", {
120
+ type: "button",
121
+ tabIndex: -1,
122
+ "aria-label": v ?? m ?? D["aria-label"],
123
+ "aria-controls": k,
124
+ "aria-expanded": q,
125
+ disabled: T,
126
+ onMouseDown: (e) => e.preventDefault(),
127
+ onClick: () => {
128
+ q ? Q() : Z(), P.current?.focus();
129
+ },
130
+ className: e("absolute inset-y-0 right-0 flex cursor-pointer items-center justify-center disabled:cursor-not-allowed", S === "large" ? "w-14" : "w-12"),
131
+ children: /* @__PURE__ */ i(te, {
132
+ "aria-hidden": "true",
133
+ className: e("size-6 transition-transform duration-200", q ? "text-icon-prominent-accent-1 rotate-180" : "text-icon-base-neutral-3")
134
+ })
135
+ })]
136
+ }),
137
+ C && /* @__PURE__ */ i("input", {
138
+ type: "hidden",
139
+ name: C,
140
+ value: h,
141
+ disabled: T,
142
+ form: D.form
143
+ }),
144
+ /* @__PURE__ */ a("ul", {
145
+ id: k,
146
+ role: "listbox",
147
+ "aria-labelledby": m ? N : void 0,
148
+ "aria-label": m ? void 0 : D["aria-label"],
149
+ hidden: !q,
150
+ onMouseDown: (e) => e.preventDefault(),
151
+ className: e("border-border-base-neutral-2 bg-surface-base-neutral-1 absolute z-20 mt-2 max-h-72 w-full overflow-y-auto border py-1 shadow-lg", ee),
152
+ children: [K.map(({ option: t, index: n }) => {
153
+ let r = t.value === h;
154
+ return /* @__PURE__ */ a("li", {
155
+ id: j(n),
156
+ role: "option",
157
+ "aria-selected": r,
158
+ "aria-disabled": t.disabled || void 0,
159
+ onMouseMove: () => {
160
+ L.current = !1, t.disabled || G(n);
161
+ },
162
+ onClick: () => $(t),
163
+ className: e("text-text-base-neutral-5 flex cursor-pointer items-center gap-3 px-3 py-2.5 select-none", S === "large" ? "text-body-16-regular" : "text-body-14-regular", n === W && "bg-surface-base-neutral-2", r && "font-medium", t.disabled && "cursor-not-allowed opacity-50"),
164
+ children: [/* @__PURE__ */ i("span", {
165
+ className: "min-w-0 flex-1 truncate",
166
+ children: t.label
167
+ }), r && /* @__PURE__ */ i("svg", {
168
+ "aria-hidden": "true",
169
+ viewBox: "0 0 20 20",
170
+ fill: "none",
171
+ className: "text-icon-prominent-accent-1 size-4 shrink-0",
172
+ children: /* @__PURE__ */ i("path", {
173
+ d: "m4 10 3.5 3.5L16 5",
174
+ stroke: "currentColor",
175
+ strokeWidth: "2",
176
+ strokeLinecap: "round",
177
+ strokeLinejoin: "round"
178
+ })
179
+ })]
180
+ }, t.value);
181
+ }), K.length === 0 && _ !== void 0 && /* @__PURE__ */ i("li", {
182
+ role: "presentation",
183
+ className: "text-text-base-neutral-2 text-body-14-regular px-3 py-2.5",
184
+ children: _
185
+ })]
186
+ })
187
+ ]
188
+ }),
189
+ /* @__PURE__ */ i(re, {
190
+ id: A,
191
+ size: S,
192
+ errorText: b,
193
+ assistiveText: x
194
+ })
195
+ ]
196
+ });
197
+ };
198
+ //#endregion
199
+ export { p as Combobox };
200
+
201
+ //# sourceMappingURL=combobox.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"combobox.js","names":[],"sources":["../src/components/combobox/Combobox.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useId, useMemo, useRef, useState } from \"react\";\n\nimport { ChevronDownIcon } from \"../icons/action/ChevronDownIcon\";\n\nimport type { ComponentPropsWithRef, KeyboardEvent, ReactNode } from \"react\";\n\nimport { FieldLabel, FieldMessage } from \"@/components/ui/field\";\nimport {\n FIELD_RADIUS,\n fieldContainerVariants,\n fieldValueFontSize,\n joinIds,\n type FieldSize,\n} from \"@/components/ui/fieldStyles\";\nimport { mergeRefs } from \"@/utils/mergeRefs\";\nimport { cn } from \"@/utils/TailwindUtil\";\n\nexport interface ComboboxOption {\n value: string;\n label: string;\n disabled?: boolean;\n}\n\ninterface ComboboxProps\n extends Omit<\n ComponentPropsWithRef<\"input\">,\n \"size\" | \"value\" | \"defaultValue\" | \"onChange\" | \"type\" | \"role\" | \"children\"\n > {\n /** 칸 위에 보이는 이름. `<label>`로 입력에 연결된다. */\n label?: string;\n /** 문자열 옵션은 값과 표시 이름이 같다. */\n options: (string | ComboboxOption)[];\n /** 고른 옵션의 값. 고르지 않았으면 `\"\"`. */\n value: string;\n /** 옵션을 고르면 그 값으로, 고른 뒤 다시 입력하기 시작하면 `\"\"`로 호출된다. */\n onChange: (value: string) => void;\n /** 입력한 검색어로 옵션을 거른다. 기본은 대소문자·공백을 무시한 부분 일치. */\n filter?: (option: ComboboxOption, query: string) => boolean;\n /** 맞는 옵션이 없을 때 목록에 보이는 문구. 없으면 목록을 닫는다. */\n emptyText?: ReactNode;\n /** 목록 열기 버튼의 접근 가능한 이름. 기본은 `label`. */\n toggleLabel?: string;\n /** `required`인데 입력한 글자가 옵션으로 골라지지 않았을 때 브라우저 검증 메시지. 다국어 페이지에서는 번역해 넘긴다. */\n invalidSelectionText?: string;\n errorText?: string;\n assistiveText?: ReactNode;\n size?: FieldSize;\n}\n\nconst normalize = (text: string) => text.toLocaleLowerCase().replace(/\\s+/g, \"\");\n\nconst defaultFilter = (option: ComboboxOption, query: string) => normalize(option.label).includes(normalize(query));\n\n/**\n * 입력해서 검색하고 목록에서 하나를 고르는 입력(WAI-ARIA combobox, list autocomplete).\n * 포커스는 입력에 남고 목록의 현재 항목은 `aria-activedescendant`로 알린다.\n * 고른 값만 `value`가 되고, 입력한 글자는 고르기 전까지 값이 아니다.\n */\nconst Combobox = ({\n id,\n label,\n options,\n value,\n onChange,\n filter = defaultFilter,\n emptyText,\n toggleLabel,\n invalidSelectionText = \"Select an option from the list.\",\n errorText,\n assistiveText,\n size = \"large\",\n name,\n required,\n disabled = false,\n placeholder,\n className,\n autoComplete = \"off\",\n \"aria-describedby\": ariaDescribedBy,\n onBlur,\n onKeyDown,\n onClick,\n ref,\n ...inputProps\n}: ComboboxProps) => {\n const generatedId = useId();\n const inputId = id ?? generatedId;\n const listboxId = `${inputId}-listbox`;\n const messageId = `${inputId}-message`;\n const optionId = (index: number) => `${inputId}-option-${index}`;\n const hasError = Boolean(errorText);\n const hasMessage = Boolean(errorText || assistiveText);\n const labelId = `${inputId}-label`;\n const inputRef = useRef<HTMLInputElement | null>(null);\n const setRef = useMemo(() => mergeRefs(inputRef, ref), [ref]);\n // 이 컴포넌트가 onChange로 낸 값. 바깥에서 value를 바꿨는지 구분한다.\n const emittedValue = useRef<string | null>(null);\n // 키보드로 옮길 때만 현재 항목을 스크롤한다. 마우스 hover로 스크롤하면 목록이 흔들린다.\n const scrollOnMove = useRef(false);\n\n const normalized = options.map((option) => (typeof option === \"string\" ? { value: option, label: option } : option));\n const selected = normalized.find((option) => option.value === value);\n // null이면 검색 중이 아니고, 입력에는 고른 옵션 이름이 보인다.\n const [query, setQuery] = useState<string | null>(null);\n const [open, setOpen] = useState(false);\n const [activeIndex, setActiveIndex] = useState(-1);\n\n // 인덱스는 전체 옵션 기준이라 거르더라도 id가 다른 옵션으로 넘어가지 않는다.\n const matches = normalized\n .map((option, index) => ({ option, index }))\n .filter(({ option }) => (query ? filter(option, query) : true));\n const expanded = open && !disabled && (matches.length > 0 || emptyText !== undefined);\n const enabledMatches = matches.filter(({ option }) => !option.disabled);\n\n useEffect(() => {\n const shouldScroll = scrollOnMove.current;\n scrollOnMove.current = false;\n if (!expanded || activeIndex < 0 || !shouldScroll) return;\n document.getElementById(optionId(activeIndex))?.scrollIntoView?.({ block: \"nearest\" });\n // optionId는 inputId에서만 바뀐다.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [expanded, activeIndex]);\n\n // 바깥에서 value가 바뀌면(폼 reset 등) 입력 중인 검색어를 버리고 새 값의 이름을 보인다.\n useEffect(() => {\n if (value !== emittedValue.current) setQuery(null);\n emittedValue.current = null;\n }, [value]);\n\n // 부모가 낸 값을 받아들이지 않아 value가 그대로면, 다음 바깥 변경을 우리 값으로 오인하지 않게 비운다.\n useEffect(() => {\n emittedValue.current = null;\n });\n\n // 브라우저 검증은 보이는 글자를 본다. 글자는 있는데 고른 옵션이 없으면 통과하지 않게 한다.\n const selectionMissing = Boolean(required && !selected && query);\n useEffect(() => {\n inputRef.current?.setCustomValidity(selectionMissing ? invalidSelectionText : \"\");\n }, [selectionMissing, invalidSelectionText]);\n\n const emit = (next: string) => {\n emittedValue.current = next;\n onChange(next);\n };\n\n const openList = () => {\n scrollOnMove.current = true;\n setOpen(true);\n setActiveIndex(selected && !selected.disabled ? normalized.indexOf(selected) : -1);\n };\n\n const close = () => {\n setOpen(false);\n setQuery(null);\n setActiveIndex(-1);\n };\n\n const pick = (option: ComboboxOption) => {\n if (option.disabled) return;\n emit(option.value);\n close();\n };\n\n const move = (step: 1 | -1) => {\n if (enabledMatches.length === 0) return;\n const position = enabledMatches.findIndex(({ index }) => index === activeIndex);\n const next =\n position === -1\n ? step === 1\n ? 0\n : enabledMatches.length - 1\n : (position + step + enabledMatches.length) % enabledMatches.length;\n scrollOnMove.current = true;\n setActiveIndex(enabledMatches[next].index);\n };\n\n const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\n onKeyDown?.(event);\n // IME 조합(한글·일본어) 중 Enter·방향키는 조합을 확정하는 키다. keyCode 229는 Safari용.\n if (event.defaultPrevented || event.nativeEvent.isComposing || event.keyCode === 229) return;\n\n switch (event.key) {\n case \"ArrowDown\":\n case \"ArrowUp\":\n event.preventDefault();\n if (open && event.altKey && event.key === \"ArrowUp\") {\n close();\n return;\n }\n if (!open) {\n // 열 때는 고른 옵션을, 고른 게 없으면 방향에 맞는 첫 옵션을 가리킨다. Alt는 열기만 한다.\n setOpen(true);\n const selectedIndex = selected && !selected.disabled ? normalized.indexOf(selected) : -1;\n const edge = event.key === \"ArrowDown\" ? enabledMatches[0] : enabledMatches[enabledMatches.length - 1];\n scrollOnMove.current = true;\n setActiveIndex(selectedIndex >= 0 || event.altKey ? selectedIndex : (edge?.index ?? -1));\n return;\n }\n move(event.key === \"ArrowDown\" ? 1 : -1);\n return;\n case \"Enter\":\n if (expanded && activeIndex >= 0) {\n event.preventDefault();\n pick(normalized[activeIndex]);\n }\n return;\n case \"Escape\":\n if (expanded || query !== null) {\n event.preventDefault();\n close();\n }\n return;\n }\n };\n\n const handleInput = (text: string) => {\n // 브라우저 자동완성처럼 옵션 이름과 똑같이 입력되면 그 옵션을 고른 것으로 본다.\n const exact = text.trim()\n ? normalized.find((option) => !option.disabled && normalize(option.label) === normalize(text))\n : undefined;\n if (exact) {\n if (exact.value !== value) emit(exact.value);\n } else if (value !== \"\") {\n emit(\"\");\n }\n\n // 포커스가 없을 때 들어온 입력(다른 칸에서 시작한 자동완성)은 목록을 열지 않는다.\n if (document.activeElement !== inputRef.current) {\n setQuery(exact ? null : text);\n return;\n }\n\n setQuery(text);\n setOpen(true);\n const firstMatch = normalized.findIndex((option) => !option.disabled && (text ? filter(option, text) : true));\n scrollOnMove.current = true;\n setActiveIndex(exact ? normalized.indexOf(exact) : text ? firstMatch : -1);\n };\n\n return (\n <div className={cn(\"flex w-full min-w-0 flex-col gap-2\", className)}>\n {label && (\n <FieldLabel id={labelId} htmlFor={inputId} size={size} required={required}>\n {label}\n </FieldLabel>\n )}\n <div className=\"relative\">\n <div className=\"relative\">\n <input\n {...inputProps}\n ref={setRef}\n id={inputId}\n type=\"text\"\n role=\"combobox\"\n aria-expanded={expanded}\n aria-controls={listboxId}\n aria-autocomplete=\"list\"\n aria-activedescendant={expanded && activeIndex >= 0 ? optionId(activeIndex) : undefined}\n aria-invalid={hasError || undefined}\n aria-describedby={joinIds(ariaDescribedBy, hasMessage && messageId)}\n autoComplete={autoComplete}\n required={required}\n disabled={disabled}\n placeholder={placeholder}\n value={query ?? selected?.label ?? \"\"}\n onChange={(event) => handleInput(event.target.value)}\n onKeyDown={handleKeyDown}\n onClick={(event) => {\n onClick?.(event);\n if (!open && !event.defaultPrevented) openList();\n }}\n onBlur={(event) => {\n onBlur?.(event);\n close();\n }}\n className={cn(\n fieldContainerVariants({ size, hasError, disabled }),\n \"text-text-base-neutral-5 placeholder:text-text-base-neutral-2 w-full min-w-0 truncate outline-none disabled:cursor-not-allowed\",\n !disabled && !hasError && \"focus:border-border-base-neutral-4\",\n size === \"large\" ? \"pr-14\" : \"pr-12\",\n fieldValueFontSize(size),\n )}\n />\n <button\n type=\"button\"\n tabIndex={-1}\n aria-label={toggleLabel ?? label ?? inputProps[\"aria-label\"]}\n aria-controls={listboxId}\n aria-expanded={expanded}\n disabled={disabled}\n // 입력의 포커스를 유지해야 blur로 목록이 닫히지 않는다.\n onMouseDown={(event) => event.preventDefault()}\n onClick={() => {\n if (expanded) close();\n else openList();\n inputRef.current?.focus();\n }}\n className={cn(\n \"absolute inset-y-0 right-0 flex cursor-pointer items-center justify-center disabled:cursor-not-allowed\",\n size === \"large\" ? \"w-14\" : \"w-12\",\n )}\n >\n <ChevronDownIcon\n aria-hidden=\"true\"\n className={cn(\n \"size-6 transition-transform duration-200\",\n expanded ? \"text-icon-prominent-accent-1 rotate-180\" : \"text-icon-base-neutral-3\",\n )}\n />\n </button>\n </div>\n {name && <input type=\"hidden\" name={name} value={value} disabled={disabled} form={inputProps.form} />}\n <ul\n id={listboxId}\n role=\"listbox\"\n aria-labelledby={label ? labelId : undefined}\n aria-label={label ? undefined : inputProps[\"aria-label\"]}\n hidden={!expanded}\n onMouseDown={(event) => event.preventDefault()}\n className={cn(\n \"border-border-base-neutral-2 bg-surface-base-neutral-1 absolute z-20 mt-2 max-h-72 w-full overflow-y-auto border py-1 shadow-lg\",\n FIELD_RADIUS,\n )}\n >\n {matches.map(({ option, index }) => {\n const isSelected = option.value === value;\n return (\n <li\n key={option.value}\n id={optionId(index)}\n role=\"option\"\n aria-selected={isSelected}\n aria-disabled={option.disabled || undefined}\n onMouseMove={() => {\n scrollOnMove.current = false;\n if (!option.disabled) setActiveIndex(index);\n }}\n onClick={() => pick(option)}\n className={cn(\n \"text-text-base-neutral-5 flex cursor-pointer items-center gap-3 px-3 py-2.5 select-none\",\n size === \"large\" ? \"text-body-16-regular\" : \"text-body-14-regular\",\n index === activeIndex && \"bg-surface-base-neutral-2\",\n isSelected && \"font-medium\",\n option.disabled && \"cursor-not-allowed opacity-50\",\n )}\n >\n <span className=\"min-w-0 flex-1 truncate\">{option.label}</span>\n {isSelected && (\n <svg\n aria-hidden=\"true\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n className=\"text-icon-prominent-accent-1 size-4 shrink-0\"\n >\n <path\n d=\"m4 10 3.5 3.5L16 5\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n )}\n </li>\n );\n })}\n {matches.length === 0 && emptyText !== undefined && (\n <li role=\"presentation\" className=\"text-text-base-neutral-2 text-body-14-regular px-3 py-2.5\">\n {emptyText}\n </li>\n )}\n </ul>\n </div>\n <FieldMessage id={messageId} size={size} errorText={errorText} assistiveText={assistiveText} />\n </div>\n );\n};\n\nexport { Combobox };\n"],"mappings":"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"}
@@ -0,0 +1,62 @@
1
+ "use client";
2
+ import { t as e } from "./TailwindUtil-DiNvXuNl.js";
3
+ import { Fragment as t, jsx as n, jsxs as r } from "react/jsx-runtime";
4
+ import * as i from "react";
5
+ import { cva as a } from "class-variance-authority";
6
+ //#region src/components/cta-button/CTAButton.tsx
7
+ var o = a("flex flex-row items-center justify-center gap-1 shadow-none duration-200 transition-all", {
8
+ variants: {
9
+ hierarchy: {
10
+ primary: "bg-surface-primary-accent hover:bg-surface-primary-accent-hover active:bg-surface-primary-accent-pressed text-text-prominent-neutral-1",
11
+ secondary: "bg-surface-secondary-accent hover:bg-surface-secondary-accent-hover active:bg-surface-secondary-accent-pressed text-text-prominent-accent-2",
12
+ tertiary: "bg-background-base-neutral-1 hover:bg-surface-tertiary-accent-hover active:bg-surface-tertiary-accent-pressed border-border-prominent-accent border text-text-prominent-accent-1"
13
+ },
14
+ size: {
15
+ large: "h-14 px-4 py-4 gap-1 text-title-18-medium rounded-[10px]",
16
+ medium: "h-[46px] px-4 py-3 gap-1 text-body-16-medium rounded-[8px]",
17
+ small: "h-10 px-3 py-2 gap-1 text-body-16-medium rounded-[6px]"
18
+ }
19
+ },
20
+ defaultVariants: {
21
+ hierarchy: "primary",
22
+ size: "large"
23
+ }
24
+ }), s = a("shrink-0", {
25
+ variants: {
26
+ hierarchy: {
27
+ primary: "text-icon-base-neutral-1",
28
+ secondary: "text-icon-prominent-accent-2",
29
+ tertiary: "text-icon-prominent-accent-1"
30
+ },
31
+ size: {
32
+ large: "size-6",
33
+ medium: "size-[22px]",
34
+ small: "size-5"
35
+ }
36
+ },
37
+ defaultVariants: {
38
+ hierarchy: "primary",
39
+ size: "large"
40
+ }
41
+ }), c = i.forwardRef(({ label: i, icon: a, hierarchy: c = "primary", size: l = "large", disabled: u = !1, className: d, type: f = "button", ...p }, m) => {
42
+ let h = /* @__PURE__ */ r(t, { children: [a && /* @__PURE__ */ n(a, { className: s({
43
+ hierarchy: c,
44
+ size: l
45
+ }) }), i] });
46
+ return /* @__PURE__ */ n("button", {
47
+ ref: m,
48
+ type: f,
49
+ className: e(o({
50
+ hierarchy: c,
51
+ size: l
52
+ }), "opacity-100 disabled:opacity-40 disabled:pointer-events-none", d),
53
+ disabled: u,
54
+ ...p,
55
+ children: h
56
+ });
57
+ });
58
+ c.displayName = "CTAButton";
59
+ //#endregion
60
+ export { c as CTAButton };
61
+
62
+ //# sourceMappingURL=cta-button.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"cta-button.js","names":[],"sources":["../src/components/cta-button/CTAButton.tsx"],"sourcesContent":["\"use client\";\n\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport * as React from \"react\";\n\nimport { cn } from \"../../utils/TailwindUtil\";\n\nconst ctaButtonVariants = cva(\n \"flex flex-row items-center justify-center gap-1 shadow-none duration-200 transition-all\",\n {\n variants: {\n hierarchy: {\n primary:\n \"bg-surface-primary-accent hover:bg-surface-primary-accent-hover active:bg-surface-primary-accent-pressed text-text-prominent-neutral-1\",\n secondary:\n \"bg-surface-secondary-accent hover:bg-surface-secondary-accent-hover active:bg-surface-secondary-accent-pressed text-text-prominent-accent-2\",\n tertiary:\n \"bg-background-base-neutral-1 hover:bg-surface-tertiary-accent-hover active:bg-surface-tertiary-accent-pressed border-border-prominent-accent border text-text-prominent-accent-1\",\n },\n size: {\n large: \"h-14 px-4 py-4 gap-1 text-title-18-medium rounded-[10px]\",\n medium: \"h-[46px] px-4 py-3 gap-1 text-body-16-medium rounded-[8px]\",\n small: \"h-10 px-3 py-2 gap-1 text-body-16-medium rounded-[6px]\",\n },\n },\n defaultVariants: {\n hierarchy: \"primary\",\n size: \"large\",\n },\n },\n);\n\nconst ctaButtonIconVariants = cva(\"shrink-0\", {\n variants: {\n hierarchy: {\n primary: \"text-icon-base-neutral-1\",\n secondary: \"text-icon-prominent-accent-2\",\n tertiary: \"text-icon-prominent-accent-1\",\n },\n size: {\n large: \"size-6\",\n medium: \"size-[22px]\",\n small: \"size-5\",\n },\n },\n defaultVariants: {\n hierarchy: \"primary\",\n size: \"large\",\n },\n});\n\nexport interface CTAButtonProps\n extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, \"children\">,\n VariantProps<typeof ctaButtonVariants> {\n label: string | React.ReactNode;\n icon?: React.ComponentType<{ className?: string }>;\n className?: string;\n}\n\nconst CTAButton = React.forwardRef<HTMLButtonElement, CTAButtonProps>(\n (\n {\n label,\n icon: Icon,\n hierarchy = \"primary\",\n size = \"large\",\n disabled = false,\n className,\n type = \"button\",\n ...props\n },\n ref,\n ) => {\n const content = (\n <>\n {Icon && <Icon className={ctaButtonIconVariants({ hierarchy, size })} />}\n {label}\n </>\n );\n\n const buttonClassName = cn(\n ctaButtonVariants({ hierarchy, size }),\n \"opacity-100 disabled:opacity-40 disabled:pointer-events-none\",\n className,\n );\n\n return (\n <button ref={ref} type={type} className={buttonClassName} disabled={disabled} {...props}>\n {content}\n </button>\n );\n },\n);\n\nCTAButton.displayName = \"CTAButton\";\n\nexport { CTAButton };\n"],"mappings":";;;;;;AAOA,IAAM,IAAoB,EACxB,2FACA;CACE,UAAU;EACR,WAAW;GACT,SACE;GACF,WACE;GACF,UACE;EACJ;EACA,MAAM;GACJ,OAAO;GACP,QAAQ;GACR,OAAO;EACT;CACF;CACA,iBAAiB;EACf,WAAW;EACX,MAAM;CACR;AACF,CACF,GAEM,IAAwB,EAAI,YAAY;CAC5C,UAAU;EACR,WAAW;GACT,SAAS;GACT,WAAW;GACX,UAAU;EACZ;EACA,MAAM;GACJ,OAAO;GACP,QAAQ;GACR,OAAO;EACT;CACF;CACA,iBAAiB;EACf,WAAW;EACX,MAAM;CACR;AACF,CAAC,GAUK,IAAY,EAAM,YAEpB,EACE,UACA,MAAM,GACN,eAAY,WACZ,UAAO,SACP,cAAW,IACX,cACA,UAAO,UACP,GAAG,KAEL,MACG;CACH,IAAM,IACJ,kBAAA,GAAA,EAAA,UAAA,CACG,KAAQ,kBAAC,GAAD,EAAM,WAAW,EAAsB;EAAE;EAAW;CAAK,CAAC,EAAI,CAAA,GACtE,CACD,EAAA,CAAA;CASJ,OACE,kBAAC,UAAD;EAAa;EAAW;EAAM,WAPR,EACtB,EAAkB;GAAE;GAAW;EAAK,CAAC,GACrC,gEACA,CAIyC;EAA2B;EAAU,GAAI;YAC/E;CACK,CAAA;AAEZ,CACF;AAEA,EAAU,cAAc"}
@@ -0,0 +1,42 @@
1
+ import { cva as e } from "class-variance-authority";
2
+ //#region src/components/ui/fieldStyles.ts
3
+ var t = "rounded-[4px]", n = e(`flex items-center ${t} bg-surface-base-neutral-2 border transition-colors duration-200`, {
4
+ variants: {
5
+ size: {
6
+ large: "gap-2 p-[15px] min-h-[56px]",
7
+ small: "gap-3 p-[11px] min-h-[48px]"
8
+ },
9
+ hasError: {
10
+ true: "border-border-prominent-error",
11
+ false: "border-transparent"
12
+ },
13
+ disabled: {
14
+ true: "opacity-50",
15
+ false: ""
16
+ }
17
+ },
18
+ defaultVariants: {
19
+ size: "large",
20
+ disabled: !1,
21
+ hasError: !1
22
+ }
23
+ }), r = e("", {
24
+ variants: {
25
+ size: {
26
+ large: "text-body-16-regular",
27
+ small: "text-caption-12-medium"
28
+ },
29
+ hasError: {
30
+ true: "text-text-prominent-error",
31
+ false: "text-text-base-neutral-2"
32
+ }
33
+ },
34
+ defaultVariants: {
35
+ size: "large",
36
+ hasError: !1
37
+ }
38
+ }), i = (e) => e === "large" ? "text-title-18-bold" : "text-title-14-bold", a = (e) => e === "large" ? "text-title-20-regular" : "text-body-16-regular", o = (...e) => e.filter(Boolean).join(" ") || void 0;
39
+ //#endregion
40
+ export { a, r as i, n, o, i as r, t };
41
+
42
+ //# sourceMappingURL=fieldStyles-DyZu__hI.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"fieldStyles-DyZu__hI.js","names":[],"sources":["../src/components/ui/fieldStyles.ts"],"sourcesContent":["import { cva } from \"class-variance-authority\";\n\n// TextField, Select, Combobox가 함께 쓰는 입력 칸 스타일\n// 입력 칸과 목록 팝업이 같은 모서리를 쓴다. 소비 레포의 --radius-* 설정과 무관하게 4px로 고정한다.\nexport const FIELD_RADIUS = \"rounded-[4px]\";\n\nexport const fieldContainerVariants = cva(\n `flex items-center ${FIELD_RADIUS} bg-surface-base-neutral-2 border transition-colors duration-200`,\n {\n variants: {\n size: {\n large: \"gap-2 p-[15px] min-h-[56px]\",\n small: \"gap-3 p-[11px] min-h-[48px]\",\n },\n hasError: {\n true: \"border-border-prominent-error\",\n false: \"border-transparent\",\n },\n disabled: {\n true: \"opacity-50\",\n false: \"\",\n },\n },\n defaultVariants: {\n size: \"large\",\n disabled: false,\n hasError: false,\n },\n },\n);\n\nexport const fieldMessageVariants = cva(\"\", {\n variants: {\n size: {\n large: \"text-body-16-regular\",\n small: \"text-caption-12-medium\",\n },\n hasError: {\n true: \"text-text-prominent-error\",\n false: \"text-text-base-neutral-2\",\n },\n },\n defaultVariants: {\n size: \"large\",\n hasError: false,\n },\n});\n\nexport type FieldSize = \"large\" | \"small\";\n\nexport const fieldLabelFontSize = (size: FieldSize) => (size === \"large\" ? \"text-title-18-bold\" : \"text-title-14-bold\");\nexport const fieldValueFontSize = (size: FieldSize) =>\n size === \"large\" ? \"text-title-20-regular\" : \"text-body-16-regular\";\n\n// 소비 레포가 넘긴 aria-describedby와 필드 메시지 id를 합친다.\nexport const joinIds = (...ids: (string | false | undefined)[]) => ids.filter(Boolean).join(\" \") || undefined;\n"],"mappings":";;AAIA,IAAa,IAAe,iBAEf,IAAyB,EACpC,qBAAqB,EAAa,mEAClC;CACE,UAAU;EACR,MAAM;GACJ,OAAO;GACP,OAAO;EACT;EACA,UAAU;GACR,MAAM;GACN,OAAO;EACT;EACA,UAAU;GACR,MAAM;GACN,OAAO;EACT;CACF;CACA,iBAAiB;EACf,MAAM;EACN,UAAU;EACV,UAAU;CACZ;AACF,CACF,GAEa,IAAuB,EAAI,IAAI;CAC1C,UAAU;EACR,MAAM;GACJ,OAAO;GACP,OAAO;EACT;EACA,UAAU;GACR,MAAM;GACN,OAAO;EACT;CACF;CACA,iBAAiB;EACf,MAAM;EACN,UAAU;CACZ;AACF,CAAC,GAIY,KAAsB,MAAqB,MAAS,UAAU,uBAAuB,sBACrF,KAAsB,MACjC,MAAS,UAAU,0BAA0B,wBAGlC,KAAW,GAAG,MAAwC,EAAI,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,KAAK,KAAA"}
@@ -0,0 +1,22 @@
1
+ import { jsx as e, jsxs as t } from "react/jsx-runtime";
2
+ //#region src/components/icons/action/CancelFilledIcon.tsx
3
+ var n = (n) => /* @__PURE__ */ t("svg", {
4
+ width: "24",
5
+ height: "24",
6
+ viewBox: "0 0 24 24",
7
+ fill: "none",
8
+ ...n,
9
+ children: [/* @__PURE__ */ e("circle", {
10
+ cx: 12,
11
+ cy: 12,
12
+ r: 10,
13
+ fill: "!currentColor"
14
+ }), /* @__PURE__ */ e("path", {
15
+ fill: "currentColor",
16
+ d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m4.53 13.47c.29.29.29.77 0 1.06-.15.15-.34.22-.53.22s-.38-.07-.53-.22L12 13.06l-3.47 3.47c-.15.15-.34.22-.53.22s-.38-.07-.53-.22a.754.754 0 0 1 0-1.06L10.94 12 7.47 8.53a.754.754 0 0 1 0-1.06c.29-.29.77-.29 1.06 0L12 10.94l3.47-3.47c.29-.29.77-.29 1.06 0s.29.77 0 1.06L13.06 12z"
17
+ })]
18
+ });
19
+ //#endregion
20
+ export { n as CancelFilledIcon };
21
+
22
+ //# sourceMappingURL=cancel-filled.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"cancel-filled.js","names":[],"sources":["../../../src/components/icons/action/CancelFilledIcon.tsx"],"sourcesContent":["import type { SVGProps } from \"react\";\n\nconst CancelFilledIcon = (props: SVGProps<SVGSVGElement>) => {\n return (\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" {...props}>\n <circle cx={12} cy={12} r={10} fill=\"!currentColor\" />\n <path\n fill=\"currentColor\"\n d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m4.53 13.47c.29.29.29.77 0 1.06-.15.15-.34.22-.53.22s-.38-.07-.53-.22L12 13.06l-3.47 3.47c-.15.15-.34.22-.53.22s-.38-.07-.53-.22a.754.754 0 0 1 0-1.06L10.94 12 7.47 8.53a.754.754 0 0 1 0-1.06c.29-.29.77-.29 1.06 0L12 10.94l3.47-3.47c.29-.29.77-.29 1.06 0s.29.77 0 1.06L13.06 12z\"\n />\n </svg>\n );\n};\n\nexport { CancelFilledIcon };\n"],"mappings":";;AAEA,IAAM,KAAoB,MAEtB,kBAAC,OAAD;CAAK,OAAM;CAAK,QAAO;CAAK,SAAQ;CAAY,MAAK;CAAO,GAAI;WAAhE,CACE,kBAAC,UAAD;EAAQ,IAAI;EAAI,IAAI;EAAI,GAAG;EAAI,MAAK;CAAiB,CAAA,GACrD,kBAAC,QAAD;EACE,MAAK;EACL,GAAE;CACH,CAAA,CACE"}
@@ -0,0 +1,19 @@
1
+ import { jsx as e } from "react/jsx-runtime";
2
+ //#region src/components/icons/action/CancelIcon.tsx
3
+ var t = (t) => /* @__PURE__ */ e("svg", {
4
+ width: "24",
5
+ height: "24",
6
+ viewBox: "0 0 24 24",
7
+ fill: "none",
8
+ ...t,
9
+ children: /* @__PURE__ */ e("path", {
10
+ fillRule: "evenodd",
11
+ clipRule: "evenodd",
12
+ d: "M19.7071 4.29289C20.0976 4.68342 20.0976 5.31658 19.7071 5.70711L13.4142 12L19.7071 18.2929C20.0976 18.6834 20.0976 19.3166 19.7071 19.7071C19.3166 20.0976 18.6834 20.0976 18.2929 19.7071L12 13.4142L5.70711 19.7071C5.31658 20.0976 4.68342 20.0976 4.29289 19.7071C3.90237 19.3166 3.90237 18.6834 4.29289 18.2929L10.5858 12L4.29289 5.70711C3.90237 5.31659 3.90237 4.68342 4.29289 4.2929C4.68342 3.90237 5.31658 3.90237 5.70711 4.2929L12 10.5858L18.2929 4.29289C18.6834 3.90237 19.3166 3.90237 19.7071 4.29289Z",
13
+ fill: "currentColor"
14
+ })
15
+ });
16
+ //#endregion
17
+ export { t as CancelIcon };
18
+
19
+ //# sourceMappingURL=cancel.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"cancel.js","names":[],"sources":["../../../src/components/icons/action/CancelIcon.tsx"],"sourcesContent":["import type { SVGProps } from \"react\";\n\nconst CancelIcon = (props: SVGProps<SVGSVGElement>) => {\n return (\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" {...props}>\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M19.7071 4.29289C20.0976 4.68342 20.0976 5.31658 19.7071 5.70711L13.4142 12L19.7071 18.2929C20.0976 18.6834 20.0976 19.3166 19.7071 19.7071C19.3166 20.0976 18.6834 20.0976 18.2929 19.7071L12 13.4142L5.70711 19.7071C5.31658 20.0976 4.68342 20.0976 4.29289 19.7071C3.90237 19.3166 3.90237 18.6834 4.29289 18.2929L10.5858 12L4.29289 5.70711C3.90237 5.31659 3.90237 4.68342 4.29289 4.2929C4.68342 3.90237 5.31658 3.90237 5.70711 4.2929L12 10.5858L18.2929 4.29289C18.6834 3.90237 19.3166 3.90237 19.7071 4.29289Z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n};\n\nexport { CancelIcon };\n"],"mappings":";;AAEA,IAAM,KAAc,MAEhB,kBAAC,OAAD;CAAK,OAAM;CAAK,QAAO;CAAK,SAAQ;CAAY,MAAK;CAAO,GAAI;WAC9D,kBAAC,QAAD;EACE,UAAS;EACT,UAAS;EACT,GAAE;EACF,MAAK;CACN,CAAA;AACE,CAAA"}
@@ -0,0 +1,19 @@
1
+ import { jsx as e } from "react/jsx-runtime";
2
+ //#region src/components/icons/action/ChevronDownIcon.tsx
3
+ var t = (t) => /* @__PURE__ */ e("svg", {
4
+ width: "24",
5
+ height: "24",
6
+ viewBox: "0 0 24 24",
7
+ fill: "none",
8
+ ...t,
9
+ children: /* @__PURE__ */ e("path", {
10
+ fillRule: "evenodd",
11
+ clipRule: "evenodd",
12
+ d: "M19.6585 7.24741C20.0741 7.61109 20.1162 8.24285 19.7526 8.65849L12.7526 16.6585C12.5627 16.8755 12.2883 17 12 17C11.7116 17 11.4373 16.8755 11.2474 16.6585L4.24741 8.65849C3.88373 8.24285 3.92584 7.61109 4.34148 7.24741C4.75712 6.88372 5.38888 6.92584 5.75256 7.34148L12 14.4814L18.2474 7.34148C18.6111 6.92584 19.2429 6.88372 19.6585 7.24741Z",
13
+ fill: "currentColor"
14
+ })
15
+ });
16
+ //#endregion
17
+ export { t as ChevronDownIcon };
18
+
19
+ //# sourceMappingURL=chevron-down.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"chevron-down.js","names":[],"sources":["../../../src/components/icons/action/ChevronDownIcon.tsx"],"sourcesContent":["import type { SVGProps } from \"react\";\n\nconst ChevronDownIcon = (props: SVGProps<SVGSVGElement>) => {\n return (\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" {...props}>\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M19.6585 7.24741C20.0741 7.61109 20.1162 8.24285 19.7526 8.65849L12.7526 16.6585C12.5627 16.8755 12.2883 17 12 17C11.7116 17 11.4373 16.8755 11.2474 16.6585L4.24741 8.65849C3.88373 8.24285 3.92584 7.61109 4.34148 7.24741C4.75712 6.88372 5.38888 6.92584 5.75256 7.34148L12 14.4814L18.2474 7.34148C18.6111 6.92584 19.2429 6.88372 19.6585 7.24741Z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n};\n\nexport { ChevronDownIcon };\n"],"mappings":";;AAEA,IAAM,KAAmB,MAErB,kBAAC,OAAD;CAAK,OAAM;CAAK,QAAO;CAAK,SAAQ;CAAY,MAAK;CAAO,GAAI;WAC9D,kBAAC,QAAD;EACE,UAAS;EACT,UAAS;EACT,GAAE;EACF,MAAK;CACN,CAAA;AACE,CAAA"}
@@ -0,0 +1,19 @@
1
+ import { jsx as e } from "react/jsx-runtime";
2
+ //#region src/components/icons/action/ChevronLeftIcon.tsx
3
+ var t = (t) => /* @__PURE__ */ e("svg", {
4
+ width: "24",
5
+ height: "24",
6
+ viewBox: "0 0 24 24",
7
+ fill: "none",
8
+ ...t,
9
+ children: /* @__PURE__ */ e("path", {
10
+ fillRule: "evenodd",
11
+ clipRule: "evenodd",
12
+ d: "M16.753 19.659a1 1 0 0 1-1.412.094l-8-7a1 1 0 0 1 0-1.506l8-7a1 1 0 0 1 1.318 1.506L9.519 12l7.14 6.247a1 1 0 0 1 .094 1.412",
13
+ fill: "currentColor"
14
+ })
15
+ });
16
+ //#endregion
17
+ export { t as ChevronLeftIcon };
18
+
19
+ //# sourceMappingURL=chevron-left.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"chevron-left.js","names":[],"sources":["../../../src/components/icons/action/ChevronLeftIcon.tsx"],"sourcesContent":["import type { SVGProps } from \"react\";\n\nconst ChevronLeftIcon = (props: SVGProps<SVGSVGElement>) => {\n return (\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" {...props}>\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M16.753 19.659a1 1 0 0 1-1.412.094l-8-7a1 1 0 0 1 0-1.506l8-7a1 1 0 0 1 1.318 1.506L9.519 12l7.14 6.247a1 1 0 0 1 .094 1.412\"\n fill=\"currentColor\"\n />\n </svg>\n );\n};\n\nexport { ChevronLeftIcon };\n"],"mappings":";;AAEA,IAAM,KAAmB,MAErB,kBAAC,OAAD;CAAK,OAAM;CAAK,QAAO;CAAK,SAAQ;CAAY,MAAK;CAAO,GAAI;WAC9D,kBAAC,QAAD;EACE,UAAS;EACT,UAAS;EACT,GAAE;EACF,MAAK;CACN,CAAA;AACE,CAAA"}
@@ -0,0 +1,19 @@
1
+ import { jsx as e } from "react/jsx-runtime";
2
+ //#region src/components/icons/action/ChevronRightIcon.tsx
3
+ var t = (t) => /* @__PURE__ */ e("svg", {
4
+ width: "24",
5
+ height: "24",
6
+ viewBox: "0 0 24 24",
7
+ fill: "none",
8
+ ...t,
9
+ children: /* @__PURE__ */ e("path", {
10
+ fillRule: "evenodd",
11
+ clipRule: "evenodd",
12
+ d: "M7.24744 4.34151C7.61112 3.92587 8.24288 3.88375 8.65852 4.24744L16.6585 11.2474C16.8755 11.4373 17 11.7117 17 12C17 12.2884 16.8755 12.5627 16.6585 12.7526L8.65852 19.7526C8.24288 20.1163 7.61112 20.0742 7.24744 19.6585C6.88375 19.2429 6.92587 18.6111 7.34151 18.2474L14.4814 12L7.34151 5.75259C6.92587 5.38891 6.88375 4.75715 7.24744 4.34151Z",
13
+ fill: "currentColor"
14
+ })
15
+ });
16
+ //#endregion
17
+ export { t as ChevronRightIcon };
18
+
19
+ //# sourceMappingURL=chevron-right.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"chevron-right.js","names":[],"sources":["../../../src/components/icons/action/ChevronRightIcon.tsx"],"sourcesContent":["import type { SVGProps } from \"react\";\n\nconst ChevronRightIcon = (props: SVGProps<SVGSVGElement>) => {\n return (\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" {...props}>\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M7.24744 4.34151C7.61112 3.92587 8.24288 3.88375 8.65852 4.24744L16.6585 11.2474C16.8755 11.4373 17 11.7117 17 12C17 12.2884 16.8755 12.5627 16.6585 12.7526L8.65852 19.7526C8.24288 20.1163 7.61112 20.0742 7.24744 19.6585C6.88375 19.2429 6.92587 18.6111 7.34151 18.2474L14.4814 12L7.34151 5.75259C6.92587 5.38891 6.88375 4.75715 7.24744 4.34151Z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n};\n\nexport { ChevronRightIcon };\n"],"mappings":";;AAEA,IAAM,KAAoB,MAEtB,kBAAC,OAAD;CAAK,OAAM;CAAK,QAAO;CAAK,SAAQ;CAAY,MAAK;CAAO,GAAI;WAC9D,kBAAC,QAAD;EACE,UAAS;EACT,UAAS;EACT,GAAE;EACF,MAAK;CACN,CAAA;AACE,CAAA"}
@@ -0,0 +1,19 @@
1
+ import { jsx as e } from "react/jsx-runtime";
2
+ //#region src/components/icons/action/ChevronUpIcon.tsx
3
+ var t = (t) => /* @__PURE__ */ e("svg", {
4
+ width: "24",
5
+ height: "24",
6
+ viewBox: "0 0 24 24",
7
+ fill: "none",
8
+ ...t,
9
+ children: /* @__PURE__ */ e("path", {
10
+ fillRule: "evenodd",
11
+ clipRule: "evenodd",
12
+ d: "M4.34151 16.7526C3.92587 16.3889 3.88375 15.7571 4.24744 15.3415L11.2474 7.34151C11.4373 7.1245 11.7117 7.00002 12 7.00002C12.2884 7.00002 12.5627 7.1245 12.7526 7.34151L19.7526 15.3415C20.1163 15.7571 20.0742 16.3889 19.6585 16.7526C19.2429 17.1163 18.6111 17.0742 18.2474 16.6585L12 9.51861L5.75259 16.6585C5.38891 17.0742 4.75715 17.1163 4.34151 16.7526Z",
13
+ fill: "currentColor"
14
+ })
15
+ });
16
+ //#endregion
17
+ export { t as ChevronUpIcon };
18
+
19
+ //# sourceMappingURL=chevron-up.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"chevron-up.js","names":[],"sources":["../../../src/components/icons/action/ChevronUpIcon.tsx"],"sourcesContent":["import type { SVGProps } from \"react\";\n\nconst ChevronUpIcon = (props: SVGProps<SVGSVGElement>) => {\n return (\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" {...props}>\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M4.34151 16.7526C3.92587 16.3889 3.88375 15.7571 4.24744 15.3415L11.2474 7.34151C11.4373 7.1245 11.7117 7.00002 12 7.00002C12.2884 7.00002 12.5627 7.1245 12.7526 7.34151L19.7526 15.3415C20.1163 15.7571 20.0742 16.3889 19.6585 16.7526C19.2429 17.1163 18.6111 17.0742 18.2474 16.6585L12 9.51861L5.75259 16.6585C5.38891 17.0742 4.75715 17.1163 4.34151 16.7526Z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n};\n\nexport { ChevronUpIcon };\n"],"mappings":";;AAEA,IAAM,KAAiB,MAEnB,kBAAC,OAAD;CAAK,OAAM;CAAK,QAAO;CAAK,SAAQ;CAAY,MAAK;CAAO,GAAI;WAC9D,kBAAC,QAAD;EACE,UAAS;EACT,UAAS;EACT,GAAE;EACF,MAAK;CACN,CAAA;AACE,CAAA"}
@@ -0,0 +1,19 @@
1
+ import { jsx as e } from "react/jsx-runtime";
2
+ //#region src/components/icons/action/FilterIcon.tsx
3
+ var t = (t) => /* @__PURE__ */ e("svg", {
4
+ width: "24",
5
+ height: "24",
6
+ viewBox: "0 0 24 24",
7
+ fill: "none",
8
+ ...t,
9
+ children: /* @__PURE__ */ e("path", {
10
+ fillRule: "evenodd",
11
+ clipRule: "evenodd",
12
+ d: "M5.88204 5.7652C6.35704 3.8826 8.07789 2.5 10.1093 2.5C12.5035 2.5 14.4664 4.42074 14.4664 6.81702C14.4664 9.2133 12.5035 11.134 10.1093 11.134C8.07658 11.134 6.35482 9.74965 5.88112 7.8652H2.55C1.9701 7.8652 1.5 7.3951 1.5 6.8152C1.5 6.2353 1.9701 5.7652 2.55 5.7652H5.88204ZM10.1093 4.6C8.85052 4.6 7.85208 5.60465 7.85208 6.81702C7.85208 8.02939 8.85052 9.03404 10.1093 9.03404C11.368 9.03404 12.3664 8.02939 12.3664 6.81702C12.3664 5.60465 11.368 4.6 10.1093 4.6ZM15.15 6.8152C15.15 6.2353 15.6201 5.7652 16.2 5.7652H21.4491C22.029 5.7652 22.4991 6.2353 22.4991 6.8152C22.4991 7.3951 22.029 7.8652 21.4491 7.8652H16.2C15.6201 7.8652 15.15 7.3951 15.15 6.8152ZM9.53356 17.083C9.53356 14.6867 11.4965 12.766 13.8907 12.766C15.9231 12.766 17.6446 14.1499 18.1186 16.0339H21.45C22.0299 16.0339 22.5 16.504 22.5 17.0839C22.5 17.6638 22.0299 18.1339 21.45 18.1339H18.1182C17.6435 20.0169 15.9224 21.4 13.8907 21.4C11.4965 21.4 9.53356 19.4793 9.53356 17.083ZM13.8907 14.866C12.632 14.866 11.6336 15.8706 11.6336 17.083C11.6336 18.2954 12.632 19.3 13.8907 19.3C15.1495 19.3 16.1479 18.2954 16.1479 17.083C16.1479 15.8706 15.1495 14.866 13.8907 14.866ZM1.5 17.0839C1.5 16.504 1.9701 16.0339 2.55 16.0339H7.8C8.3799 16.0339 8.85 16.504 8.85 17.0839C8.85 17.6638 8.3799 18.1339 7.8 18.1339H2.55C1.9701 18.1339 1.5 17.6638 1.5 17.0839Z",
13
+ fill: "currentColor"
14
+ })
15
+ });
16
+ //#endregion
17
+ export { t as FilterIcon };
18
+
19
+ //# sourceMappingURL=filter.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"filter.js","names":[],"sources":["../../../src/components/icons/action/FilterIcon.tsx"],"sourcesContent":["import type { SVGProps } from \"react\";\n\nconst FilterIcon = (props: SVGProps<SVGSVGElement>) => {\n return (\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" {...props}>\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M5.88204 5.7652C6.35704 3.8826 8.07789 2.5 10.1093 2.5C12.5035 2.5 14.4664 4.42074 14.4664 6.81702C14.4664 9.2133 12.5035 11.134 10.1093 11.134C8.07658 11.134 6.35482 9.74965 5.88112 7.8652H2.55C1.9701 7.8652 1.5 7.3951 1.5 6.8152C1.5 6.2353 1.9701 5.7652 2.55 5.7652H5.88204ZM10.1093 4.6C8.85052 4.6 7.85208 5.60465 7.85208 6.81702C7.85208 8.02939 8.85052 9.03404 10.1093 9.03404C11.368 9.03404 12.3664 8.02939 12.3664 6.81702C12.3664 5.60465 11.368 4.6 10.1093 4.6ZM15.15 6.8152C15.15 6.2353 15.6201 5.7652 16.2 5.7652H21.4491C22.029 5.7652 22.4991 6.2353 22.4991 6.8152C22.4991 7.3951 22.029 7.8652 21.4491 7.8652H16.2C15.6201 7.8652 15.15 7.3951 15.15 6.8152ZM9.53356 17.083C9.53356 14.6867 11.4965 12.766 13.8907 12.766C15.9231 12.766 17.6446 14.1499 18.1186 16.0339H21.45C22.0299 16.0339 22.5 16.504 22.5 17.0839C22.5 17.6638 22.0299 18.1339 21.45 18.1339H18.1182C17.6435 20.0169 15.9224 21.4 13.8907 21.4C11.4965 21.4 9.53356 19.4793 9.53356 17.083ZM13.8907 14.866C12.632 14.866 11.6336 15.8706 11.6336 17.083C11.6336 18.2954 12.632 19.3 13.8907 19.3C15.1495 19.3 16.1479 18.2954 16.1479 17.083C16.1479 15.8706 15.1495 14.866 13.8907 14.866ZM1.5 17.0839C1.5 16.504 1.9701 16.0339 2.55 16.0339H7.8C8.3799 16.0339 8.85 16.504 8.85 17.0839C8.85 17.6638 8.3799 18.1339 7.8 18.1339H2.55C1.9701 18.1339 1.5 17.6638 1.5 17.0839Z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n};\n\nexport { FilterIcon };\n"],"mappings":";;AAEA,IAAM,KAAc,MAEhB,kBAAC,OAAD;CAAK,OAAM;CAAK,QAAO;CAAK,SAAQ;CAAY,MAAK;CAAO,GAAI;WAC9D,kBAAC,QAAD;EACE,UAAS;EACT,UAAS;EACT,GAAE;EACF,MAAK;CACN,CAAA;AACE,CAAA"}
@@ -0,0 +1,19 @@
1
+ import { jsx as e } from "react/jsx-runtime";
2
+ //#region src/components/icons/action/RetryIcon.tsx
3
+ var t = (t) => /* @__PURE__ */ e("svg", {
4
+ width: "24",
5
+ height: "24",
6
+ viewBox: "0 0 24 24",
7
+ fill: "none",
8
+ ...t,
9
+ children: /* @__PURE__ */ e("path", {
10
+ fillRule: "evenodd",
11
+ clipRule: "evenodd",
12
+ d: "M12.584 1.246a1 1 0 0 1 1.41.097l2.89 3.32a1 1 0 0 1-.164 1.465l-3.37 2.46a1 1 0 0 1-1.18-1.616l1.574-1.149A9 9 0 0 0 12 5.65a7.67 7.67 0 0 0-7.67 7.67A7.67 7.67 0 0 0 12 21a7.67 7.67 0 0 0 7.67-7.67 7.67 7.67 0 0 0-1.292-4.265 1 1 0 1 1 1.664-1.11 9.67 9.67 0 0 1 1.628 5.375A9.67 9.67 0 0 1 12 23c-5.343 0-9.67-4.328-9.67-9.68A9.67 9.67 0 0 1 12 3.65q.747.002 1.433.095l-.947-1.088a1 1 0 0 1 .098-1.411",
13
+ fill: "currentColor"
14
+ })
15
+ });
16
+ //#endregion
17
+ export { t as RetryIcon };
18
+
19
+ //# sourceMappingURL=retry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"retry.js","names":[],"sources":["../../../src/components/icons/action/RetryIcon.tsx"],"sourcesContent":["import type { SVGProps } from \"react\";\n\nconst RetryIcon = (props: SVGProps<SVGSVGElement>) => {\n return (\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" {...props}>\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M12.584 1.246a1 1 0 0 1 1.41.097l2.89 3.32a1 1 0 0 1-.164 1.465l-3.37 2.46a1 1 0 0 1-1.18-1.616l1.574-1.149A9 9 0 0 0 12 5.65a7.67 7.67 0 0 0-7.67 7.67A7.67 7.67 0 0 0 12 21a7.67 7.67 0 0 0 7.67-7.67 7.67 7.67 0 0 0-1.292-4.265 1 1 0 1 1 1.664-1.11 9.67 9.67 0 0 1 1.628 5.375A9.67 9.67 0 0 1 12 23c-5.343 0-9.67-4.328-9.67-9.68A9.67 9.67 0 0 1 12 3.65q.747.002 1.433.095l-.947-1.088a1 1 0 0 1 .098-1.411\"\n fill=\"currentColor\"\n />\n </svg>\n );\n};\n\nexport { RetryIcon };\n"],"mappings":";;AAEA,IAAM,KAAa,MAEf,kBAAC,OAAD;CAAK,OAAM;CAAK,QAAO;CAAK,SAAQ;CAAY,MAAK;CAAO,GAAI;WAC9D,kBAAC,QAAD;EACE,UAAS;EACT,UAAS;EACT,GAAE;EACF,MAAK;CACN,CAAA;AACE,CAAA"}
@@ -0,0 +1,19 @@
1
+ import { jsx as e } from "react/jsx-runtime";
2
+ //#region src/components/icons/action/SortingIcon.tsx
3
+ var t = (t) => /* @__PURE__ */ e("svg", {
4
+ width: "24",
5
+ height: "24",
6
+ viewBox: "0 0 24 24",
7
+ fill: "none",
8
+ ...t,
9
+ children: /* @__PURE__ */ e("path", {
10
+ fillRule: "evenodd",
11
+ clipRule: "evenodd",
12
+ d: "M17.3462 3C17.8984 3 18.3462 3.44772 18.3462 4L18.3462 17.4991L20.7757 14.9469C21.1565 14.5469 21.7895 14.5313 22.1895 14.9121C22.5895 15.2928 22.6051 15.9258 22.2243 16.3258L18.0705 20.6895C17.8817 20.8878 17.6199 21 17.3462 21C17.0724 21 16.8106 20.8878 16.6219 20.6895L12.468 16.3258C12.0872 15.9258 12.1028 15.2928 12.5028 14.9121C12.9029 14.5313 13.5358 14.5469 13.9166 14.9469L16.3462 17.4991L16.3462 4C16.3462 3.44772 16.7939 3 17.3462 3ZM6.65385 3C6.92761 3 7.1894 3.11223 7.37815 3.31052L11.532 7.67416C11.9128 8.07418 11.8972 8.70715 11.4972 9.08794C11.0972 9.46873 10.4642 9.45314 10.0834 9.05312L7.65385 6.50087L7.65385 20C7.65385 20.5523 7.20613 21 6.65385 21C6.10156 21 5.65385 20.5523 5.65385 20L5.65385 6.50087L3.22431 9.05312C2.84352 9.45314 2.21054 9.46873 1.81052 9.08794C1.4105 8.70715 1.39491 8.07418 1.7757 7.67416L5.92954 3.31052C6.1183 3.11223 6.38009 3 6.65385 3Z",
13
+ fill: "currentColor"
14
+ })
15
+ });
16
+ //#endregion
17
+ export { t as SortingIcon };
18
+
19
+ //# sourceMappingURL=sorting.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"sorting.js","names":[],"sources":["../../../src/components/icons/action/SortingIcon.tsx"],"sourcesContent":["import type { SVGProps } from \"react\";\n\nconst SortingIcon = (props: SVGProps<SVGSVGElement>) => {\n return (\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" {...props}>\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M17.3462 3C17.8984 3 18.3462 3.44772 18.3462 4L18.3462 17.4991L20.7757 14.9469C21.1565 14.5469 21.7895 14.5313 22.1895 14.9121C22.5895 15.2928 22.6051 15.9258 22.2243 16.3258L18.0705 20.6895C17.8817 20.8878 17.6199 21 17.3462 21C17.0724 21 16.8106 20.8878 16.6219 20.6895L12.468 16.3258C12.0872 15.9258 12.1028 15.2928 12.5028 14.9121C12.9029 14.5313 13.5358 14.5469 13.9166 14.9469L16.3462 17.4991L16.3462 4C16.3462 3.44772 16.7939 3 17.3462 3ZM6.65385 3C6.92761 3 7.1894 3.11223 7.37815 3.31052L11.532 7.67416C11.9128 8.07418 11.8972 8.70715 11.4972 9.08794C11.0972 9.46873 10.4642 9.45314 10.0834 9.05312L7.65385 6.50087L7.65385 20C7.65385 20.5523 7.20613 21 6.65385 21C6.10156 21 5.65385 20.5523 5.65385 20L5.65385 6.50087L3.22431 9.05312C2.84352 9.45314 2.21054 9.46873 1.81052 9.08794C1.4105 8.70715 1.39491 8.07418 1.7757 7.67416L5.92954 3.31052C6.1183 3.11223 6.38009 3 6.65385 3Z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n};\n\nexport { SortingIcon };\n"],"mappings":";;AAEA,IAAM,KAAe,MAEjB,kBAAC,OAAD;CAAK,OAAM;CAAK,QAAO;CAAK,SAAQ;CAAY,MAAK;CAAO,GAAI;WAC9D,kBAAC,QAAD;EACE,UAAS;EACT,UAAS;EACT,GAAE;EACF,MAAK;CACN,CAAA;AACE,CAAA"}