forstok-ui-lib 5.13.10 → 5.13.12
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/index.js +16 -11
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +16 -11
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
- package/src/assets/stylesheets/shares.styles.ts +16 -13
- package/src/components/button/styles.ts +1 -0
package/dist/index.js
CHANGED
|
@@ -1002,10 +1002,18 @@
|
|
|
1002
1002
|
border: 1px solid var(--ck-clr-ln);
|
|
1003
1003
|
cursor: pointer;
|
|
1004
1004
|
border-radius: var(--ter-rd);
|
|
1005
|
+
box-shadow: none;
|
|
1006
|
+
${D}
|
|
1007
|
+
&:hover {
|
|
1008
|
+
${P}
|
|
1009
|
+
}
|
|
1010
|
+
&:active {
|
|
1011
|
+
${N}
|
|
1012
|
+
}
|
|
1005
1013
|
i {
|
|
1006
1014
|
margin-top: -3px;
|
|
1007
1015
|
}
|
|
1008
|
-
${({$activated:e,$disabled:t})=>{let n="";return e?n
|
|
1016
|
+
${({$activated:e,$disabled:t})=>{let n="";return e?n+=`\n ${N}\n `:t&&(n+="\n background: var(--mt-clr-bg);\n border-color: var(--ck-clr-ln);\n opacity: .5;\n cursor: auto;\n "),n}}
|
|
1009
1017
|
`,lt=o.default.span`
|
|
1010
1018
|
font-size: 12px;
|
|
1011
1019
|
text-align: center;
|
|
@@ -1063,8 +1071,7 @@
|
|
|
1063
1071
|
grid-template-columns: 148px 1fr;
|
|
1064
1072
|
position: relative;
|
|
1065
1073
|
width: 100%;
|
|
1066
|
-
|
|
1067
|
-
background-color: var(--ter-clr-bg);
|
|
1074
|
+
${D}
|
|
1068
1075
|
i {
|
|
1069
1076
|
position: absolute;
|
|
1070
1077
|
top: 50%;
|
|
@@ -1074,7 +1081,7 @@
|
|
|
1074
1081
|
}
|
|
1075
1082
|
input {
|
|
1076
1083
|
padding-right: 30px;
|
|
1077
|
-
padding-left:
|
|
1084
|
+
padding-left: 8px;
|
|
1078
1085
|
&::placeholder {
|
|
1079
1086
|
font-style: normal;
|
|
1080
1087
|
}
|
|
@@ -1082,9 +1089,7 @@
|
|
|
1082
1089
|
button {
|
|
1083
1090
|
width: 148px;
|
|
1084
1091
|
padding: 6px 23px 6px 12px;
|
|
1085
|
-
|
|
1086
|
-
._refContainer {
|
|
1087
|
-
border-right: 1px solid var(--sec-clr-ln);
|
|
1092
|
+
border-radius: .5rem 0 0 .5rem;
|
|
1088
1093
|
}
|
|
1089
1094
|
@media only screen and (min-width: 1280px) {
|
|
1090
1095
|
width: 350px;
|
|
@@ -1097,14 +1102,14 @@
|
|
|
1097
1102
|
position: relative;
|
|
1098
1103
|
display: grid;
|
|
1099
1104
|
grid-auto-flow: column;
|
|
1100
|
-
|
|
1101
|
-
|
|
1102
|
-
background-color: var(--ter-clr-bg);
|
|
1105
|
+
overflow: hidden;
|
|
1106
|
+
${D}
|
|
1103
1107
|
> button {
|
|
1104
1108
|
width: auto;
|
|
1105
1109
|
min-width: auto;
|
|
1106
1110
|
border-radius: 0;
|
|
1107
1111
|
color: var(--mt-clr);
|
|
1112
|
+
padding: 0 12px;
|
|
1108
1113
|
}
|
|
1109
1114
|
> button ,
|
|
1110
1115
|
._refContainer {
|
|
@@ -1889,7 +1894,7 @@
|
|
|
1889
1894
|
top: 50%;
|
|
1890
1895
|
margin-top: -8px;
|
|
1891
1896
|
}
|
|
1892
|
-
${({$mode:e,$isIndicatorArrow:t,$isShown:n,$isLoading:r,$activated:a,$size:i,disabled:o,$iconLeft:s})=>{let l="";return n?(i&&("xsmall"===i?l+="\n font-size: 12px;\n height: 20px;\n padding: 0 8px;\n ":"small"===i?l+="\n font-size: 13px;\n height: 28px;\n min-width: 75px;\n ":"medium"===i&&(l+="\n height: 32px;\n ")),"red"===e?l+=`\n color: var(--act-clr);\n background-color: var(--act-clr-bg);\n box-shadow: none;\n &:hover {\n color: var(--act-clr_hvr);\n background-color: var(--act-clr-bg__hvr);\n }\n & ${pn} {\n fill: #ffffff;\n stroke: #ffffff;\n }\n `:"green"===e?l+=`\n color: var(--act-clr);\n background-color: rgb(33, 186, 69);\n &:hover {\n background-color: #06402B);\n }\n & ${pn} {\n fill: #ffffff;\n stroke: #ffffff;\n }\n `:"white"===e?l+="\n color: var(--mt-clr);\n background-color: var(--cl-clr-bg);\n &:hover { \n background-color: var(--cl-clr-bg__hvr);\n } \n ":"blue"===e?l+=`\n &, &:hover {\n background-color: var(--ck-clr-bg__act);\n color: var(--act-clr);\n }\n & ${pn} {\n fill: #ffffff;\n stroke: #ffffff;\n }\n `:"clearL"===e?l+="\n width: auto;\n height: auto;\n text-decoration: none;\n padding: 0;\n margin: 0;\n &, \n &:hover, \n &:active { \n background-color: transparent; \n color: var(--pri-clr-lnk__hvr);\n box-shadow: none;\n }\n &:hover {\n opacity: .9;\n }\n ":"clearB"===e?l+=`\n background-color: var(--cl-clr-bg);\n color: var(--pri-clr-lnk__hvr);\n &:disabled {\n span {color: var(--mt-clr);}\n }\n & ${pn} {\n width: 14px;\n height: 14px;\n margin-top: -7px;\n }\n svg {\n fill: var(--pri-clr-lnk__hvr);\n stroke: var(--pri-clr-lnk__hvr);\n }\n `:"clear"===e?(l+="\n box-shadow: none !important;\n &, &:hover { \n background-color: transparent; \n }\n ",a&&(l+="\n color: var(--pri-clr) !important;\n font-weight: 600;\n ")):"more"===e?l+=`\n padding: 8px;\n background-color: var(--mt-clr-bg__fc);\n &:before { \n content: url('https://forstok-staging-storage.s3.ap-southeast-1.amazonaws.com/public/frontend/icons/dotted.svg');\n height: 14px;\n width: 14px;\n ${un}\n }\n `:"round-close"===e?l+=`\n background-color: transparent;\n &:before { \n content: url('https://forstok-staging-storage.s3.ap-southeast-1.amazonaws.com/public/frontend/icons/close.svg');\n width: 12px;\n ${un}\n } \n `:"small-white-round-close"===e?l+=`\n &, \n &:hover, \n &:active {\n background-color: transparent;\n box-shadow: none;\n }\n &:before { \n content: url('https://forstok-staging-storage.s3.ap-southeast-1.amazonaws.com/public/frontend/icons/close-white.svg');\n width: 8px;\n ${un}\n } \n `:"page-option"===e&&(l+=`\n font-weight: 600;\n cursor: pointer;\n padding: 6px 12px;\n height: 28px;\n & ${pn} {\n width: 14px;\n height: 14px;\n margin-top: -7px;\n }\n `),o&&(l+="\n &, \n &:hover {\n background-color: rgba(0, 0, 0, .17) !important;\n box-shadow: none !important;\n cursor: default;\n color: var(--sec-clr);\n }\n "),s&&(l+=" padding-left: 35px; ","export"===s?l+=`\n &:before { \n content: url('https://forstok-staging-storage.s3.ap-southeast-1.amazonaws.com/public/frontend/icons/arrow-download.svg'); \n position: absolute;\n left: 12px;\n top: 7px;\n width: 14px;\n ${un}\n }\n `:"import"===s?l+=`\n &:before { \n content: url('https://forstok-staging-storage.s3.ap-southeast-1.amazonaws.com/public/frontend/icons/arrow-white-upload.svg'); \n position: absolute;\n left: 50%;\n top: 8px;\n width: 1rem;\n margin-left: -8px;\n ${un}\n }\n `:"filter"===s?l+="\n &:before { \n content: url('https://forstok-staging-storage.s3.ap-southeast-1.amazonaws.com/public/frontend/icons/filter.svg'); \n position: absolute;\n left: 12px;\n top: 50%;\n margin-top: -8px;\n width: 14px;\n height: 16px;\n }\n ":"calendar"===s?l+="\n &:before { \n content: url('https://forstok-staging-storage.s3.ap-southeast-1.amazonaws.com/public/frontend/icons/calendar.svg'); \n position: absolute;\n left: 12px;\n top: 50%;\n margin-top: -8px;\n width: 14px;\n height: 16px;\n }\n ":"add"===s&&(l+="\n &:before { \n content: '+'; \n color: #118EC5;\n position: absolute;\n left: 12px;\n top: 7px;\n width: 14px;\n height: 16px;\n font-size: 16px;\n }\n ")),t&&(l+=" \n padding-right: 25px; \n "),r&&(l+=" \n padding-right: 30px !important; \n "),l):"display:none;"}}
|
|
1897
|
+
${({$mode:e,$isIndicatorArrow:t,$isShown:n,$isLoading:r,$activated:a,$size:i,disabled:o,$iconLeft:s})=>{let l="";return n?(i&&("xsmall"===i?l+="\n font-size: 12px;\n height: 20px;\n padding: 0 8px;\n ":"small"===i?l+="\n font-size: 13px;\n height: 28px;\n min-width: 75px;\n ":"medium"===i&&(l+="\n height: 32px;\n ")),"red"===e?l+=`\n color: var(--act-clr);\n background-color: var(--act-clr-bg);\n box-shadow: none;\n &:hover {\n color: var(--act-clr_hvr);\n background-color: var(--act-clr-bg__hvr);\n }\n & ${pn} {\n fill: #ffffff;\n stroke: #ffffff;\n }\n `:"green"===e?l+=`\n color: var(--act-clr);\n background-color: rgb(33, 186, 69);\n &:hover {\n background-color: #06402B);\n }\n & ${pn} {\n fill: #ffffff;\n stroke: #ffffff;\n }\n `:"white"===e?l+="\n color: var(--mt-clr);\n background-color: var(--cl-clr-bg);\n &:hover { \n background-color: var(--cl-clr-bg__hvr);\n } \n ":"blue"===e?l+=`\n &, &:hover {\n background-color: var(--ck-clr-bg__act);\n color: var(--act-clr);\n }\n & ${pn} {\n fill: #ffffff;\n stroke: #ffffff;\n }\n `:"clearL"===e?l+="\n width: auto;\n height: auto;\n text-decoration: none;\n padding: 0;\n margin: 0;\n &, \n &:hover, \n &:active { \n background-color: transparent; \n color: var(--pri-clr-lnk__hvr);\n box-shadow: none;\n }\n &:hover {\n opacity: .9;\n }\n ":"clearB"===e?l+=`\n background-color: var(--cl-clr-bg);\n color: var(--pri-clr-lnk__hvr);\n &:disabled {\n span {color: var(--mt-clr);}\n }\n & ${pn} {\n width: 14px;\n height: 14px;\n margin-top: -7px;\n }\n svg {\n fill: var(--pri-clr-lnk__hvr);\n stroke: var(--pri-clr-lnk__hvr);\n }\n `:"clear"===e?(l+="\n box-shadow: none !important;\n &, &:hover { \n background-color: transparent; \n }\n ",a&&(l+="\n color: var(--pri-clr) !important;\n font-weight: 600;\n ")):"more"===e?l+=`\n padding: 8px;\n background-color: var(--mt-clr-bg__fc);\n &:before { \n content: url('https://forstok-staging-storage.s3.ap-southeast-1.amazonaws.com/public/frontend/icons/dotted.svg');\n height: 14px;\n width: 14px;\n ${un}\n }\n `:"round-close"===e?l+=`\n background-color: transparent;\n box-shadow: none;\n &:before { \n content: url('https://forstok-staging-storage.s3.ap-southeast-1.amazonaws.com/public/frontend/icons/close.svg');\n width: 12px;\n ${un}\n } \n `:"small-white-round-close"===e?l+=`\n &, \n &:hover, \n &:active {\n background-color: transparent;\n box-shadow: none;\n }\n &:before { \n content: url('https://forstok-staging-storage.s3.ap-southeast-1.amazonaws.com/public/frontend/icons/close-white.svg');\n width: 8px;\n ${un}\n } \n `:"page-option"===e&&(l+=`\n font-weight: 600;\n cursor: pointer;\n padding: 6px 12px;\n height: 28px;\n & ${pn} {\n width: 14px;\n height: 14px;\n margin-top: -7px;\n }\n `),o&&(l+="\n &, \n &:hover {\n background-color: rgba(0, 0, 0, .17) !important;\n box-shadow: none !important;\n cursor: default;\n color: var(--sec-clr);\n }\n "),s&&(l+=" padding-left: 35px; ","export"===s?l+=`\n &:before { \n content: url('https://forstok-staging-storage.s3.ap-southeast-1.amazonaws.com/public/frontend/icons/arrow-download.svg'); \n position: absolute;\n left: 12px;\n top: 7px;\n width: 14px;\n ${un}\n }\n `:"import"===s?l+=`\n &:before { \n content: url('https://forstok-staging-storage.s3.ap-southeast-1.amazonaws.com/public/frontend/icons/arrow-white-upload.svg'); \n position: absolute;\n left: 50%;\n top: 8px;\n width: 1rem;\n margin-left: -8px;\n ${un}\n }\n `:"filter"===s?l+="\n &:before { \n content: url('https://forstok-staging-storage.s3.ap-southeast-1.amazonaws.com/public/frontend/icons/filter.svg'); \n position: absolute;\n left: 12px;\n top: 50%;\n margin-top: -8px;\n width: 14px;\n height: 16px;\n }\n ":"calendar"===s?l+="\n &:before { \n content: url('https://forstok-staging-storage.s3.ap-southeast-1.amazonaws.com/public/frontend/icons/calendar.svg'); \n position: absolute;\n left: 12px;\n top: 50%;\n margin-top: -8px;\n width: 14px;\n height: 16px;\n }\n ":"add"===s&&(l+="\n &:before { \n content: '+'; \n color: #118EC5;\n position: absolute;\n left: 12px;\n top: 7px;\n width: 14px;\n height: 16px;\n font-size: 16px;\n }\n ")),t&&(l+=" \n padding-right: 25px; \n "),r&&(l+=" \n padding-right: 30px !important; \n "),l):"display:none;"}}
|
|
1893
1898
|
|
|
1894
1899
|
`,pn=o.default.svg`
|
|
1895
1900
|
display: inline-block;
|