@apple-pie/slice 0.1.10 → 0.1.11
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/cjs/chunks/{Avatar-Czt-12Ih.js → Avatar-CUaQ3kN1.js} +5 -5
- package/dist/cjs/chunks/{AvatarGroup-CGH2zY7a.js → AvatarGroup-B3M7o4Hh.js} +23 -20
- package/dist/cjs/chunks/{Button-mVVfNCqC.js → Button-ID8wGXIa.js} +12 -11
- package/dist/cjs/chunks/{ButtonBar-CFAb4bfQ.js → ButtonBar-BZ6sme27.js} +7 -7
- package/dist/cjs/chunks/{Camera-BGV_tNUP.js → Camera-rVC4KI4v.js} +1 -1
- package/dist/cjs/chunks/{CheckBox-DyOgP15i.js → CheckBox-DQRLqTAK.js} +1 -1
- package/dist/cjs/chunks/{Chip-Z8erRdWG.js → Chip-CflUNqhY.js} +11 -10
- package/dist/cjs/chunks/{DivInput-DdZA8S1k.js → DivInput-DrwFMexA.js} +4 -4
- package/dist/cjs/chunks/{DropDown-Ce8aU2va.js → DropDown-C3AZ5b_b.js} +49 -50
- package/dist/cjs/chunks/{ErrorSummary-By4CjJ9a.js → ErrorSummary-BTgAd3sK.js} +47 -25
- package/dist/cjs/chunks/{FileList-CCAtVNDo.js → FileList-BHwBIics.js} +4 -4
- package/dist/cjs/chunks/{Grouper-BbovOSYw.js → Grouper-D4yyHHkM.js} +1 -1
- package/dist/cjs/chunks/{Icon-N0YJuKQf.js → Icon-D1EB8S5r.js} +6 -5
- package/dist/cjs/chunks/{IconButton-BXotgG2u.js → IconButton-B07Ttxbr.js} +11 -11
- package/dist/cjs/chunks/Label-CTzvGcds.js +102 -0
- package/dist/cjs/chunks/{Pager-Da9AqSFN.js → Pager-BN37VYEC.js} +1 -1
- package/dist/cjs/chunks/{ProgressIndicator-CyFcr6Dk.js → ProgressIndicator-BGqIwycX.js} +1 -1
- package/dist/cjs/chunks/{PromptInput-D317oh1e.js → PromptInput-D0aehf9X.js} +1 -1
- package/dist/cjs/chunks/{RadioButton-B8GIKGm-.js → RadioButton-DuIsM4lu.js} +21 -17
- package/dist/cjs/chunks/{RadioButtonList-3o1IvhdC.js → RadioButtonList-bu11ILyw.js} +20 -13
- package/dist/cjs/chunks/{Switch-BiTshVLM.js → Switch-Cbn0ql3B.js} +15 -11
- package/dist/cjs/chunks/{TabBar-DZ2y7owf.js → TabBar-Bcq_n4Mk.js} +8 -8
- package/dist/cjs/chunks/{TextArea-2w4E6d2H.js → TextArea-CEwhpWXT.js} +17 -24
- package/dist/cjs/chunks/{TextField-BAcYBHb1.js → TextField-Dl9sTcC4.js} +50 -70
- package/dist/cjs/chunks/{Tip-59T3TUN4.js → Tip-BTIo1xG2.js} +7 -6
- package/dist/cjs/chunks/{Toast-skIBuJ3b.js → Toast-CZzAWG0S.js} +1 -1
- package/dist/cjs/chunks/{UploadArea-CxYAAs7Q.js → UploadArea-z9-1YjIV.js} +6 -6
- package/dist/cjs/chunks/{localDBStore-BHEk_9fJ.js → localDBStore-zyDhaEiP.js} +42 -10
- package/dist/cjs/components/Avatar/index.js +1 -1
- package/dist/cjs/components/AvatarGroup/index.js +2 -2
- package/dist/cjs/components/Button/index.js +3 -3
- package/dist/cjs/components/ButtonBar/index.js +2 -2
- package/dist/cjs/components/Camera/index.js +3 -3
- package/dist/cjs/components/CheckBox/index.js +2 -2
- package/dist/cjs/components/Chip/index.js +2 -2
- package/dist/cjs/components/DivInput/index.js +1 -1
- package/dist/cjs/components/DropDown/index.js +2 -2
- package/dist/cjs/components/ErrorSummary/index.js +6 -2
- package/dist/cjs/components/FileList/index.js +3 -3
- package/dist/cjs/components/Grouper/index.js +2 -2
- package/dist/cjs/components/Icon/index.js +1 -1
- package/dist/cjs/components/IconButton/index.js +2 -2
- package/dist/cjs/components/Label/index.js +7 -5
- package/dist/cjs/components/Pager/index.js +1 -1
- package/dist/cjs/components/Progress/index.js +2 -2
- package/dist/cjs/components/PromptInput/index.js +5 -5
- package/dist/cjs/components/RadioButton/index.js +2 -2
- package/dist/cjs/components/RadioButtonList/index.js +3 -3
- package/dist/cjs/components/Switch/index.js +1 -1
- package/dist/cjs/components/TabBar/index.js +3 -3
- package/dist/cjs/components/TextArea/index.js +4 -4
- package/dist/cjs/components/Textfield/index.js +5 -6
- package/dist/cjs/components/Tip/index.js +1 -1
- package/dist/cjs/components/Toast/index.js +2 -2
- package/dist/cjs/components/UploadArea/index.js +4 -4
- package/dist/cjs/index.js +8 -3
- package/dist/cjs/stores/LocalDB.js +1 -1
- package/dist/cjs/stores.js +1 -1
- package/dist/esm/chunks/{Avatar-DCCbj2eA.mjs → Avatar-CSLVUF_y.mjs} +5 -5
- package/dist/esm/chunks/{AvatarGroup-BaD2Xmda.mjs → AvatarGroup--ELW-bO1.mjs} +23 -20
- package/dist/esm/chunks/{Button-m0XAJsq5.mjs → Button-D24zg6UY.mjs} +13 -12
- package/dist/esm/chunks/{ButtonBar-CNQHRn77.mjs → ButtonBar-DXK8meQq.mjs} +7 -7
- package/dist/esm/chunks/{Camera-7TuowjX_.mjs → Camera-BqmVsVKy.mjs} +2 -2
- package/dist/esm/chunks/{CheckBox-DO9hTdv8.mjs → CheckBox-BsaYFNC6.mjs} +1 -1
- package/dist/esm/chunks/{Chip-BqneFUOR.mjs → Chip-DdgYV-Ct.mjs} +11 -10
- package/dist/esm/chunks/{DivInput-Ch9XjfWd.mjs → DivInput-B7sawFbK.mjs} +4 -4
- package/dist/esm/chunks/{DropDown-Cvf2d_3u.mjs → DropDown-DOJvg96J.mjs} +48 -51
- package/dist/esm/chunks/{ErrorSummary-S0shes-m.mjs → ErrorSummary-CHLkvdHk.mjs} +52 -27
- package/dist/esm/chunks/{FileList-Ckix8gUY.mjs → FileList-5LElsgoE.mjs} +5 -5
- package/dist/esm/chunks/{Grouper-B_FutfjV.mjs → Grouper-DR14qDXP.mjs} +1 -1
- package/dist/esm/chunks/{Icon-C92f63Ib.mjs → Icon-CUSQtytG.mjs} +6 -5
- package/dist/esm/chunks/{IconButton-4O5S9S9G.mjs → IconButton-DG69Vlhj.mjs} +11 -11
- package/dist/esm/chunks/Label-CRsE7o3D.mjs +115 -0
- package/dist/esm/chunks/{Pager-BlLYeA2F.mjs → Pager-BYT7_mCb.mjs} +1 -1
- package/dist/esm/chunks/{ProgressIndicator-CfM2c4ty.mjs → ProgressIndicator-D7paCpgY.mjs} +1 -1
- package/dist/esm/chunks/{PromptInput-C6liKbFf.mjs → PromptInput-yf2ir2-x.mjs} +2 -2
- package/dist/esm/chunks/{RadioButton-COEnChNW.mjs → RadioButton-B5ZF5oJ_.mjs} +22 -18
- package/dist/esm/chunks/{RadioButtonList-De3rbLQb.mjs → RadioButtonList-D9ZAZgkK.mjs} +22 -13
- package/dist/esm/chunks/{Switch-Cv6LABsW.mjs → Switch-BhCOo5Lu.mjs} +15 -11
- package/dist/esm/chunks/{TabBar-qiozE5zA.mjs → TabBar-BK7OcjPl.mjs} +9 -9
- package/dist/esm/chunks/{TextArea-DKRF4Irr.mjs → TextArea-CWmzQA0V.mjs} +18 -25
- package/dist/esm/chunks/{TextField-CGOR6507.mjs → TextField-6Aq-AT47.mjs} +54 -72
- package/dist/esm/chunks/{Tip-CroDIKO4.mjs → Tip-DfmcLbBf.mjs} +7 -6
- package/dist/esm/chunks/{Toast-CM493gMR.mjs → Toast-DPHLwDES.mjs} +1 -1
- package/dist/esm/chunks/{UploadArea-DNAH-Bu5.mjs → UploadArea-igD1l2Ht.mjs} +8 -8
- package/dist/esm/chunks/{localDBStore-C-Ch2MFq.mjs → localDBStore-B4jkR5Jx.mjs} +42 -10
- package/dist/esm/components/Avatar/index.mjs +1 -1
- package/dist/esm/components/AvatarGroup/index.mjs +2 -2
- package/dist/esm/components/Button/index.mjs +3 -3
- package/dist/esm/components/ButtonBar/index.mjs +2 -2
- package/dist/esm/components/Camera/index.mjs +3 -3
- package/dist/esm/components/CheckBox/index.mjs +2 -2
- package/dist/esm/components/Chip/index.mjs +2 -2
- package/dist/esm/components/DivInput/index.mjs +1 -1
- package/dist/esm/components/DropDown/index.mjs +5 -5
- package/dist/esm/components/ErrorSummary/index.mjs +21 -1
- package/dist/esm/components/FileList/index.mjs +3 -3
- package/dist/esm/components/Grouper/index.mjs +2 -2
- package/dist/esm/components/Icon/index.mjs +1 -1
- package/dist/esm/components/IconButton/index.mjs +2 -2
- package/dist/esm/components/Label/index.mjs +1 -19
- package/dist/esm/components/Pager/index.mjs +1 -1
- package/dist/esm/components/Progress/index.mjs +2 -2
- package/dist/esm/components/PromptInput/index.mjs +5 -5
- package/dist/esm/components/RadioButton/index.mjs +2 -2
- package/dist/esm/components/RadioButtonList/index.mjs +4 -4
- package/dist/esm/components/Switch/index.mjs +1 -1
- package/dist/esm/components/TabBar/index.mjs +3 -3
- package/dist/esm/components/TextArea/index.mjs +4 -4
- package/dist/esm/components/Textfield/index.mjs +7 -7
- package/dist/esm/components/Tip/index.mjs +1 -1
- package/dist/esm/components/Toast/index.mjs +2 -2
- package/dist/esm/components/UploadArea/index.mjs +4 -4
- package/dist/esm/index.mjs +27 -27
- package/dist/esm/stores/LocalDB.mjs +1 -1
- package/dist/esm/stores.mjs +1 -1
- package/dist/types/components/Avatar/_types.d.ts +3 -0
- package/dist/types/components/AvatarGroup/_types.d.ts +3 -0
- package/dist/types/components/Button/Button.d.ts +6 -2
- package/dist/types/components/Button/_types.d.ts +3 -1
- package/dist/types/components/ButtonBar/_types.d.ts +4 -0
- package/dist/types/components/Chip/_types.d.ts +5 -1
- package/dist/types/components/DivInput/_types.d.ts +2 -0
- package/dist/types/components/DropDown/DropDown.d.ts +2 -3
- package/dist/types/components/DropDown/_types.d.ts +20 -14
- package/dist/types/components/ErrorSummary/ErrorSummary.d.ts +1 -2
- package/dist/types/components/ErrorSummary/_types.d.ts +7 -4
- package/dist/types/components/FileList/_types.d.ts +1 -0
- package/dist/types/components/IconButton/_types.d.ts +3 -0
- package/dist/types/components/Label/Label.d.ts +1 -1
- package/dist/types/components/Label/_types.d.ts +18 -8
- package/dist/types/components/Label/index.d.ts +1 -0
- package/dist/types/components/RadioButton/RadioButton.d.ts +1 -1
- package/dist/types/components/RadioButton/_types.d.ts +12 -11
- package/dist/types/components/RadioButtonList/RadioButtonList.d.ts +1 -1
- package/dist/types/components/RadioButtonList/_types.d.ts +8 -6
- package/dist/types/components/Switch/Switch.d.ts +1 -1
- package/dist/types/components/Switch/_types.d.ts +7 -3
- package/dist/types/components/TabBar/_types.d.ts +2 -2
- package/dist/types/components/TextArea/_types.d.ts +5 -6
- package/dist/types/components/Textfield/_types.d.ts +14 -20
- package/dist/types/components/Tip/_types.d.ts +4 -1
- package/dist/types/components/UploadArea/UploadArea.d.ts +10 -2
- package/dist/types/components/UploadArea/_types.d.ts +5 -1
- package/dist/types/components/playHelpers.d.ts +1 -1
- package/dist/types/index.d.ts +1 -0
- package/package.json +1 -1
- package/dist/cjs/chunks/Label-CZvJbATa.js +0 -118
- package/dist/esm/chunks/Label-7ezP3eHw.mjs +0 -131
|
@@ -12,11 +12,13 @@ import "../theme/colors.mjs";
|
|
|
12
12
|
|
|
13
13
|
import "../hooks/useWindow.mjs";
|
|
14
14
|
|
|
15
|
-
import {
|
|
15
|
+
import { s as setStyle } from "./misc-N8KLjOXc.mjs";
|
|
16
16
|
|
|
17
|
-
import {
|
|
17
|
+
import { B as Button } from "./Button-D24zg6UY.mjs";
|
|
18
18
|
|
|
19
|
-
import { I as
|
|
19
|
+
import { I as Icon } from "./Icon-CUSQtytG.mjs";
|
|
20
|
+
|
|
21
|
+
import { I as IconButton } from "./IconButton-DG69Vlhj.mjs";
|
|
20
22
|
|
|
21
23
|
import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
|
|
22
24
|
|
|
@@ -27,12 +29,13 @@ var css = {
|
|
|
27
29
|
input: "TextField-module_input__AkWBQ",
|
|
28
30
|
showPassword: "TextField-module_showPassword__4Ecfo flexBox-module_row__z24tF",
|
|
29
31
|
clearButton: "TextField-module_clearButton__O9ed3 flexBox-module_row__z24tF",
|
|
32
|
+
xs: "TextField-module_xs__vyt2t type-module_body-xs-regular__ZAFft",
|
|
30
33
|
s: "TextField-module_s__0qm83 type-module_body-s-regular__vRHSP",
|
|
31
34
|
m: "TextField-module_m__M-tLl type-module_body-m-regular__LuQBA",
|
|
32
35
|
l: "TextField-module_l__gbNRz type-module_body-l-regular__lOYbg"
|
|
33
36
|
};
|
|
34
37
|
|
|
35
|
-
styleInject(".flexBox-module_row__z24tF {\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowBetween__5FEvi {\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowStart__4tcxS {\n\tdisplay: flex;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowEnd__rVdVm {\n\tdisplay: flex;\n\tjustify-content: flex-end;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_column__ezvMq {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStart__C7P44 {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: flex-start;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStartCenter__PKcrG {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnBetween__ERfp7 {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnEnd__lLJuc {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-end;\n\talign-items: flex-end;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.type-module_body-xs-regular__ZAFft {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-medium__s3KvF {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-bold__Lhqqq {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.25px;\n}.type-module_body-s-regular__vRHSP {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-medium__tjdFc {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-bold__Iy-VX {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-m-regular__LuQBA {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-medium__uW1on {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-bold__UBcvQ {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-l-regular__lOYbg {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-medium__BqRC7 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-bold__Fh2dt {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-xl-regular__pF2kC {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-medium__BeyrH {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-bold__Ruknj {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_heading-s-medium__z8L3G {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-s-bold__0O3g6 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-bold__KXxEB {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-medium__cJeEA {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-medium__eRe05 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-bold__Xmwtf {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-medium__5q1m3 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-bold__k9VFV {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n.TextField-module_wrapper__qZ-p- {\n\tposition: relative;\n\tpadding: var(--tf-padding) !important;\n\tgap: 8px;\n\toverflow: visible;\n\twidth: var(--tf-width);\n\theight: var(--tf-height);\n\tborder-radius: var(--tf-border-radius);\n\tbackground: var(--tf-bg);\n\tbox-shadow: var(--tf-box-shadow);\n\ttransition: all var(--motion-water-duration) var(--motion-water) 0s;\n}\n\n.TextField-module_container__5U9yK {\n\tflex: 1;\n\theight: 100%;\n\tgap: 8px;\n}\n\n.TextField-module_label__jD8MR {\n\tcolor: var(--tf-label-color);\n\theight: auto;\n\toverflow: hidden;\n\twhite-space: nowrap;\n}\n\n.TextField-module_input__AkWBQ {\n\tcolor: var(--tf-text-color);\n\tbackground-color: transparent;\n\tbox-sizing: border-box;\n\toutline: none;\n\tborder: 0;\n\theight: 100%;\n\twidth: var(--tf-input-width);\n\tfield-sizing: var(--tf-field-size);\n\ttext-align: var(--tf-text-align);\n\t&::placeholder {\n\t\tcolor: var(--tf-placeholder-color);\n\t}\n\t&:focus::placeholder {\n\t\tcolor: var(--tf-placeholder-color);\n\t}\n\t&:disabled {\n\t\tcolor: var(--core-text-disabled);\n\t}\n\t&:-webkit-autofill,\n\t&:-webkit-autofill:hover,\n\t&:-webkit-autofill:focus,\n\t&:-webkit-autofill:active {\n\t\tbox-shadow: 0 0 0 50px var(--core-button-disabled) inset !important;\n\t\t-webkit-text-fill-color: var(--core-text-primary);\n\t}\n}\n\n.TextField-module_showPassword__4Ecfo {\n\tmin-height: 18px;\n\tmin-width: 18px;\n\tmax-height: 18px;\n\tmax-width: 18px;\n\topacity: var(--tf-show-opacity);\n\t&:hover {\n\t\topacity: var(--tf-show-opacity-hover);\n\t}\n}\n\n.TextField-module_clearButton__O9ed3 {\n
|
|
38
|
+
styleInject(".flexBox-module_row__z24tF {\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowBetween__5FEvi {\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowStart__4tcxS {\n\tdisplay: flex;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowEnd__rVdVm {\n\tdisplay: flex;\n\tjustify-content: flex-end;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_column__ezvMq {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStart__C7P44 {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: flex-start;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStartCenter__PKcrG {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnBetween__ERfp7 {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnEnd__lLJuc {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-end;\n\talign-items: flex-end;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.type-module_body-xs-regular__ZAFft {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-medium__s3KvF {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-bold__Lhqqq {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.25px;\n}.type-module_body-s-regular__vRHSP {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-medium__tjdFc {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-bold__Iy-VX {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-m-regular__LuQBA {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-medium__uW1on {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-bold__UBcvQ {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-l-regular__lOYbg {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-medium__BqRC7 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-bold__Fh2dt {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-xl-regular__pF2kC {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-medium__BeyrH {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-bold__Ruknj {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_heading-s-medium__z8L3G {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-s-bold__0O3g6 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-bold__KXxEB {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-medium__cJeEA {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-medium__eRe05 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-bold__Xmwtf {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-medium__5q1m3 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-bold__k9VFV {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n.TextField-module_wrapper__qZ-p- {\n\tposition: relative;\n\tpadding: var(--tf-padding) !important;\n\tpadding-right: var(--tf-padding-right) !important;\n\tgap: 8px;\n\toverflow: visible;\n\twidth: var(--tf-width);\n\theight: var(--tf-height);\n\tborder-radius: var(--tf-border-radius);\n\tbackground: var(--tf-bg);\n\tbox-shadow: var(--tf-box-shadow);\n\ttransition: all var(--motion-water-duration) var(--motion-water) 0s;\n}\n\n.TextField-module_container__5U9yK {\n\tflex: 1;\n\theight: 100%;\n\tgap: 8px;\n}\n\n.TextField-module_label__jD8MR {\n\tcolor: var(--tf-label-color);\n\theight: auto;\n\toverflow: hidden;\n\twhite-space: nowrap;\n}\n\n.TextField-module_input__AkWBQ {\n\tcolor: var(--tf-text-color);\n\tbackground-color: transparent;\n\tbox-sizing: border-box;\n\toutline: none;\n\tborder: 0;\n\theight: 100%;\n\twidth: var(--tf-input-width);\n\tfield-sizing: var(--tf-field-size);\n\ttext-align: var(--tf-text-align);\n\t&::placeholder {\n\t\tcolor: var(--tf-placeholder-color);\n\t}\n\t&:focus::placeholder {\n\t\tcolor: var(--tf-placeholder-color);\n\t}\n\t&:disabled {\n\t\tcolor: var(--core-text-disabled);\n\t}\n\t&:-webkit-autofill,\n\t&:-webkit-autofill:hover,\n\t&:-webkit-autofill:focus,\n\t&:-webkit-autofill:active {\n\t\tbox-shadow: 0 0 0 50px var(--core-button-disabled) inset !important;\n\t\t-webkit-text-fill-color: var(--core-text-primary);\n\t}\n}\n\n.TextField-module_showPassword__4Ecfo {\n\tmin-height: 18px;\n\tmin-width: 18px;\n\tmax-height: 18px;\n\tmax-width: 18px;\n\topacity: var(--tf-show-opacity);\n\t&:hover {\n\t\topacity: var(--tf-show-opacity-hover);\n\t}\n}\n\n.TextField-module_clearButton__O9ed3 {\n border: 0;\n background: transparent;\n\tappearance: none;\n\t-webkit-appearance: none;\n\toutline: none;\n cursor: pointer;\n}\n\n.TextField-module_xs__vyt2t {\n}\n\n.TextField-module_s__0qm83 {\n}\n\n.TextField-module_m__M-tLl {\n}\n\n.TextField-module_l__gbNRz {\n}\n");
|
|
36
39
|
|
|
37
40
|
const MOTION_CONFIG = {
|
|
38
41
|
variants: {
|
|
@@ -52,25 +55,11 @@ const MOTION_CONFIG = {
|
|
|
52
55
|
}
|
|
53
56
|
}, TextField = React.memo(props => {
|
|
54
57
|
const theme = useTheme(), {name: name = "input_name", value: value = "", label: label = "", labelSize: labelSize = "m", textSize: textSize = "m", placeholder: placeholder = "placeholder", focused: focused = !1, onSubmit: onSubmit = () => null, onChange: onChange = () => null, onBlur: onBlur = () => null, onFocus: onFocus = () => null, onKeydown: onKeydown = () => null, onAction: onAction = () => null, onPaste: onPaste = () => null, onClear: onClear = () => null, onValidate: onValidate = () => null, actionButton: actionButton = !1, maxLength: maxLength, size: size = {
|
|
55
|
-
width: "
|
|
58
|
+
width: "100%",
|
|
56
59
|
height: "auto"
|
|
57
|
-
}, padding: padding
|
|
58
|
-
focused: "var(--core-link-primary)",
|
|
59
|
-
blurred: "var(--core-outline-primary)",
|
|
60
|
-
error: "var(--feedback-warning)"
|
|
61
|
-
}, backgroundColor: backgroundColor = {
|
|
62
|
-
focused: "var(--core-surface-secondary)",
|
|
63
|
-
blurred: "var(--core-surface-secondary)"
|
|
64
|
-
}, color: color = {
|
|
65
|
-
focused: "var(--core-text-primary)",
|
|
66
|
-
blurred: "var(--core-text-primary)",
|
|
67
|
-
error: "var(--feedback-warning)",
|
|
68
|
-
placeholder: "var(--core-text-disabled)",
|
|
69
|
-
disabled: "var(--core-text-disabled)",
|
|
70
|
-
label: "var(--core-text-primary)"
|
|
71
|
-
}, iconLeft: iconLeft = null, clearButton: clearButton = {
|
|
60
|
+
}, padding: padding, borderRadius: borderRadius = 8, editable: editable = !0, textAlign: textAlign = "left", isValid: isValid = !0, inline: inline = !1, noShow: noShow = !1, borderType: borderType = "box", validate: validate = !0, borderColorFocused: borderColorFocused = "var(--core-link-primary)", borderColorBlurred: borderColorBlurred = "var(--core-outline-primary)", borderColorError: borderColorError = "var(--feedback-warning)", backgroundColorFocused: backgroundColorFocused = "var(--core-surface-secondary)", backgroundColorBlurred: backgroundColorBlurred = "var(--core-surface-secondary)", textColorFocused: textColorFocused = "var(--core-text-primary)", textColorBlurred: textColorBlurred = "var(--core-text-primary)", textColorError: textColorError = "var(--feedback-warning)", textColorPlaceholder: textColorPlaceholder = "var(--core-text-disabled)", textColorDisabled: textColorDisabled = "var(--core-text-disabled)", labelColor: labelColor = "var(--core-text-primary)", iconLeft: iconLeft = null, clearButton: clearButton = {
|
|
72
61
|
size: 20
|
|
73
|
-
}, clearBlurs: clearBlurs = !1, disabled: disabled = !1, inputType: inputType = "text"} = props, divAttributes = __rest(props, [ "name", "value", "label", "labelSize", "textSize", "placeholder", "focused", "onSubmit", "onChange", "onBlur", "onFocus", "onKeydown", "onAction", "onPaste", "onClear", "onValidate", "actionButton", "maxLength", "size", "padding", "borderRadius", "editable", "textAlign", "isValid", "inline", "noShow", "borderType", "validate", "
|
|
62
|
+
}, clearBlurs: clearBlurs = !1, disabled: disabled = !1, inputType: inputType = "text"} = props, divAttributes = __rest(props, [ "name", "value", "label", "labelSize", "textSize", "placeholder", "focused", "onSubmit", "onChange", "onBlur", "onFocus", "onKeydown", "onAction", "onPaste", "onClear", "onValidate", "actionButton", "maxLength", "size", "padding", "borderRadius", "editable", "textAlign", "isValid", "inline", "noShow", "borderType", "validate", "borderColorFocused", "borderColorBlurred", "borderColorError", "backgroundColorFocused", "backgroundColorBlurred", "textColorFocused", "textColorBlurred", "textColorError", "textColorPlaceholder", "textColorDisabled", "labelColor", "iconLeft", "clearButton", "clearBlurs", "disabled", "inputType" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", input = useRef(null), [text, setText] = useState(value), [isFocused, setIsFocused] = useState(focused), [valid, setValid] = useState(isValid), [show, setShow] = useState(!1);
|
|
74
63
|
useEffect(() => {
|
|
75
64
|
input.current && (focused ? input.current.focus() : input.current.blur(), setIsFocused(focused));
|
|
76
65
|
}, [ focused ]), useEffect(() => {
|
|
@@ -83,9 +72,10 @@ const MOTION_CONFIG = {
|
|
|
83
72
|
const ok = entry.length > 1 || "" === entry;
|
|
84
73
|
setValid(ok), valid !== ok && onValidate(ok);
|
|
85
74
|
}, [ onValidate, valid, validate ]), handleClearTextField = useCallback(() => {
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
75
|
+
var _a;
|
|
76
|
+
disabled || "" === (null === (_a = input.current) || void 0 === _a ? void 0 : _a.value) || ((null == input ? void 0 : input.current) && (clearBlurs || input.current.focus(),
|
|
77
|
+
setText(""), textIsValid("")), onChange(""), onClear());
|
|
78
|
+
}, [ disabled, clearBlurs, onChange, onClear, textIsValid ]), handleValueChange = useCallback(newValue => {
|
|
89
79
|
disabled || (setText(newValue), onChange(newValue), valid || textIsValid(text));
|
|
90
80
|
}, [ onChange, textIsValid, text, valid, disabled ]), handleBlur = useCallback(() => {
|
|
91
81
|
disabled || (textIsValid(text), setIsFocused(!1), onBlur(text));
|
|
@@ -104,36 +94,36 @@ const MOTION_CONFIG = {
|
|
|
104
94
|
width: iconLeft.size,
|
|
105
95
|
height: iconLeft.size
|
|
106
96
|
} : void 0, [ iconLeft ]), iconStrokeColor = useMemo(() => (null == iconLeft ? void 0 : iconLeft.color) ? iconLeft.color : theme.current.colors["core-icon-secondary"], [ iconLeft, theme ]), clearButtonStyle = useMemo(() => clearButton ? {
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
} : void 0, [ clearButton ]),
|
|
97
|
+
minWidth: clearButton.size,
|
|
98
|
+
minHeight: clearButton.size
|
|
99
|
+
} : void 0, [ clearButton ]), setBackgroundColor = useMemo(() => inline ? "unset" : isFocused ? null != backgroundColorFocused ? backgroundColorFocused : "transparent" : null != backgroundColorBlurred ? backgroundColorBlurred : "transparent", [ inline, isFocused, backgroundColorFocused, backgroundColorBlurred ]), setBorderColor = useMemo(() => {
|
|
110
100
|
var _a, _b;
|
|
111
|
-
return
|
|
112
|
-
}, [
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
}, [ size, padding, label, borderRadius,
|
|
101
|
+
return "none" === borderType ? "transparent" : validate && !valid ? null !== (_a = null != borderColorError ? borderColorError : borderColorBlurred) && void 0 !== _a ? _a : "transparent" : isFocused ? null !== (_b = null != borderColorFocused ? borderColorFocused : borderColorBlurred) && void 0 !== _b ? _b : "transparent" : null != borderColorBlurred ? borderColorBlurred : "transparent";
|
|
102
|
+
}, [ borderType, valid, isFocused, borderColorError, borderColorFocused, borderColorBlurred, validate ]), setBoxShadow = useMemo(() => "none" === borderType ? "unset" : "underline" === borderType ? `0 1px 0 0 ${setBorderColor}` : `0 0 0 1px ${setBorderColor}`, [ borderType, setBorderColor ]), textColor = useMemo(() => validate && !valid ? null != textColorError ? textColorError : "var(--core-text-primary)" : isFocused ? null != textColorFocused ? textColorFocused : "var(--core-text-primary)" : null != textColorBlurred ? textColorBlurred : "var(--core-text-primary)", [ isFocused, valid, textColorError, textColorFocused, textColorBlurred, validate ]), setTextAlign = useMemo(() => null != textAlign ? textAlign : "left", [ textAlign ]), setShowOpacity = useMemo(() => "password" !== inputType ? "0" : isFocused ? "1" : "0.5", [ inputType, isFocused ]), setPaddingRight = useMemo(() => {
|
|
103
|
+
const defaultPadding = clearButton ? 8 : 16;
|
|
104
|
+
if (!padding) return defaultPadding;
|
|
105
|
+
if ("string" == typeof padding) {
|
|
106
|
+
const paddingParts = padding.split(" "), sidePadding = paddingParts[1 === paddingParts.length ? 0 : 1], sideAsNumber = Number.parseFloat(sidePadding.replace("px", ""));
|
|
107
|
+
return Number.isNaN(sideAsNumber) ? defaultPadding : sideAsNumber - 4;
|
|
108
|
+
}
|
|
109
|
+
return clearButton ? padding - 4 : padding;
|
|
110
|
+
}, [ padding, clearButton ]), cssVars = useMemo(() => ({
|
|
111
|
+
"--tf-input-width": "unset" !== size.width && "100%",
|
|
112
|
+
"--tf-field-size": "auto" === size.width ? "content" : "unset",
|
|
113
|
+
"--tf-width": setStyle(size.width),
|
|
114
|
+
"--tf-height": setStyle(size.height),
|
|
115
|
+
"--tf-padding": setStyle(padding, "8px 16px"),
|
|
116
|
+
"--tf-padding-right": `${setPaddingRight}px`,
|
|
117
|
+
"--tf-padding-label-left": "" === label ? "unset" : "0",
|
|
118
|
+
"--tf-border-radius": setStyle(borderRadius),
|
|
119
|
+
"--tf-bg-color": setBackgroundColor,
|
|
120
|
+
"--tf-box-shadow": setBoxShadow,
|
|
121
|
+
"--tf-color": textColor,
|
|
122
|
+
"--tf-label-color": disabled ? null != textColorDisabled ? textColorDisabled : "var(--core-text-disabled)" : labelColor,
|
|
123
|
+
"--tf-text-align": setTextAlign,
|
|
124
|
+
"--tf-show-opacity": setShowOpacity,
|
|
125
|
+
"--tf-placeholder-color": null != textColorPlaceholder ? textColorPlaceholder : "var(--core-text-disabled)"
|
|
126
|
+
}), [ size, padding, label, borderRadius, setBackgroundColor, setBoxShadow, textColor, setTextAlign, setShowOpacity, textColorPlaceholder, textColorDisabled, labelColor, disabled, setPaddingRight ]);
|
|
137
127
|
return jsxs("div", Object.assign({
|
|
138
128
|
id: divId,
|
|
139
129
|
className: `${css.wrapper}${divClass}`,
|
|
@@ -170,24 +160,16 @@ const MOTION_CONFIG = {
|
|
|
170
160
|
onMouseDown: e => e.stopPropagation(),
|
|
171
161
|
disabled: !editable || disabled,
|
|
172
162
|
maxLength: maxLength
|
|
173
|
-
}), jsx(
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
exit: "exit",
|
|
184
|
-
transition: MOTION_CONFIG.transition,
|
|
185
|
-
onClick: handleClearTextField,
|
|
186
|
-
children: jsx(Icon, {
|
|
187
|
-
name: "x",
|
|
188
|
-
size: clearButton.size,
|
|
189
|
-
strokeColor: theme.current.colors["core-icon-secondary"]
|
|
190
|
-
})
|
|
163
|
+
}), clearButton && jsx("button", {
|
|
164
|
+
type: "button",
|
|
165
|
+
"aria-label": "Clear text",
|
|
166
|
+
className: css.clearButton,
|
|
167
|
+
style: clearButtonStyle,
|
|
168
|
+
onClick: handleClearTextField,
|
|
169
|
+
children: isFocused && "" !== text && jsx(Icon, {
|
|
170
|
+
name: "x",
|
|
171
|
+
size: clearButton.size,
|
|
172
|
+
strokeColor: theme.current.colors["core-icon-secondary"]
|
|
191
173
|
})
|
|
192
174
|
}), jsx(AnimatePresence, {
|
|
193
175
|
initial: !1,
|
|
@@ -222,7 +204,7 @@ const MOTION_CONFIG = {
|
|
|
222
204
|
}) ]
|
|
223
205
|
}) ]
|
|
224
206
|
}));
|
|
225
|
-
}, (prevProps, nextProps) => prevProps.value === nextProps.value && prevProps.borderType === nextProps.borderType && prevProps.borderRadius === nextProps.borderRadius && prevProps.
|
|
207
|
+
}, (prevProps, nextProps) => prevProps.value === nextProps.value && prevProps.borderType === nextProps.borderType && prevProps.borderRadius === nextProps.borderRadius && prevProps.borderColorFocused === nextProps.borderColorFocused && prevProps.borderColorBlurred === nextProps.borderColorBlurred && prevProps.borderColorError === nextProps.borderColorError && prevProps.backgroundColorFocused === nextProps.backgroundColorFocused && prevProps.backgroundColorBlurred === nextProps.backgroundColorBlurred && prevProps.textColorFocused === nextProps.textColorFocused && prevProps.textColorBlurred === nextProps.textColorBlurred && prevProps.textColorError === nextProps.textColorError && prevProps.textColorPlaceholder === nextProps.textColorPlaceholder && prevProps.textColorDisabled === nextProps.textColorDisabled && prevProps.labelColor === nextProps.labelColor && prevProps.labelSize === nextProps.labelSize && prevProps.focused === nextProps.focused && prevProps.isValid === nextProps.isValid && prevProps.validate === nextProps.validate && prevProps.disabled === nextProps.disabled && prevProps.label === nextProps.label && prevProps.inputType === nextProps.inputType && prevProps.textSize === nextProps.textSize && prevProps.padding === nextProps.padding && prevProps.textAlign === nextProps.textAlign && prevProps.placeholder === nextProps.placeholder);
|
|
226
208
|
|
|
227
209
|
TextField.displayName = "TextField";
|
|
228
210
|
|
|
@@ -12,19 +12,20 @@ import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
|
|
|
12
12
|
|
|
13
13
|
var css = {
|
|
14
14
|
wrapper: "Tip-module_wrapper__D7ACT flexBox-module_rowStart__4tcxS",
|
|
15
|
+
xs: "Tip-module_xs__wsz9y type-module_body-xs-regular__ZAFft",
|
|
15
16
|
s: "Tip-module_s__Wvz3q type-module_body-s-regular__vRHSP",
|
|
16
17
|
m: "Tip-module_m__9qJbB type-module_body-m-regular__LuQBA",
|
|
17
18
|
l: "Tip-module_l__OdNuh type-module_body-l-regular__lOYbg"
|
|
18
19
|
};
|
|
19
20
|
|
|
20
|
-
styleInject(".flexBox-module_row__z24tF {\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowBetween__5FEvi {\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowStart__4tcxS {\n\tdisplay: flex;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowEnd__rVdVm {\n\tdisplay: flex;\n\tjustify-content: flex-end;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_column__ezvMq {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStart__C7P44 {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: flex-start;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStartCenter__PKcrG {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnBetween__ERfp7 {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnEnd__lLJuc {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-end;\n\talign-items: flex-end;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.type-module_body-xs-regular__ZAFft {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-medium__s3KvF {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-bold__Lhqqq {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.25px;\n}.type-module_body-s-regular__vRHSP {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-medium__tjdFc {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-bold__Iy-VX {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-m-regular__LuQBA {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-medium__uW1on {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-bold__UBcvQ {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-l-regular__lOYbg {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-medium__BqRC7 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-bold__Fh2dt {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-xl-regular__pF2kC {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-medium__BeyrH {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-bold__Ruknj {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_heading-s-medium__z8L3G {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-s-bold__0O3g6 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-bold__KXxEB {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-medium__cJeEA {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-medium__eRe05 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-bold__Xmwtf {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-medium__5q1m3 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-bold__k9VFV {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n.Tip-module_wrapper__D7ACT {\n
|
|
21
|
+
styleInject(".flexBox-module_row__z24tF {\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowBetween__5FEvi {\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowStart__4tcxS {\n\tdisplay: flex;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowEnd__rVdVm {\n\tdisplay: flex;\n\tjustify-content: flex-end;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_column__ezvMq {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStart__C7P44 {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: flex-start;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStartCenter__PKcrG {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnBetween__ERfp7 {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnEnd__lLJuc {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-end;\n\talign-items: flex-end;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.type-module_body-xs-regular__ZAFft {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-medium__s3KvF {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-bold__Lhqqq {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.25px;\n}.type-module_body-s-regular__vRHSP {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-medium__tjdFc {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-bold__Iy-VX {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-m-regular__LuQBA {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-medium__uW1on {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-bold__UBcvQ {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-l-regular__lOYbg {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-medium__BqRC7 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-bold__Fh2dt {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-xl-regular__pF2kC {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-medium__BeyrH {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-bold__Ruknj {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_heading-s-medium__z8L3G {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-s-bold__0O3g6 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-bold__KXxEB {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-medium__cJeEA {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-medium__eRe05 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-bold__Xmwtf {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-medium__5q1m3 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-bold__k9VFV {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n.Tip-module_wrapper__D7ACT {\n padding: var(--tooltip-padding) !important;\n position: fixed;\n\tborder: var(--tooltip-border);\n\tborder-radius: var(--tooltip-border-radius);\n\tbackground: var(--tooltip-background);\n z-index: var(--elevation-describe);\n}\n\n.Tip-module_xs__wsz9y {\n}\n\n.Tip-module_s__Wvz3q {\n}\n\n.Tip-module_m__9qJbB {\n}\n.Tip-module_l__OdNuh {\n}\n");
|
|
21
22
|
|
|
22
23
|
const tipBasePos = {
|
|
23
24
|
left: 0,
|
|
24
25
|
top: 0
|
|
25
26
|
}, TipBase = React.forwardRef((props, ref) => {
|
|
26
27
|
var _a;
|
|
27
|
-
const {tip: tip, size: size = "s", bgColor: bgColor, color: color, border: border = !0, borderColor: borderColor, padding: padding, radius: radius, coords: coords, showDelay: showDelay = 500, hideDelay: hideDelay = 2500} = props, divAttributes = __rest(props, [ "tip", "size", "bgColor", "color", "border", "borderColor", "padding", "radius", "coords", "showDelay", "hideDelay" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? `${className}` : "", [pos, setPos] = useState(tipBasePos), [ready, setReady] = useState(!1), [animate, setAnimate] = useState(!1), timer = useRef(null);
|
|
28
|
+
const {tip: tip, size: size = "s", backgroundColor: backgroundColor, bgColor: bgColor, textColor: textColor, color: color, border: border = !0, borderColor: borderColor, padding: padding, borderRadius: borderRadius, radius: radius, coords: coords, showDelay: showDelay = 500, hideDelay: hideDelay = 2500} = props, divAttributes = __rest(props, [ "tip", "size", "backgroundColor", "bgColor", "textColor", "color", "border", "borderColor", "padding", "borderRadius", "radius", "coords", "showDelay", "hideDelay" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? `${className}` : "", [pos, setPos] = useState(tipBasePos), [ready, setReady] = useState(!1), [animate, setAnimate] = useState(!1), timer = useRef(null), resolvedBackgroundColor = null != backgroundColor ? backgroundColor : bgColor, resolvedTextColor = null != textColor ? textColor : color, resolvedBorderRadius = null != borderRadius ? borderRadius : radius;
|
|
28
29
|
useEffect(() => {
|
|
29
30
|
timer.current && clearTimeout(timer.current);
|
|
30
31
|
const {x: x, y: y} = null != coords ? coords : {
|
|
@@ -51,11 +52,11 @@ const tipBasePos = {
|
|
|
51
52
|
}, [ coords, showDelay, hideDelay ]), useEffect(() => setAnimate(ready), [ ready ]);
|
|
52
53
|
const cssVars = useMemo(() => ({
|
|
53
54
|
"--tooltip-padding": null != padding ? padding : "3px 6px",
|
|
54
|
-
"--tooltip-background": null !=
|
|
55
|
-
"--tooltip-color": null !=
|
|
55
|
+
"--tooltip-background": null != resolvedBackgroundColor ? resolvedBackgroundColor : "var(--core-surface-secondary)",
|
|
56
|
+
"--tooltip-color": null != resolvedTextColor ? resolvedTextColor : "var(--core-text-primary)",
|
|
56
57
|
"--tooltip-border": border ? `1px solid ${null != borderColor ? borderColor : "var(--core-outline-primary)"}` : "unset",
|
|
57
|
-
"--tooltip-border-radius": null !=
|
|
58
|
-
}), [ padding,
|
|
58
|
+
"--tooltip-border-radius": null != resolvedBorderRadius ? resolvedBorderRadius : "4px"
|
|
59
|
+
}), [ padding, resolvedBackgroundColor, resolvedTextColor, border, borderColor, resolvedBorderRadius ]), coordStyle = useMemo(() => {
|
|
59
60
|
const {left: left, top: top} = pos;
|
|
60
61
|
return {
|
|
61
62
|
left: `${null != left ? left : 0}px`,
|
|
@@ -14,7 +14,7 @@ import "../hooks/useWindow.mjs";
|
|
|
14
14
|
|
|
15
15
|
import { s as setStyle, f as filterClasses, a as accessibleKeyDown } from "./misc-N8KLjOXc.mjs";
|
|
16
16
|
|
|
17
|
-
import { I as Icon } from "./Icon-
|
|
17
|
+
import { I as Icon } from "./Icon-CUSQtytG.mjs";
|
|
18
18
|
|
|
19
19
|
import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
|
|
20
20
|
|
|
@@ -4,13 +4,13 @@ import React, { useState, useRef, useId, useCallback, useMemo } from "react";
|
|
|
4
4
|
|
|
5
5
|
import { s as setStyle, a as accessibleKeyDown } from "./misc-N8KLjOXc.mjs";
|
|
6
6
|
|
|
7
|
-
import { I as Icon } from "./Icon-
|
|
7
|
+
import { I as Icon } from "./Icon-CUSQtytG.mjs";
|
|
8
8
|
|
|
9
|
-
import { P as ProgressIndicator } from "./ProgressIndicator-
|
|
9
|
+
import { P as ProgressIndicator } from "./ProgressIndicator-D7paCpgY.mjs";
|
|
10
10
|
|
|
11
11
|
import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
|
|
12
12
|
|
|
13
|
-
import { F as FileList } from "./FileList-
|
|
13
|
+
import { F as FileList } from "./FileList-5LElsgoE.mjs";
|
|
14
14
|
|
|
15
15
|
var css = {
|
|
16
16
|
wrapper: "UploadArea-module_wrapper__aircC flexBox-module_column__ezvMq",
|
|
@@ -36,7 +36,7 @@ var FileTypes;
|
|
|
36
36
|
}(FileTypes || (FileTypes = {}));
|
|
37
37
|
|
|
38
38
|
const UploadAreaBase = React.forwardRef((props, ref) => {
|
|
39
|
-
const {icon: icon = "upload", iconColor: iconColor = "var(--core-text-primary)", iconColorHover: iconColorHover = "var(--core-text-special)", title: title = "Upload Files", width: width = "100%", height: height = "auto", message: message = "Drag and drop files here or click to upload", busyMessage: busyMessage = "Uploading in progress", iconSize: iconSize = 24, textSize: textSize = "m", border: border = 1, borderStyle: borderStyle = "dashed", borderColor: borderColor = "var(--core-outline-primary)", borderColorHover: borderColorHover = "var(--core-outline-special)", radius: radius = 8, padding: padding = 32, bgColor: bgColor = "var(--core-surface-secondary)", bgColorHover: bgColorHover = "var(--core-surface-special)", acceptedTypes: acceptedTypes = allTypes, multiple: multiple = !0, busy: busy = !1, canRemove: canRemove = !0, showProgress: showProgress = !0, files: files = [], onUpload: onUpload} = props, [hovered, setHovered] = useState(!1), inputRef = useRef(null), dragDepth = useRef(0), inputId = useId(), titleId = useId(), messageId = useId(), isInteractive = !busy && files.length < 1, handleClickUpload = useCallback(() => {
|
|
39
|
+
const {icon: icon = "upload", iconColor: iconColor = "var(--core-text-primary)", iconColorHover: iconColorHover = "var(--core-text-special)", title: title = "Upload Files", width: width = "100%", height: height = "auto", message: message = "Drag and drop files here or click to upload", busyMessage: busyMessage = "Uploading in progress", iconSize: iconSize = 24, textSize: textSize = "m", borderWidth: borderWidth, border: border = 1, borderStyle: borderStyle = "dashed", borderColor: borderColor = "var(--core-outline-primary)", borderColorHover: borderColorHover = "var(--core-outline-special)", borderRadius: borderRadius, radius: radius = 8, padding: padding = 32, backgroundColor: backgroundColor, backgroundColorHover: backgroundColorHover, bgColor: bgColor = "var(--core-surface-secondary)", bgColorHover: bgColorHover = "var(--core-surface-special)", acceptedTypes: acceptedTypes = allTypes, multiple: multiple = !0, busy: busy = !1, canRemove: canRemove = !0, showProgress: showProgress = !0, files: files = [], onUpload: onUpload} = props, [hovered, setHovered] = useState(!1), inputRef = useRef(null), dragDepth = useRef(0), inputId = useId(), titleId = useId(), messageId = useId(), isInteractive = !busy && files.length < 1, resolvedBorderWidth = null != borderWidth ? borderWidth : border, resolvedBorderRadius = null != borderRadius ? borderRadius : radius, resolvedBackgroundColor = null != backgroundColor ? backgroundColor : bgColor, resolvedBackgroundColorHover = null != backgroundColorHover ? backgroundColorHover : bgColorHover, handleClickUpload = useCallback(() => {
|
|
40
40
|
var _a;
|
|
41
41
|
isInteractive && (null == inputRef ? void 0 : inputRef.current) && (inputRef.current.value = "",
|
|
42
42
|
null === (_a = inputRef.current) || void 0 === _a || _a.click());
|
|
@@ -57,17 +57,17 @@ const UploadAreaBase = React.forwardRef((props, ref) => {
|
|
|
57
57
|
const files = Array.from(null !== (_a = e.dataTransfer.files) && void 0 !== _a ? _a : []);
|
|
58
58
|
null == onUpload || onUpload(files);
|
|
59
59
|
}, [ busy, onUpload ]), iconStrokeColor = useMemo(() => hovered ? iconColorHover : iconColor, [ hovered, iconColor, iconColorHover ]), cssVars = useMemo(() => ({
|
|
60
|
-
"--ua-border": `${
|
|
60
|
+
"--ua-border": `${resolvedBorderWidth}px`,
|
|
61
61
|
"--ua-border-style": borderStyle,
|
|
62
62
|
"--ua-border-color": hovered || busy ? borderColorHover : borderColor,
|
|
63
|
-
"--ua-radius": `${
|
|
63
|
+
"--ua-radius": `${resolvedBorderRadius}px`,
|
|
64
64
|
"--ua-padding": setStyle(padding),
|
|
65
|
-
"--ua-bg-color": hovered ?
|
|
65
|
+
"--ua-bg-color": hovered ? resolvedBackgroundColorHover : resolvedBackgroundColor,
|
|
66
66
|
"--ua-icon-size": `${iconSize}px`,
|
|
67
67
|
"--ua-cursor": busy || files.length > 0 ? "default" : "pointer",
|
|
68
68
|
"--ua-width": setStyle(width),
|
|
69
69
|
"--ua-height": setStyle(height)
|
|
70
|
-
}), [
|
|
70
|
+
}), [ resolvedBorderWidth, borderStyle, borderColor, borderColorHover, resolvedBorderRadius, padding, resolvedBackgroundColor, resolvedBackgroundColorHover, iconSize, busy, hovered, height, files.length, width ]);
|
|
71
71
|
return jsxs("div", {
|
|
72
72
|
className: css.wrapper,
|
|
73
73
|
style: cssVars,
|
|
@@ -12,15 +12,21 @@ function isValidIDBKey(key) {
|
|
|
12
12
|
return "string" == typeof key || "number" == typeof key || key instanceof Date || key instanceof ArrayBuffer || (Array.isArray(key) ? key.every(entry => isValidIDBKey(entry)) : ArrayBuffer.isView(key));
|
|
13
13
|
}
|
|
14
14
|
|
|
15
|
-
|
|
15
|
+
/**
|
|
16
|
+
* Determine if two keys are equal based on their value type
|
|
17
|
+
*/ function areKeysEqual(left, right) {
|
|
16
18
|
return left instanceof Date && right instanceof Date ? left.getTime() === right.getTime() : Array.isArray(left) && Array.isArray(right) ? left.length === right.length && left.every((value, index) => areKeysEqual(value, right[index])) : left === right;
|
|
17
19
|
}
|
|
18
20
|
|
|
19
|
-
|
|
21
|
+
/**
|
|
22
|
+
* Normalize a value to an array of values
|
|
23
|
+
*/ function normalizeValues(value) {
|
|
20
24
|
return Array.isArray(value) ? value : [ value ];
|
|
21
25
|
}
|
|
22
26
|
|
|
23
|
-
|
|
27
|
+
/**
|
|
28
|
+
* Read and return all records from an IndexedDB connection
|
|
29
|
+
*/ function readStoreRecords(connection) {
|
|
24
30
|
return __awaiter(this, void 0, void 0, function*() {
|
|
25
31
|
const [keys, values] = yield Promise.all([ connection.getAllKeys(), connection.getAll() ]);
|
|
26
32
|
return keys.map((key, index) => {
|
|
@@ -33,28 +39,42 @@ function readStoreRecords(connection) {
|
|
|
33
39
|
});
|
|
34
40
|
}
|
|
35
41
|
|
|
36
|
-
|
|
42
|
+
/**
|
|
43
|
+
* Get the db connection for a given store name
|
|
44
|
+
*/ function getConnection(stores, name) {
|
|
37
45
|
const connection = stores.find(entry => entry.name === name);
|
|
38
46
|
if (!connection) throw new Error(`IndexedDB store "${name}" is not registered.`);
|
|
39
47
|
return connection;
|
|
40
48
|
}
|
|
41
49
|
|
|
42
|
-
|
|
50
|
+
/**
|
|
51
|
+
* Apply a partial state patch to a connection
|
|
52
|
+
*/ function applyConnectionState(name, patch) {
|
|
43
53
|
useLocalDBStore.setState(state => ({
|
|
44
54
|
stores: state.stores.map(entry => entry.name === name ? Object.assign(Object.assign({}, entry), patch) : entry)
|
|
45
55
|
}));
|
|
46
56
|
}
|
|
47
57
|
|
|
48
|
-
|
|
58
|
+
/**
|
|
59
|
+
* Apply error to to the connection state
|
|
60
|
+
*/ function applyStoreError(name, error) {
|
|
49
61
|
applyConnectionState(name, {
|
|
50
62
|
error: error instanceof Error ? error.message : String(error)
|
|
51
63
|
});
|
|
52
64
|
}
|
|
53
65
|
|
|
54
|
-
|
|
66
|
+
/**
|
|
67
|
+
* Helper to convert an error to an Error instance
|
|
68
|
+
*/ function toError(error) {
|
|
55
69
|
return error instanceof Error ? error : new Error(String(error));
|
|
56
70
|
}
|
|
57
71
|
|
|
72
|
+
/**
|
|
73
|
+
* Helper to create a success result value
|
|
74
|
+
*/
|
|
75
|
+
/**
|
|
76
|
+
* Helper to create a failure result value
|
|
77
|
+
*/
|
|
58
78
|
function failureResult(error) {
|
|
59
79
|
return {
|
|
60
80
|
ok: !1,
|
|
@@ -62,20 +82,30 @@ function failureResult(error) {
|
|
|
62
82
|
};
|
|
63
83
|
}
|
|
64
84
|
|
|
65
|
-
|
|
85
|
+
/**
|
|
86
|
+
* Helper to derive the success value from an op
|
|
87
|
+
*/ function successValueResult(value) {
|
|
66
88
|
return {
|
|
67
89
|
ok: !0,
|
|
68
90
|
value: value
|
|
69
91
|
};
|
|
70
92
|
}
|
|
71
93
|
|
|
72
|
-
|
|
94
|
+
/**
|
|
95
|
+
* Helper to derive the success value from an op
|
|
96
|
+
*/ function failureValueResult(error) {
|
|
73
97
|
return {
|
|
74
98
|
ok: !1,
|
|
75
99
|
error: toError(error)
|
|
76
100
|
};
|
|
77
101
|
}
|
|
78
102
|
|
|
103
|
+
/**
|
|
104
|
+
* Helper to indicate a key field is required for actions
|
|
105
|
+
*/
|
|
106
|
+
/**
|
|
107
|
+
* Helper to get the a store key field from a value
|
|
108
|
+
*/
|
|
79
109
|
function deriveRecordKey(store, value) {
|
|
80
110
|
const keyField = function(store) {
|
|
81
111
|
if (!store.key) throw new Error(`IndexedDB store "${store.name}" requires a configured key field for value-driven actions.`);
|
|
@@ -94,7 +124,9 @@ function replaceConnection(connection) {
|
|
|
94
124
|
}));
|
|
95
125
|
}
|
|
96
126
|
|
|
97
|
-
|
|
127
|
+
/**
|
|
128
|
+
* Update connection with an error state
|
|
129
|
+
*/ const useLocalDBStore = create((set, get) => ({
|
|
98
130
|
stores: [],
|
|
99
131
|
actions: {
|
|
100
132
|
addStore: (name_1, ...args_1) => __awaiter(void 0, [ name_1, ...args_1 ], void 0, function*(name, options = {}) {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { A as AvatarGroup } from "../../chunks/AvatarGroup-
|
|
1
|
+
export { A as AvatarGroup } from "../../chunks/AvatarGroup--ELW-bO1.mjs";
|
|
2
2
|
|
|
3
3
|
import "../../chunks/tslib.es6-c-7TIv71.mjs";
|
|
4
4
|
|
|
@@ -6,7 +6,7 @@ import "react/jsx-runtime";
|
|
|
6
6
|
|
|
7
7
|
import "react";
|
|
8
8
|
|
|
9
|
-
import "../../chunks/Avatar-
|
|
9
|
+
import "../../chunks/Avatar-CSLVUF_y.mjs";
|
|
10
10
|
|
|
11
11
|
import "../../chunks/misc-N8KLjOXc.mjs";
|
|
12
12
|
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { B as Button } from "../../chunks/Button-
|
|
1
|
+
export { B as Button } from "../../chunks/Button-D24zg6UY.mjs";
|
|
2
2
|
|
|
3
3
|
import "../../chunks/tslib.es6-c-7TIv71.mjs";
|
|
4
4
|
|
|
@@ -14,7 +14,7 @@ import "../../chunks/style-inject.es-D0BjEaN8.mjs";
|
|
|
14
14
|
|
|
15
15
|
import "../../chunks/Dot-CLGwQu-i.mjs";
|
|
16
16
|
|
|
17
|
-
import "../../chunks/Icon-
|
|
17
|
+
import "../../chunks/Icon-CUSQtytG.mjs";
|
|
18
18
|
|
|
19
19
|
import "../../hooks/useTheme.mjs";
|
|
20
20
|
|
|
@@ -36,6 +36,6 @@ import "../../hooks/useWindow.mjs";
|
|
|
36
36
|
|
|
37
37
|
import "../../chunks/misc-N8KLjOXc.mjs";
|
|
38
38
|
|
|
39
|
-
import "../../chunks/ProgressIndicator-
|
|
39
|
+
import "../../chunks/ProgressIndicator-D7paCpgY.mjs";
|
|
40
40
|
|
|
41
41
|
import "../../chunks/sharedTypes-tn9-uJvb.mjs";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { B as ButtonBar } from "../../chunks/ButtonBar-
|
|
1
|
+
export { B as ButtonBar } from "../../chunks/ButtonBar-DXK8meQq.mjs";
|
|
2
2
|
|
|
3
3
|
import "../../chunks/tslib.es6-c-7TIv71.mjs";
|
|
4
4
|
|
|
@@ -8,7 +8,7 @@ import "react";
|
|
|
8
8
|
|
|
9
9
|
import "../../chunks/misc-N8KLjOXc.mjs";
|
|
10
10
|
|
|
11
|
-
import "../../chunks/Icon-
|
|
11
|
+
import "../../chunks/Icon-CUSQtytG.mjs";
|
|
12
12
|
|
|
13
13
|
import "../../hooks/useTheme.mjs";
|
|
14
14
|
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { C as Camera } from "../../chunks/Camera-
|
|
1
|
+
export { C as Camera } from "../../chunks/Camera-BqmVsVKy.mjs";
|
|
2
2
|
|
|
3
3
|
import "../../chunks/tslib.es6-c-7TIv71.mjs";
|
|
4
4
|
|
|
@@ -28,8 +28,8 @@ import "../../chunks/misc-N8KLjOXc.mjs";
|
|
|
28
28
|
|
|
29
29
|
import "../../chunks/colors-FQ0uNQcW.mjs";
|
|
30
30
|
|
|
31
|
-
import "../../chunks/Avatar-
|
|
31
|
+
import "../../chunks/Avatar-CSLVUF_y.mjs";
|
|
32
32
|
|
|
33
33
|
import "../../chunks/style-inject.es-D0BjEaN8.mjs";
|
|
34
34
|
|
|
35
|
-
import "../../chunks/Icon-
|
|
35
|
+
import "../../chunks/Icon-CUSQtytG.mjs";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { C as CheckBox } from "../../chunks/CheckBox-
|
|
1
|
+
export { C as CheckBox } from "../../chunks/CheckBox-BsaYFNC6.mjs";
|
|
2
2
|
|
|
3
3
|
import "../../chunks/tslib.es6-c-7TIv71.mjs";
|
|
4
4
|
|
|
@@ -10,7 +10,7 @@ import "react";
|
|
|
10
10
|
|
|
11
11
|
import "../../chunks/misc-N8KLjOXc.mjs";
|
|
12
12
|
|
|
13
|
-
import "../../chunks/Icon-
|
|
13
|
+
import "../../chunks/Icon-CUSQtytG.mjs";
|
|
14
14
|
|
|
15
15
|
import "../../hooks/useTheme.mjs";
|
|
16
16
|
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { C as Chip } from "../../chunks/Chip-
|
|
1
|
+
export { C as Chip } from "../../chunks/Chip-DdgYV-Ct.mjs";
|
|
2
2
|
|
|
3
3
|
import "../../chunks/tslib.es6-c-7TIv71.mjs";
|
|
4
4
|
|
|
@@ -8,7 +8,7 @@ import "react";
|
|
|
8
8
|
|
|
9
9
|
import "../../chunks/misc-N8KLjOXc.mjs";
|
|
10
10
|
|
|
11
|
-
import "../../chunks/Icon-
|
|
11
|
+
import "../../chunks/Icon-CUSQtytG.mjs";
|
|
12
12
|
|
|
13
13
|
import "../../hooks/useTheme.mjs";
|
|
14
14
|
|