1mpacto-react-ui 2.0.19 → 2.0.21
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/assets/style.css +1 -1
- package/dist/components/Alert/index.cjs +1 -1
- package/dist/components/Alert/index.mjs +40 -40
- package/dist/components/Breadcrumbs/Breadcrumbs.cjs +3 -3
- package/dist/components/Breadcrumbs/Breadcrumbs.mjs +43 -43
- package/dist/components/ButtonPopover/ButtonPopover.cjs +1 -1
- package/dist/components/ButtonPopover/ButtonPopover.mjs +28 -31
- package/dist/components/Calendar/Calendar.cjs +1 -1
- package/dist/components/Calendar/Calendar.mjs +98 -100
- package/dist/components/Calendar/CalendarMonth.cjs +1 -1
- package/dist/components/Calendar/CalendarMonth.mjs +41 -42
- package/dist/components/Calendar/CalendarRange.cjs +1 -1
- package/dist/components/Calendar/CalendarRange.mjs +59 -61
- package/dist/components/Calendar/CalendarYear.cjs +2 -2
- package/dist/components/Calendar/CalendarYear.mjs +37 -38
- package/dist/components/Chart/DoughnutChart.cjs +1 -1
- package/dist/components/Chart/DoughnutChart.mjs +93 -96
- package/dist/components/Chart/GradientBarChart.cjs +1 -1
- package/dist/components/Chart/GradientBarChart.mjs +80 -81
- package/dist/components/Chart/GradientLineChart.cjs +1 -1
- package/dist/components/Chart/GradientLineChart.mjs +50 -51
- package/dist/components/Chart/LineChart.cjs +1 -1
- package/dist/components/Chart/LineChart.mjs +23 -23
- package/dist/components/Chart/PieChart.cjs +1 -1
- package/dist/components/Chart/PieChart.mjs +45 -48
- package/dist/components/Collapse/Collapse.cjs +1 -1
- package/dist/components/Collapse/Collapse.mjs +23 -24
- package/dist/components/DatePicker/DatePicker.cjs +1 -1
- package/dist/components/DatePicker/DatePicker.mjs +86 -89
- package/dist/components/DatePicker/DateRangePicker.cjs +1 -1
- package/dist/components/DatePicker/DateRangePicker.mjs +91 -92
- package/dist/components/DatePicker/FilterDate.cjs +1 -1
- package/dist/components/DatePicker/FilterDate.mjs +107 -110
- package/dist/components/DatePicker/MonthYearPicker.cjs +1 -1
- package/dist/components/DatePicker/MonthYearPicker.mjs +51 -53
- package/dist/components/FilterContainer/FilterContainer.cjs +1 -1
- package/dist/components/FilterContainer/FilterContainer.mjs +27 -27
- package/dist/components/Input/InputFloatingInner.cjs +5 -5
- package/dist/components/Input/InputFloatingInner.mjs +24 -25
- package/dist/components/NumberFormat/NumberFormat.cjs +1 -1
- package/dist/components/NumberFormat/NumberFormat.mjs +12 -13
- package/dist/components/Pagination/Pagination.cjs +2 -2
- package/dist/components/Pagination/Pagination.mjs +76 -80
- package/dist/components/SelectDropdownContainer/SelectDropdownContainer.cjs +1 -1
- package/dist/components/SelectDropdownContainer/SelectDropdownContainer.mjs +98 -102
- package/dist/components/Sidebar/ItemSidebar.cjs +8 -8
- package/dist/components/Sidebar/ItemSidebar.mjs +71 -72
- package/dist/components/Sidebar/Sidebar.cjs +1 -1
- package/dist/components/Sidebar/Sidebar.mjs +65 -68
- package/dist/components/Step/Step.cjs +5 -5
- package/dist/components/Step/Step.mjs +52 -52
- package/dist/components/Table/Table.cjs +3 -3
- package/dist/components/Table/Table.mjs +275 -298
- package/dist/components/Table/TableSubMobile.cjs +1 -1
- package/dist/components/Table/TableSubMobile.mjs +32 -35
- package/dist/components/Tabs/Tabs.cjs +8 -8
- package/dist/components/Tabs/Tabs.mjs +66 -70
- package/dist/components/Textarea/Textarea.cjs +7 -7
- package/dist/components/Textarea/Textarea.mjs +47 -50
- package/dist/components/Textarea/TextareaFloatingInner.cjs +6 -6
- package/dist/components/Textarea/TextareaFloatingInner.mjs +56 -61
- package/dist/components/Textarea/TextareaInnerLabel.cjs +6 -6
- package/dist/components/Textarea/TextareaInnerLabel.mjs +47 -50
- package/dist/components/TimeRange/TimeRange.cjs +1 -1
- package/dist/components/TimeRange/TimeRange.mjs +88 -91
- package/dist/components/Tooltip/Tooltip.cjs +1 -1
- package/dist/components/Tooltip/Tooltip.mjs +44 -46
- package/dist/components/Upload/UploadFile.cjs +1 -1
- package/dist/components/Upload/UploadFile.mjs +50 -54
- package/dist/components/Upload/UploadImage.cjs +3 -3
- package/dist/components/Upload/UploadImage.mjs +62 -68
- package/dist/components/Upload/UploadMultipleFile.cjs +1 -1
- package/dist/components/Upload/UploadMultipleFile.mjs +61 -62
- package/dist/components/Virtualization/ListVirtualization.cjs +1 -1
- package/dist/components/Virtualization/ListVirtualization.mjs +52 -55
- package/dist/components/Virtualization/TableVirtualization.cjs +1 -1
- package/dist/components/Virtualization/TableVirtualization.mjs +56 -59
- package/dist/config/components/tinymce.cjs +2 -2
- package/dist/config/components/tinymce.mjs +3 -3
- package/dist/hooks/useCountdown.cjs +1 -1
- package/dist/hooks/useCountdown.mjs +15 -15
- package/dist/hooks/useDebounce.cjs +1 -0
- package/dist/hooks/useDebounce.mjs +27 -0
- package/dist/hooks/useOtpInput.cjs +1 -1
- package/dist/hooks/useOtpInput.mjs +47 -51
- package/dist/hooks/usePacked.cjs +1 -0
- package/dist/hooks/usePacked.mjs +56 -0
- package/dist/index.cjs +1 -1
- package/dist/index.mjs +52 -48
- package/dist/package.json.cjs +1 -1
- package/dist/package.json.d.ts +5 -4
- package/dist/package.json.mjs +1 -1
- package/dist/src/hooks/index.d.ts +4 -2
- package/dist/src/hooks/useDebounce.d.ts +61 -0
- package/dist/src/hooks/usePacked.d.ts +84 -0
- package/dist/utils/common.cjs +1 -1
- package/dist/utils/common.mjs +172 -173
- package/package.json +4 -4
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),i=require("@tanstack/react-table"),
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),i=require("@tanstack/react-table"),m=(o,t,{visibilityColumns:l,classNameSubMobile:s})=>e.jsx("table",{className:"-iru-mx-6 -iru-my-3 !iru-w-[calc(100%_+_48px)]",children:e.jsx("tbody",{children:t.getVisibleCells().map((n,u)=>e.jsx(e.Fragment,{children:l?.columns.includes(n.column.id)?e.jsxs("tr",{className:s,children:[e.jsx("td",{"data-section":"left",style:{...typeof n.column.columnDef.meta?.styleTdLeftCellSubs=="function"?n.column.columnDef.meta?.styleTdLeftCellSubs(t.original,t):{}},children:e.jsxs("div",{children:[typeof n.column.columnDef.header=="string"&&e.jsx(e.Fragment,{children:n.column.columnDef.header}),typeof n.column.columnDef.header!="string"&&n.column.columnDef.meta?.labelCellSubs&&e.jsx(e.Fragment,{children:n.column.columnDef.meta?.labelCellSubs(t.original,t)})]})}),e.jsx("td",{"data-section":"right",style:{...typeof n.column.columnDef.meta?.styleTdRightCellSubs=="function"?n.column.columnDef.meta?.styleTdRightCellSubs(t.original,t):{}},children:e.jsxs("div",{children:[e.jsx("div",{className:"iru-pr-1",children:":"})," ",i.flexRender(n.column.columnDef.cell,n.getContext())]})})]},n.id):e.jsx(e.Fragment,{})},u))})});exports.default=m;
|
|
@@ -1,37 +1,34 @@
|
|
|
1
|
-
import { jsx as n, Fragment as
|
|
2
|
-
import { flexRender as
|
|
3
|
-
const
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
"
|
|
8
|
-
{
|
|
9
|
-
"
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
},
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
"
|
|
21
|
-
{
|
|
22
|
-
"
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
},
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
)
|
|
33
|
-
] }, e.id) : /* @__PURE__ */ n(l, {}) }, s);
|
|
34
|
-
}) }) });
|
|
1
|
+
import { jsx as n, Fragment as t, jsxs as i } from "react/jsx-runtime";
|
|
2
|
+
import { flexRender as c } from "@tanstack/react-table";
|
|
3
|
+
const r = (a, l, { visibilityColumns: m, classNameSubMobile: u }) => /* @__PURE__ */ n("table", { className: "-iru-mx-6 -iru-my-3 !iru-w-[calc(100%_+_48px)]", children: /* @__PURE__ */ n("tbody", { children: l.getVisibleCells().map((e, o) => /* @__PURE__ */ n(t, { children: m?.columns.includes(e.column.id) ? /* @__PURE__ */ i("tr", { className: u, children: [
|
|
4
|
+
/* @__PURE__ */ n(
|
|
5
|
+
"td",
|
|
6
|
+
{
|
|
7
|
+
"data-section": "left",
|
|
8
|
+
style: {
|
|
9
|
+
...typeof e.column.columnDef.meta?.styleTdLeftCellSubs == "function" ? e.column.columnDef.meta?.styleTdLeftCellSubs(l.original, l) : {}
|
|
10
|
+
},
|
|
11
|
+
children: /* @__PURE__ */ i("div", { children: [
|
|
12
|
+
typeof e.column.columnDef.header == "string" && /* @__PURE__ */ n(t, { children: e.column.columnDef.header }),
|
|
13
|
+
typeof e.column.columnDef.header != "string" && e.column.columnDef.meta?.labelCellSubs && /* @__PURE__ */ n(t, { children: e.column.columnDef.meta?.labelCellSubs(l.original, l) })
|
|
14
|
+
] })
|
|
15
|
+
}
|
|
16
|
+
),
|
|
17
|
+
/* @__PURE__ */ n(
|
|
18
|
+
"td",
|
|
19
|
+
{
|
|
20
|
+
"data-section": "right",
|
|
21
|
+
style: {
|
|
22
|
+
...typeof e.column.columnDef.meta?.styleTdRightCellSubs == "function" ? e.column.columnDef.meta?.styleTdRightCellSubs(l.original, l) : {}
|
|
23
|
+
},
|
|
24
|
+
children: /* @__PURE__ */ i("div", { children: [
|
|
25
|
+
/* @__PURE__ */ n("div", { className: "iru-pr-1", children: ":" }),
|
|
26
|
+
" ",
|
|
27
|
+
c(e.column.columnDef.cell, e.getContext())
|
|
28
|
+
] })
|
|
29
|
+
}
|
|
30
|
+
)
|
|
31
|
+
] }, e.id) : /* @__PURE__ */ n(t, {}) }, o)) }) });
|
|
35
32
|
export {
|
|
36
|
-
|
|
33
|
+
r as default
|
|
37
34
|
};
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const
|
|
2
|
-
${
|
|
3
|
-
${
|
|
4
|
-
`,id:
|
|
5
|
-
${
|
|
6
|
-
${
|
|
7
|
-
${
|
|
8
|
-
`,style:{left:
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("react/jsx-runtime"),o=require("react"),s=require("./style.module.scss.cjs"),n=require("./Tabs.config.cjs"),z=({id:L,value:f="",keyValueTab:a="",tabsList:g,className:N,classNameContainer:S,classNameButton:$,variant:u="original-laba-blue-10",size:E="tabs-m",borderRadius:y="0px",disabled:T,animation:v=!0,mountedExecuteChange:x=!0,typeButton:q="button",onChange:w,locale:h})=>{const R=o.useRef([]);let r=g||[];const d=Object.fromEntries(new URL(window.location.href).searchParams.entries()),[c,H]=o.useState(-1),[m,I]=o.useState({height:0,width:0,left:0});r=r.filter(t=>typeof t?.isHide=="boolean"?!t.isHide:!0);const O=t=>{const e=t.currentTarget,i=document.createElement("span"),b=Math.max(e.clientWidth,e.clientHeight),C=b/2;i.style.width=i.style.height=`${b}px`,i.style.left=`${t.clientX-e.getBoundingClientRect().left-C}px`,i.style.top=`${t.clientY-e.getBoundingClientRect().top-C}px`,i.classList.add(s.default.ripple);const j=e.getElementsByClassName(s.default.ripple)[0];j&&j.remove(),e.appendChild(i),setTimeout(()=>{i.remove()},500)},p=(t,e)=>{typeof w=="function"&&w(t,e)},_=o.useCallback((t,e)=>h&&g.find(b=>b.id===t)?.locale?.[h]||e,[h]);return o.useLayoutEffect(()=>{function t(){setTimeout(()=>{const e=R.current[c],i={left:e?.offsetLeft??0,width:e?.clientWidth??0,height:n.configTabs.isContainer.includes(u)?e?.clientHeight||0:4};I(i)},50)}return c>=0&&t(),window.addEventListener("resize",t),()=>window.removeEventListener("resize",t)},[c]),o.useLayoutEffect(()=>{const t=r.findIndex(e=>e.id===d?.[a]||e.id===f);if((d?.[a]||f)&&t>=0){H(t);const e=r?.find(i=>i.id===d?.[a]);d?.[a]&&e&&!f&&x&&p(e,"mounted")}t<0&&x&&p(r[0],"mounted")},[JSON.stringify(f),JSON.stringify(d?.[a])]),l.jsx("div",{className:`${s.default["container-tabs"]} ${T?"iru-opacity-50":""} ${S??""}`,children:l.jsxs("div",{className:`${n.configTabs.tabsVariant[u]}
|
|
2
|
+
${n.configTabs.isContainer.includes(u)?n.configTabs.size[E]:""}
|
|
3
|
+
${N??""}
|
|
4
|
+
`,id:L??"1ru-tabs",children:[l.jsx("div",{className:s.default["tabs-list"],children:r.map((t,e)=>l.jsx("button",{type:q,id:`1ru-tabs-button-${t.id}`,ref:i=>{R.current[e]=i},className:`${s.default["button-tabs"]} ${n.configTabs.borderRadius[y]}
|
|
5
|
+
${$??""} ${t?.className??""}
|
|
6
|
+
${c===e?s.default.active:""}`,disabled:T,onClick:i=>{n.configTabs.isContainer.includes(u)||O(i),c!=e&&p(t,"change")},children:_(t.id,t.label)},e))}),l.jsx("div",{className:`${s.default["tabs-slider"]} ${n.configTabs.borderRadius[y]}
|
|
7
|
+
${$??""} ${v?"":s.default["disable-transition"]}
|
|
8
|
+
`,style:{left:m.left,width:m.width,height:m.height,background:g[c]?.activeColor??""}})]})})};exports.default=z;
|
|
@@ -1,105 +1,101 @@
|
|
|
1
|
-
import { jsx as
|
|
1
|
+
import { jsx as m, jsxs as J } from "react/jsx-runtime";
|
|
2
2
|
import c from "react";
|
|
3
|
-
import
|
|
4
|
-
import { configTabs as
|
|
5
|
-
const
|
|
6
|
-
id:
|
|
7
|
-
value:
|
|
8
|
-
keyValueTab:
|
|
9
|
-
tabsList:
|
|
10
|
-
className:
|
|
11
|
-
classNameContainer:
|
|
12
|
-
classNameButton:
|
|
13
|
-
variant:
|
|
14
|
-
size:
|
|
15
|
-
borderRadius:
|
|
16
|
-
disabled:
|
|
17
|
-
animation:
|
|
18
|
-
mountedExecuteChange:
|
|
19
|
-
typeButton:
|
|
20
|
-
onChange:
|
|
21
|
-
locale:
|
|
3
|
+
import s from "./style.module.scss.mjs";
|
|
4
|
+
import { configTabs as n } from "./Tabs.config.mjs";
|
|
5
|
+
const Q = ({
|
|
6
|
+
id: T,
|
|
7
|
+
value: l = "",
|
|
8
|
+
keyValueTab: d = "",
|
|
9
|
+
tabsList: h,
|
|
10
|
+
className: E,
|
|
11
|
+
classNameContainer: S,
|
|
12
|
+
classNameButton: $,
|
|
13
|
+
variant: f = "original-laba-blue-10",
|
|
14
|
+
size: H = "tabs-m",
|
|
15
|
+
borderRadius: y = "0px",
|
|
16
|
+
disabled: w,
|
|
17
|
+
animation: I = !0,
|
|
18
|
+
mountedExecuteChange: x = !0,
|
|
19
|
+
typeButton: j = "button",
|
|
20
|
+
onChange: C,
|
|
21
|
+
locale: p
|
|
22
22
|
}) => {
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
h && h.remove(), t.appendChild(i), setTimeout(() => {
|
|
23
|
+
const R = c.useRef([]);
|
|
24
|
+
let r = h || [];
|
|
25
|
+
const a = Object.fromEntries(new URL(window.location.href).searchParams.entries()), [o, v] = c.useState(-1), [b, z] = c.useState({ height: 0, width: 0, left: 0 });
|
|
26
|
+
r = r.filter((e) => typeof e?.isHide == "boolean" ? !e.isHide : !0);
|
|
27
|
+
const O = (e) => {
|
|
28
|
+
const t = e.currentTarget, i = document.createElement("span"), u = Math.max(t.clientWidth, t.clientHeight), L = u / 2;
|
|
29
|
+
i.style.width = i.style.height = `${u}px`, i.style.left = `${e.clientX - t.getBoundingClientRect().left - L}px`, i.style.top = `${e.clientY - t.getBoundingClientRect().top - L}px`, i.classList.add(s.ripple);
|
|
30
|
+
const N = t.getElementsByClassName(s.ripple)[0];
|
|
31
|
+
N && N.remove(), t.appendChild(i), setTimeout(() => {
|
|
33
32
|
i.remove();
|
|
34
33
|
}, 500);
|
|
35
|
-
},
|
|
36
|
-
typeof
|
|
37
|
-
},
|
|
38
|
-
(e, t) =>
|
|
39
|
-
|
|
40
|
-
return $ && ((a = (i = g.find((h) => h.id === e)) == null ? void 0 : i.locale) == null ? void 0 : a[$]) || t;
|
|
41
|
-
},
|
|
42
|
-
[$]
|
|
34
|
+
}, g = (e, t) => {
|
|
35
|
+
typeof C == "function" && C(e, t);
|
|
36
|
+
}, B = c.useCallback(
|
|
37
|
+
(e, t) => p && h.find((u) => u.id === e)?.locale?.[p] || t,
|
|
38
|
+
[p]
|
|
43
39
|
);
|
|
44
40
|
return c.useLayoutEffect(() => {
|
|
45
41
|
function e() {
|
|
46
42
|
setTimeout(() => {
|
|
47
|
-
const t =
|
|
48
|
-
left:
|
|
49
|
-
width:
|
|
50
|
-
height:
|
|
43
|
+
const t = R.current[o], i = {
|
|
44
|
+
left: t?.offsetLeft ?? 0,
|
|
45
|
+
width: t?.clientWidth ?? 0,
|
|
46
|
+
height: n.isContainer.includes(f) ? t?.clientHeight || 0 : 4
|
|
51
47
|
};
|
|
52
|
-
|
|
48
|
+
z(i);
|
|
53
49
|
}, 50);
|
|
54
50
|
}
|
|
55
|
-
return
|
|
56
|
-
}, [
|
|
57
|
-
const e =
|
|
58
|
-
if ((
|
|
59
|
-
|
|
60
|
-
const t =
|
|
61
|
-
|
|
51
|
+
return o >= 0 && e(), window.addEventListener("resize", e), () => window.removeEventListener("resize", e);
|
|
52
|
+
}, [o]), c.useLayoutEffect(() => {
|
|
53
|
+
const e = r.findIndex((t) => t.id === a?.[d] || t.id === l);
|
|
54
|
+
if ((a?.[d] || l) && e >= 0) {
|
|
55
|
+
v(e);
|
|
56
|
+
const t = r?.find((i) => i.id === a?.[d]);
|
|
57
|
+
a?.[d] && t && !l && x && g(t, "mounted");
|
|
62
58
|
}
|
|
63
|
-
e < 0 &&
|
|
64
|
-
}, [JSON.stringify(
|
|
59
|
+
e < 0 && x && g(r[0], "mounted");
|
|
60
|
+
}, [JSON.stringify(l), JSON.stringify(a?.[d])]), /* @__PURE__ */ m("div", { className: `${s["container-tabs"]} ${w ? "iru-opacity-50" : ""} ${S ?? ""}`, children: /* @__PURE__ */ J(
|
|
65
61
|
"div",
|
|
66
62
|
{
|
|
67
|
-
className: `${
|
|
68
|
-
${
|
|
69
|
-
${
|
|
63
|
+
className: `${n.tabsVariant[f]}
|
|
64
|
+
${n.isContainer.includes(f) ? n.size[H] : ""}
|
|
65
|
+
${E ?? ""}
|
|
70
66
|
`,
|
|
71
|
-
id:
|
|
67
|
+
id: T ?? "1ru-tabs",
|
|
72
68
|
children: [
|
|
73
|
-
/* @__PURE__ */
|
|
69
|
+
/* @__PURE__ */ m("div", { className: s["tabs-list"], children: r.map((e, t) => /* @__PURE__ */ m(
|
|
74
70
|
"button",
|
|
75
71
|
{
|
|
76
|
-
type:
|
|
72
|
+
type: j,
|
|
77
73
|
id: `1ru-tabs-button-${e.id}`,
|
|
78
74
|
ref: (i) => {
|
|
79
|
-
|
|
75
|
+
R.current[t] = i;
|
|
80
76
|
},
|
|
81
|
-
className: `${
|
|
82
|
-
${
|
|
83
|
-
${
|
|
84
|
-
disabled:
|
|
77
|
+
className: `${s["button-tabs"]} ${n.borderRadius[y]}
|
|
78
|
+
${$ ?? ""} ${e?.className ?? ""}
|
|
79
|
+
${o === t ? s.active : ""}`,
|
|
80
|
+
disabled: w,
|
|
85
81
|
onClick: (i) => {
|
|
86
|
-
|
|
82
|
+
n.isContainer.includes(f) || O(i), o != t && g(e, "change");
|
|
87
83
|
},
|
|
88
|
-
children:
|
|
84
|
+
children: B(e.id, e.label)
|
|
89
85
|
},
|
|
90
86
|
t
|
|
91
87
|
)) }),
|
|
92
|
-
/* @__PURE__ */
|
|
88
|
+
/* @__PURE__ */ m(
|
|
93
89
|
"div",
|
|
94
90
|
{
|
|
95
|
-
className: `${
|
|
96
|
-
${
|
|
91
|
+
className: `${s["tabs-slider"]} ${n.borderRadius[y]}
|
|
92
|
+
${$ ?? ""} ${I ? "" : s["disable-transition"]}
|
|
97
93
|
`,
|
|
98
94
|
style: {
|
|
99
95
|
left: b.left,
|
|
100
96
|
width: b.width,
|
|
101
97
|
height: b.height,
|
|
102
|
-
background:
|
|
98
|
+
background: h[o]?.activeColor ?? ""
|
|
103
99
|
}
|
|
104
100
|
}
|
|
105
101
|
)
|
|
@@ -108,5 +104,5 @@ const Y = ({
|
|
|
108
104
|
) });
|
|
109
105
|
};
|
|
110
106
|
export {
|
|
111
|
-
|
|
107
|
+
Q as default
|
|
112
108
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const
|
|
2
|
-
${
|
|
3
|
-
${
|
|
4
|
-
${
|
|
5
|
-
${
|
|
6
|
-
${
|
|
7
|
-
${
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),o=require("react"),e=require("./style.module.scss.cjs"),z=require("../../hooks/useMergeRefs.cjs"),F=require("../../hooks/useCombinedResizeObserver.cjs"),c=require("./Textarea.config.cjs"),$=o.forwardRef((r,y)=>{const{isRequired:p,classNameContainer:v,className:N,classNameLabel:R,classNameLabelError:j,name:d,id:f,label:m,error:n,height:T,minHeight:x=94,maxHeight:q=150,style:L,sizeInput:E="m",variant:h="solid-blue-300",...l}=r,a=o.useRef(null),M=z.useMergeRefs(a,y),S={...L??{},maxHeight:q,height:T??x,minHeight:x},[b,g]=o.useState(!1),_=function(s){g(!0),r.onFocus?.(s)},w=function(s){g(!1),r.onBlur?.(s)},i=function(s){const u=s?.target??a.current;u.style.height="0px",u.style.height=u.scrollHeight+c.configTextarea.variant[h].border+"px"};return F.useIsomorphicLayoutEffect(()=>(b&&a.current?a.current.addEventListener("input",i):i(),()=>{a.current?.removeEventListener("input",i)}),[b]),t.jsxs("div",{className:`${e.default.container}
|
|
2
|
+
${c.configTextarea.size[E]}
|
|
3
|
+
${c.configTextarea.variant[h].style}
|
|
4
|
+
${v??""}`,children:[m&&t.jsxs("label",{htmlFor:f??d,className:`${e.default.label} ${l.disabled?e.default.disabled:""} ${R??""}`,children:[m," ",p&&t.jsx("span",{className:"iru-text-laba-red-08",children:"*"})]}),t.jsx("div",{className:`${e.default["container-textarea"]}`,children:t.jsx("textarea",{id:f??d,className:` ${n?e.default.error:""}
|
|
5
|
+
${e.default.textarea}
|
|
6
|
+
${N??""}`,ref:M,style:S,...l,onFocus:_,onBlur:w})}),n&&t.jsx("label",{className:`${e.default["label-error"]}
|
|
7
|
+
${l.disabled?e.default.disabled:""} ${j??""}`,children:n})]})});$.displayName="Textarea";exports.default=$;
|
|
@@ -1,80 +1,77 @@
|
|
|
1
|
-
import { jsxs as
|
|
1
|
+
import { jsxs as $, jsx as a } from "react/jsx-runtime";
|
|
2
2
|
import c from "react";
|
|
3
|
-
import
|
|
4
|
-
import { useMergeRefs as
|
|
5
|
-
import { useIsomorphicLayoutEffect as
|
|
3
|
+
import e from "./style.module.scss.mjs";
|
|
4
|
+
import { useMergeRefs as B } from "../../hooks/useMergeRefs.mjs";
|
|
5
|
+
import { useIsomorphicLayoutEffect as S } from "../../hooks/useCombinedResizeObserver.mjs";
|
|
6
6
|
import { configTextarea as m } from "./Textarea.config.mjs";
|
|
7
|
-
const q = c.forwardRef((
|
|
7
|
+
const q = c.forwardRef((s, g) => {
|
|
8
8
|
const {
|
|
9
|
-
isRequired:
|
|
10
|
-
classNameContainer:
|
|
11
|
-
className:
|
|
12
|
-
classNameLabel:
|
|
13
|
-
classNameLabelError:
|
|
9
|
+
isRequired: y,
|
|
10
|
+
classNameContainer: N,
|
|
11
|
+
className: v,
|
|
12
|
+
classNameLabel: R,
|
|
13
|
+
classNameLabelError: L,
|
|
14
14
|
name: u,
|
|
15
15
|
id: d,
|
|
16
16
|
label: f,
|
|
17
|
-
error:
|
|
18
|
-
height:
|
|
17
|
+
error: n,
|
|
18
|
+
height: E,
|
|
19
19
|
minHeight: h = 94,
|
|
20
|
-
maxHeight:
|
|
21
|
-
style:
|
|
22
|
-
sizeInput:
|
|
23
|
-
variant:
|
|
24
|
-
...
|
|
25
|
-
} =
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
const t = (e == null ? void 0 : e.target) ?? n.current;
|
|
33
|
-
t.style.height = "0px", t.style.height = t.scrollHeight + m.variant[b].border + "px";
|
|
20
|
+
maxHeight: T = 150,
|
|
21
|
+
style: w,
|
|
22
|
+
sizeInput: F = "m",
|
|
23
|
+
variant: p = "solid-blue-300",
|
|
24
|
+
...l
|
|
25
|
+
} = s, t = c.useRef(null), H = B(t, g), I = { ...w ?? {}, maxHeight: T, height: E ?? h, minHeight: h }, [b, x] = c.useState(!1), j = function(r) {
|
|
26
|
+
x(!0), s.onFocus?.(r);
|
|
27
|
+
}, z = function(r) {
|
|
28
|
+
x(!1), s.onBlur?.(r);
|
|
29
|
+
}, i = function(r) {
|
|
30
|
+
const o = r?.target ?? t.current;
|
|
31
|
+
o.style.height = "0px", o.style.height = o.scrollHeight + m.variant[p].border + "px";
|
|
34
32
|
};
|
|
35
|
-
return
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
}), [x]), /* @__PURE__ */ g(
|
|
33
|
+
return S(() => (b && t.current ? t.current.addEventListener("input", i) : i(), () => {
|
|
34
|
+
t.current?.removeEventListener("input", i);
|
|
35
|
+
}), [b]), /* @__PURE__ */ $(
|
|
39
36
|
"div",
|
|
40
37
|
{
|
|
41
|
-
className: `${
|
|
42
|
-
${m.size[
|
|
43
|
-
${m.variant[
|
|
44
|
-
${
|
|
38
|
+
className: `${e.container}
|
|
39
|
+
${m.size[F]}
|
|
40
|
+
${m.variant[p].style}
|
|
41
|
+
${N ?? ""}`,
|
|
45
42
|
children: [
|
|
46
|
-
f && /* @__PURE__ */
|
|
43
|
+
f && /* @__PURE__ */ $(
|
|
47
44
|
"label",
|
|
48
45
|
{
|
|
49
46
|
htmlFor: d ?? u,
|
|
50
|
-
className: `${
|
|
47
|
+
className: `${e.label} ${l.disabled ? e.disabled : ""} ${R ?? ""}`,
|
|
51
48
|
children: [
|
|
52
49
|
f,
|
|
53
50
|
" ",
|
|
54
|
-
|
|
51
|
+
y && /* @__PURE__ */ a("span", { className: "iru-text-laba-red-08", children: "*" })
|
|
55
52
|
]
|
|
56
53
|
}
|
|
57
54
|
),
|
|
58
|
-
/* @__PURE__ */
|
|
55
|
+
/* @__PURE__ */ a("div", { className: `${e["container-textarea"]}`, children: /* @__PURE__ */ a(
|
|
59
56
|
"textarea",
|
|
60
57
|
{
|
|
61
58
|
id: d ?? u,
|
|
62
|
-
className: ` ${
|
|
63
|
-
${
|
|
64
|
-
${
|
|
65
|
-
ref:
|
|
66
|
-
style:
|
|
67
|
-
...
|
|
68
|
-
onFocus:
|
|
69
|
-
onBlur:
|
|
59
|
+
className: ` ${n ? e.error : ""}
|
|
60
|
+
${e.textarea}
|
|
61
|
+
${v ?? ""}`,
|
|
62
|
+
ref: H,
|
|
63
|
+
style: I,
|
|
64
|
+
...l,
|
|
65
|
+
onFocus: j,
|
|
66
|
+
onBlur: z
|
|
70
67
|
}
|
|
71
68
|
) }),
|
|
72
|
-
|
|
69
|
+
n && /* @__PURE__ */ a(
|
|
73
70
|
"label",
|
|
74
71
|
{
|
|
75
|
-
className: `${
|
|
76
|
-
${
|
|
77
|
-
children:
|
|
72
|
+
className: `${e["label-error"]}
|
|
73
|
+
${l.disabled ? e.disabled : ""} ${L ?? ""}`,
|
|
74
|
+
children: n
|
|
78
75
|
}
|
|
79
76
|
)
|
|
80
77
|
]
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const
|
|
2
|
-
${
|
|
3
|
-
${
|
|
4
|
-
${
|
|
5
|
-
${
|
|
6
|
-
${u.disabled?
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),n=require("react"),e=require("./TextareaFloatingInner.module.scss.cjs"),C=require("../../hooks/useMergeRefs.cjs"),O=require("../../hooks/useCombinedResizeObserver.cjs"),P=require("./TextareaFloatingInner.config.cjs"),p=n.forwardRef((l,R)=>{const{isRequired:v,classNameContainer:y,className:N,classNameLabel:T,classNameLabelError:I,name:c,id:f,label:d,error:i,height:j,minHeight:h=94,maxHeight:F=150,style:q,sizeInput:H="medium",translateLabel:L=20,autoTranslateLabel:S=!1,...u}=l,t=n.useRef(null),w=C.useMergeRefs(t,R),g=n.useRef(null),E={...q??{},maxHeight:F,height:j??h,minHeight:h},[m,x]=n.useState(!1),[M,b]=n.useState(!1),[V,Y]=n.useState(L),$=()=>{["",void 0,null].includes(u.value)||["",void 0,null].includes(t.current?.value)?(b(!1),S&&setTimeout(()=>{const a=t.current?.offsetHeight??0,r=g.current?.offsetHeight??0,B=(a-r)/2;Y(B)},100)):b(!0)},_=function(a){x(!0),$(),l.onFocus?.(a)},z=function(a){x(!1),l.onBlur?.(a)},o=function(a){$();const r=a?.target??t.current;r.style.height="0px",r.style.height=r.scrollHeight+"px"};return O.useIsomorphicLayoutEffect(()=>(m&&t.current?t.current.addEventListener("input",o):o(),()=>{t.current?.removeEventListener("input",o)}),[m]),s.jsxs("div",{className:`${e.default.container}
|
|
2
|
+
${P.configTextareaFloatingInner.size[H]}
|
|
3
|
+
${y??""}`,children:[s.jsxs("div",{className:`${e.default["container-textarea"]}`,children:[s.jsx("textarea",{id:f??c,className:`${M?"":e.default["placeholder-shown"]} ${i?e.default.error:""}
|
|
4
|
+
${e.default.textarea}
|
|
5
|
+
${N??""}`,ref:w,style:E,...u,onFocus:_,onBlur:z}),d&&s.jsxs("label",{htmlFor:f??c,ref:g,style:{transform:`translateY(${V}px)`},className:`${e.default.label} ${T??""}`,children:[d," ",v&&s.jsx("span",{className:"iru-text-laba-red-08",children:"*"})]})]}),i&&s.jsx("label",{className:`${e.default["label-error"]}
|
|
6
|
+
${u.disabled?e.default.disabled:""} ${I??""}`,children:i})]})});p.displayName="TextareaFloatingInner";exports.default=p;
|