zcomponents-ui 1.1.3 → 1.1.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/dist/{index.cjs.css → zcomponents-ui.css} +1 -1
  2. package/dist/zcomponents-ui.css.map +1 -0
  3. package/package.json +3 -2
  4. package/dist/index.cjs.css.map +0 -1
  5. package/dist/index.esm.css +0 -2
  6. package/dist/index.esm.css.map +0 -1
package/dist/{index.cjs.css → zcomponents-ui.css} RENAMED
@@ -1,2 +1,2 @@
1
1
  :root{--zd-color-primary:#676767;--zd-color-primary-transp:#67676775;--zd-color-secondary:#0079bd;--zd-color-secondary-transp:#0079bd50;--zd-color-disabled:#ddd;--zd-color-error:#ff4d4f;--zd-color-error-transp:#ffe6e6;--zd-color-background-transp:#ffffffdd;--zd-font-family:Helvetica,Arial,sans-serif;--zd-font-size:14px;--zd-radius:3px;--zd-border:1px solid var(--zd-color-primary);--zd-focus-ring:0 0 0 0.2rem var(--zd-color-secondary-transp)}:where(.ZDrop-module_container__FMb26) *{box-sizing:border-box;margin:0;padding:0}:where(.ZDrop-module_container__FMb26){font-family:var(--zd-font-family);font-size:var(--zd-font-size);height:-moz-fit-content;height:fit-content;max-height:-moz-fit-content;max-height:fit-content;max-width:500px;min-width:200px;position:relative;width:-moz-fit-content;width:fit-content}:where(.ZDrop-module_label__WDDr6){color:var(--zd-color-primary);display:block;margin:0 0 5px 10px}:where(.ZDrop-module_inputField__QPEyq){border:var(--zd-border);border-radius:var(--zd-radius);display:flex;min-height:35px;overflow-y:auto;padding-left:10px;position:relative;transition:border .15s ease-in-out,box-shadow .15s ease-in-out}:where(.ZDrop-module_inputField__QPEyq)>input{cursor:pointer}:where(.ZDrop-module_inputField__QPEyq):hover{border-color:var(--zd-color-secondary)}:where(.ZDrop-module_inputField__QPEyq):focus-within{border-color:var(--zd-color-secondary);box-shadow:var(--zd-focus-ring)}:where(.ZDrop-module_inputField__QPEyq):focus-within>input{cursor:text}:where(.ZDrop-module_inputField--multiple__ceTgA){padding-left:4px}:where(.ZDrop-module_inputField--disabled__Iocv1){background:var(--zd-color-disabled);cursor:default;pointer-events:none}:where(.ZDrop-module_input__k-MBA){background:transparent;border:none;border-radius:var(--zd-radius);color:var(--zd-color-primary);min-height:100%;padding-right:10px;width:100%}:where(.ZDrop-module_input__k-MBA):focus{outline:none}:where(.ZDrop-module_input__k-MBA):disabled{background:var(--zd-color-disabled)}:where(.ZDrop-module_input__k-MBA)::-moz-placeholder{color:var(--zd-color-primary-transp)}:where(.ZDrop-module_input__k-MBA)::placeholder{color:var(--zd-color-primary-transp)}:where(.ZDrop-module_inputSingle__zZmCf){align-items:center;display:flex;height:auto;max-width:100%;min-height:35px;overflow:hidden;white-space:nowrap}:where(.ZDrop-module_inputSingleValue__pV1vr){border:var(--zd-border);border-radius:var(--zd-radius);height:100%;width:-moz-fit-content;width:fit-content}:where(.ZDrop-module_inputSingleValueRenderer__hQSCH){align-items:center;display:flex}:where(.ZDrop-module_inputSingleSearch__oIk6K){align-items:center;background:transparent;border:none;color:var(--zd-color-primary);display:flex;flex:1;line-height:35px;max-width:100%;min-height:35px;overflow:hidden;white-space:nowrap}:where(.ZDrop-module_inputSingleSearch__oIk6K):focus{outline:none}:where(.ZDrop-module_inputMultiple__oF9wt){align-items:center;display:flex;flex-wrap:wrap;height:auto;list-style:none;margin-right:5px;max-width:calc(100% - 47px)}:where(.ZDrop-module_inputMultipleValue__lSYME){align-items:center;background:var(--zd-color-disabled);border-radius:var(--zd-radius);color:var(--zd-color-primary);cursor:pointer;display:flex;margin:2px;min-width:-moz-fit-content;min-width:fit-content;padding:3px 6px;width:-moz-fit-content;width:fit-content}:where(.ZDrop-module_inputMultipleValue__lSYME) span{display:flex;min-width:-moz-fit-content;min-width:fit-content;white-space:nowrap;width:-moz-fit-content;width:fit-content}:where(.ZDrop-module_inputMultipleValueRemoveBtn__gbFkS){align-items:center;background:transparent;border:none;cursor:pointer;display:flex;justify-content:center;margin-left:3px;min-width:10px;position:relative;width:10px}:where(.ZDrop-module_inputMultipleValueRemoveBtn__gbFkS):focus{outline:none}:where(.ZDrop-module_inputMultipleValueRemoveBtnIcon__i4VBS){align-items:center;display:flex;height:10px;justify-content:center;position:relative;width:10px}:where(.ZDrop-module_inputMultipleValueRemoveBtnIcon__i4VBS):after,:where(.ZDrop-module_inputMultipleValueRemoveBtnIcon__i4VBS):before{background-color:var(--zd-color-primary);content:"";height:10px;position:absolute;width:2px}:where(.ZDrop-module_inputMultipleValueRemoveBtnIcon__i4VBS):before{transform:rotate(45deg)}:where(.ZDrop-module_inputMultipleValueRemoveBtnIcon__i4VBS):after{transform:rotate(-45deg)}:where(.ZDrop-module_inputMultipleValueRemoveBtn__gbFkS):focus>.ZDrop-module_inputMultipleValueRemoveBtnIcon__i4VBS:after,:where(.ZDrop-module_inputMultipleValueRemoveBtn__gbFkS):focus>.ZDrop-module_inputMultipleValueRemoveBtnIcon__i4VBS:before,:where(.ZDrop-module_inputMultipleValueRemoveBtn__gbFkS):hover>.ZDrop-module_inputMultipleValueRemoveBtnIcon__i4VBS:after,:where(.ZDrop-module_inputMultipleValueRemoveBtn__gbFkS):hover>.ZDrop-module_inputMultipleValueRemoveBtnIcon__i4VBS:before{background-color:var(--zd-color-secondary)}:where(.ZDrop-module_inputMultipleSearchWrapper__vmS7x){flex:auto;min-width:100%}:where(.ZDrop-module_inputMultipleSearch__-lQrC){background:transparent;border:none;color:var(--zd-color-primary);min-width:40px;padding:3px;width:100%}:where(.ZDrop-module_inputMultipleSearch__-lQrC):focus{outline:none}:where(.ZDrop-module_inputMultiplePlaceholder__GbBo7){padding-left:6px}:where(.ZDrop-module_inputClearBtnWrapper__S3uiC){align-items:center;display:flex;justify-content:center;position:relative}:where(.ZDrop-module_inputClearBtn__JY5Gm){background:none;border:none;max-height:-moz-fit-content;max-height:fit-content}:where(.ZDrop-module_inputClearBtnIcon__PXRiJ){cursor:pointer;display:block;height:15px;max-width:14px;min-width:14px;position:relative}:where(.ZDrop-module_inputClearBtnIcon__PXRiJ):after,:where(.ZDrop-module_inputClearBtnIcon__PXRiJ):before{background:var(--zd-color-primary);content:"";height:15px;left:6px;position:absolute;width:2px}:where(.ZDrop-module_inputClearBtnIcon__PXRiJ):before{transform:rotate(45deg)}:where(.ZDrop-module_inputClearBtnIcon__PXRiJ):after{transform:rotate(-45deg)}:where(.ZDrop-module_inputClearBtnIcon__PXRiJ:hover):after,:where(.ZDrop-module_inputClearBtnIcon__PXRiJ:hover):before{background:var(--zd-color-secondary)}:where(.ZDrop-module_expandToggle__zJYI1){align-items:center;display:flex;min-width:-moz-fit-content;min-width:fit-content;padding:0 10px}:where(.ZDrop-module_expandToggleIcon__63Yog){border:solid var(--zd-color-primary);border-width:0 2px 2px 0;cursor:pointer;padding:4px;transform:rotate(135deg);transition:.3s}:where(.ZDrop-module_expandToggleIcon--active__h2I5u){color:var(--zd-color-secondary);transform:translateY(-30%) rotate(45deg)}:where(.ZDrop-module_expandToggleIcon__63Yog):hover{border-color:var(--zd-color-secondary)}:where(.ZDrop-module_listWrapper__FGHRj){min-width:100%;position:absolute;z-index:2}:where(.ZDrop-module_list__162r4){border:var(--zd-border);border-radius:var(--zd-radius);margin-top:5px;max-height:100%;overflow:auto;position:absolute;width:100%;z-index:2}:where(.ZDrop-module_option__ZfKFl,.ZDrop-module_noData__-70Uu){color:var(--zd-color-primary);list-style:none;padding:10px 8px}:where(.ZDrop-module_option__ZfKFl){cursor:pointer}:where(.ZDrop-module_option__ZfKFl):focus{background:var(--zd-color-secondary-transp);outline:none}:where(.ZDrop-module_option__ZfKFl):hover{font-weight:700}:where(.ZDrop-module_option--active__OXcv5){color:var(--zd-color-secondary)}:where(.ZDrop-module_errorMessage__8YOT7){background:var(--zd-color-error-transp);border:1px solid var(--zd-color-error);border-radius:var(--zd-radius);color:var(--zd-color-error);margin-top:5px;padding:8px}
2
- /*# sourceMappingURL=index.cjs.css.map */
2
+ /*# sourceMappingURL=zcomponents-ui.css.map */
package/dist/zcomponents-ui.css.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["ZDrop.module.scss"],"names":[],"mappings":"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","file":"zcomponents-ui.css","sourcesContent":["@charset \"UTF-8\";\n/* ZDrop.module.scss — „override-friendly” */\n:global(:root) {\n --zd-color-primary: #676767;\n --zd-color-primary-transp: #67676775;\n --zd-color-secondary: #0079bd;\n --zd-color-secondary-transp: #0079bd50;\n --zd-color-disabled: #ddd;\n --zd-color-error: #ff4d4f;\n --zd-color-error-transp: #ffe6e6;\n --zd-color-background-transp: #ffffffdd;\n --zd-font-family: Helvetica, Arial, sans-serif;\n --zd-font-size: 14px;\n --zd-radius: 3px;\n --zd-border: 1px solid var(--zd-color-primary);\n --zd-focus-ring: 0 0 0 0.2rem var(--zd-color-secondary-transp);\n}\n\n:where(.container) * {\n padding: 0;\n margin: 0;\n box-sizing: border-box;\n}\n\n:where(.container) {\n position: relative;\n width: fit-content;\n max-width: 500px;\n min-width: 200px;\n height: fit-content;\n max-height: fit-content;\n font-family: var(--zd-font-family);\n font-size: var(--zd-font-size);\n}\n\n:where(.label) {\n display: block;\n margin: 0 0 5px 10px;\n color: var(--zd-color-primary);\n}\n\n:where(.inputField) {\n position: relative;\n display: flex;\n min-height: 35px;\n border: var(--zd-border);\n border-radius: var(--zd-radius);\n padding-left: 10px;\n overflow-y: auto;\n transition: border 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n}\n\n:where(.inputField) > input {\n cursor: pointer;\n}\n\n:where(.inputField):hover {\n border-color: var(--zd-color-secondary);\n}\n\n:where(.inputField):focus-within {\n border-color: var(--zd-color-secondary);\n box-shadow: var(--zd-focus-ring);\n}\n\n:where(.inputField):focus-within > input {\n cursor: text;\n}\n\n:where(.inputField--multiple) {\n padding-left: 4px;\n}\n\n:where(.inputField--disabled) {\n background: var(--zd-color-disabled);\n cursor: default;\n pointer-events: none;\n}\n\n:where(.input) {\n width: 100%;\n min-height: 100%;\n padding-right: 10px;\n border: none;\n border-radius: var(--zd-radius);\n color: var(--zd-color-primary);\n background: transparent;\n}\n\n:where(.input):focus {\n outline: none;\n}\n\n:where(.input):disabled {\n background: var(--zd-color-disabled);\n}\n\n:where(.input)::placeholder {\n color: var(--zd-color-primary-transp);\n}\n\n:where(.inputSingle) {\n display: flex;\n align-items: center;\n max-width: 100%;\n min-height: 35px;\n white-space: nowrap;\n overflow: hidden;\n height: auto;\n}\n\n:where(.inputSingleValue) {\n width: fit-content;\n height: 100%;\n border: var(--zd-border);\n border-radius: var(--zd-radius);\n}\n\n:where(.inputSingleValueRenderer) {\n display: flex;\n align-items: center;\n}\n\n:where(.inputSingleSearch) {\n display: flex;\n align-items: center;\n flex: 1;\n max-width: 100%;\n min-height: 35px;\n line-height: 35px;\n overflow: hidden;\n white-space: nowrap;\n color: var(--zd-color-primary);\n border: none;\n background: transparent;\n}\n\n:where(.inputSingleSearch):focus {\n outline: none;\n}\n\n:where(.inputMultiple) {\n display: flex;\n flex-wrap: wrap;\n max-width: calc(100% - 47px);\n align-items: center;\n margin-right: 5px;\n list-style: none;\n height: auto;\n}\n\n:where(.inputMultipleValue) {\n display: flex;\n align-items: center;\n width: fit-content;\n min-width: fit-content;\n margin: 2px;\n padding: 3px 6px;\n color: var(--zd-color-primary);\n border-radius: var(--zd-radius);\n background: var(--zd-color-disabled);\n cursor: pointer;\n}\n:where(.inputMultipleValue) span {\n display: flex;\n width: fit-content;\n min-width: fit-content;\n white-space: nowrap;\n}\n\n:where(.inputMultipleValueRemoveBtn) {\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 10px;\n min-width: 10px;\n margin-left: 3px;\n background: transparent;\n border: none;\n cursor: pointer;\n}\n\n:where(.inputMultipleValueRemoveBtn):focus {\n outline: none;\n}\n\n:where(.inputMultipleValueRemoveBtnIcon) {\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n width: 10px;\n height: 10px;\n}\n\n:where(.inputMultipleValueRemoveBtnIcon)::before,\n:where(.inputMultipleValueRemoveBtnIcon)::after {\n position: absolute;\n content: \"\";\n height: 10px;\n width: 2px;\n background-color: var(--zd-color-primary);\n}\n\n:where(.inputMultipleValueRemoveBtnIcon)::before {\n transform: rotate(45deg);\n}\n\n:where(.inputMultipleValueRemoveBtnIcon)::after {\n transform: rotate(-45deg);\n}\n\n:where(.inputMultipleValueRemoveBtn):hover > .inputMultipleValueRemoveBtnIcon::before,\n:where(.inputMultipleValueRemoveBtn):hover > .inputMultipleValueRemoveBtnIcon::after,\n:where(.inputMultipleValueRemoveBtn):focus > .inputMultipleValueRemoveBtnIcon::after,\n:where(.inputMultipleValueRemoveBtn):focus > .inputMultipleValueRemoveBtnIcon::before {\n background-color: var(--zd-color-secondary);\n}\n\n:where(.inputMultipleSearchWrapper) {\n min-width: 100%;\n flex: auto;\n}\n\n:where(.inputMultipleSearch) {\n min-width: 40px;\n width: 100%;\n padding: 3px;\n color: var(--zd-color-primary);\n border: none;\n background: transparent;\n}\n\n:where(.inputMultipleSearch):focus {\n outline: none;\n}\n\n:where(.inputMultiplePlaceholder) {\n padding-left: 6px;\n}\n\n:where(.inputClearBtnWrapper) {\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n:where(.inputClearBtn) {\n max-height: fit-content;\n background: none;\n border: none;\n}\n\n:where(.inputClearBtnIcon) {\n display: block;\n position: relative;\n min-width: 14px;\n max-width: 14px;\n height: 15px;\n cursor: pointer;\n}\n\n:where(.inputClearBtnIcon)::before,\n:where(.inputClearBtnIcon)::after {\n position: absolute;\n left: 6px;\n content: \"\";\n height: 15px;\n width: 2px;\n background: var(--zd-color-primary);\n}\n\n:where(.inputClearBtnIcon)::before {\n transform: rotate(45deg);\n}\n\n:where(.inputClearBtnIcon)::after {\n transform: rotate(-45deg);\n}\n\n:where(.inputClearBtnIcon:hover)::before,\n:where(.inputClearBtnIcon:hover)::after {\n background: var(--zd-color-secondary);\n}\n\n:where(.expandToggle) {\n display: flex;\n min-width: fit-content;\n align-items: center;\n padding: 0 10px;\n}\n\n:where(.expandToggleIcon) {\n transform: rotate(135deg);\n border: solid var(--zd-color-primary);\n border-width: 0 2px 2px 0;\n padding: 4px;\n cursor: pointer;\n transition: 0.3s;\n}\n\n:where(.expandToggleIcon--active) {\n transform: translateY(-30%) rotate(45deg);\n color: var(--zd-color-secondary);\n}\n\n:where(.expandToggleIcon):hover {\n border-color: var(--zd-color-secondary);\n}\n\n:where(.listWrapper) {\n position: absolute;\n z-index: 2;\n min-width: 100%;\n}\n\n:where(.list) {\n position: absolute;\n z-index: 2;\n width: 100%;\n max-height: 100%;\n margin-top: 5px;\n border-radius: var(--zd-radius);\n border: var(--zd-border);\n overflow: auto;\n}\n\n:where(.option, .noData) {\n padding: 10px 8px;\n color: var(--zd-color-primary);\n list-style: none;\n}\n\n:where(.option) {\n cursor: pointer;\n}\n\n:where(.option):focus {\n outline: none;\n background: var(--zd-color-secondary-transp);\n}\n\n:where(.option):hover {\n font-weight: 700;\n}\n\n:where(.option--active) {\n color: var(--zd-color-secondary);\n}\n\n:where(.errorMessage) {\n margin-top: 5px;\n padding: 8px;\n color: var(--zd-color-error);\n border: 1px solid var(--zd-color-error);\n border-radius: var(--zd-radius);\n background: var(--zd-color-error-transp);\n}"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "zcomponents-ui",
3
- "version": "1.1.3",
3
+ "version": "1.1.4",
4
4
  "description": "Customizable React dropdown component (TypeScript + SCSS Modules).",
5
5
  "author": "Piotr Nowosławski",
6
6
  "license": "MIT",
@@ -18,7 +18,8 @@
18
18
  "types": "./dist/react-hook-form.d.ts",
19
19
  "import": "./dist/react-hook-form.esm.js",
20
20
  "require": "./dist/react-hook-form.cjs.js"
21
- }
21
+ },
22
+ "./styles.css": "./dist/zcomponents-ui.css"
22
23
  },
23
24
  "files": [
24
25
  "dist/**/*",
package/dist/index.cjs.css.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"sources":["ZDrop.module.scss"],"names":[],"mappings":"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","file":"index.cjs.css","sourcesContent":["@charset \"UTF-8\";\n/* ZDrop.module.scss — „override-friendly” */\n:global(:root) {\n --zd-color-primary: #676767;\n --zd-color-primary-transp: #67676775;\n --zd-color-secondary: #0079bd;\n --zd-color-secondary-transp: #0079bd50;\n --zd-color-disabled: #ddd;\n --zd-color-error: #ff4d4f;\n --zd-color-error-transp: #ffe6e6;\n --zd-color-background-transp: #ffffffdd;\n --zd-font-family: Helvetica, Arial, sans-serif;\n --zd-font-size: 14px;\n --zd-radius: 3px;\n --zd-border: 1px solid var(--zd-color-primary);\n --zd-focus-ring: 0 0 0 0.2rem var(--zd-color-secondary-transp);\n}\n\n:where(.container) * {\n padding: 0;\n margin: 0;\n box-sizing: border-box;\n}\n\n:where(.container) {\n position: relative;\n width: fit-content;\n max-width: 500px;\n min-width: 200px;\n height: fit-content;\n max-height: fit-content;\n font-family: var(--zd-font-family);\n font-size: var(--zd-font-size);\n}\n\n:where(.label) {\n display: block;\n margin: 0 0 5px 10px;\n color: var(--zd-color-primary);\n}\n\n:where(.inputField) {\n position: relative;\n display: flex;\n min-height: 35px;\n border: var(--zd-border);\n border-radius: var(--zd-radius);\n padding-left: 10px;\n overflow-y: auto;\n transition: border 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n}\n\n:where(.inputField) > input {\n cursor: pointer;\n}\n\n:where(.inputField):hover {\n border-color: var(--zd-color-secondary);\n}\n\n:where(.inputField):focus-within {\n border-color: var(--zd-color-secondary);\n box-shadow: var(--zd-focus-ring);\n}\n\n:where(.inputField):focus-within > input {\n cursor: text;\n}\n\n:where(.inputField--multiple) {\n padding-left: 4px;\n}\n\n:where(.inputField--disabled) {\n background: var(--zd-color-disabled);\n cursor: default;\n pointer-events: none;\n}\n\n:where(.input) {\n width: 100%;\n min-height: 100%;\n padding-right: 10px;\n border: none;\n border-radius: var(--zd-radius);\n color: var(--zd-color-primary);\n background: transparent;\n}\n\n:where(.input):focus {\n outline: none;\n}\n\n:where(.input):disabled {\n background: var(--zd-color-disabled);\n}\n\n:where(.input)::placeholder {\n color: var(--zd-color-primary-transp);\n}\n\n:where(.inputSingle) {\n display: flex;\n align-items: center;\n max-width: 100%;\n min-height: 35px;\n white-space: nowrap;\n overflow: hidden;\n height: auto;\n}\n\n:where(.inputSingleValue) {\n width: fit-content;\n height: 100%;\n border: var(--zd-border);\n border-radius: var(--zd-radius);\n}\n\n:where(.inputSingleValueRenderer) {\n display: flex;\n align-items: center;\n}\n\n:where(.inputSingleSearch) {\n display: flex;\n align-items: center;\n flex: 1;\n max-width: 100%;\n min-height: 35px;\n line-height: 35px;\n overflow: hidden;\n white-space: nowrap;\n color: var(--zd-color-primary);\n border: none;\n background: transparent;\n}\n\n:where(.inputSingleSearch):focus {\n outline: none;\n}\n\n:where(.inputMultiple) {\n display: flex;\n flex-wrap: wrap;\n max-width: calc(100% - 47px);\n align-items: center;\n margin-right: 5px;\n list-style: none;\n height: auto;\n}\n\n:where(.inputMultipleValue) {\n display: flex;\n align-items: center;\n width: fit-content;\n min-width: fit-content;\n margin: 2px;\n padding: 3px 6px;\n color: var(--zd-color-primary);\n border-radius: var(--zd-radius);\n background: var(--zd-color-disabled);\n cursor: pointer;\n}\n:where(.inputMultipleValue) span {\n display: flex;\n width: fit-content;\n min-width: fit-content;\n white-space: nowrap;\n}\n\n:where(.inputMultipleValueRemoveBtn) {\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 10px;\n min-width: 10px;\n margin-left: 3px;\n background: transparent;\n border: none;\n cursor: pointer;\n}\n\n:where(.inputMultipleValueRemoveBtn):focus {\n outline: none;\n}\n\n:where(.inputMultipleValueRemoveBtnIcon) {\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n width: 10px;\n height: 10px;\n}\n\n:where(.inputMultipleValueRemoveBtnIcon)::before,\n:where(.inputMultipleValueRemoveBtnIcon)::after {\n position: absolute;\n content: \"\";\n height: 10px;\n width: 2px;\n background-color: var(--zd-color-primary);\n}\n\n:where(.inputMultipleValueRemoveBtnIcon)::before {\n transform: rotate(45deg);\n}\n\n:where(.inputMultipleValueRemoveBtnIcon)::after {\n transform: rotate(-45deg);\n}\n\n:where(.inputMultipleValueRemoveBtn):hover > .inputMultipleValueRemoveBtnIcon::before,\n:where(.inputMultipleValueRemoveBtn):hover > .inputMultipleValueRemoveBtnIcon::after,\n:where(.inputMultipleValueRemoveBtn):focus > .inputMultipleValueRemoveBtnIcon::after,\n:where(.inputMultipleValueRemoveBtn):focus > .inputMultipleValueRemoveBtnIcon::before {\n background-color: var(--zd-color-secondary);\n}\n\n:where(.inputMultipleSearchWrapper) {\n min-width: 100%;\n flex: auto;\n}\n\n:where(.inputMultipleSearch) {\n min-width: 40px;\n width: 100%;\n padding: 3px;\n color: var(--zd-color-primary);\n border: none;\n background: transparent;\n}\n\n:where(.inputMultipleSearch):focus {\n outline: none;\n}\n\n:where(.inputMultiplePlaceholder) {\n padding-left: 6px;\n}\n\n:where(.inputClearBtnWrapper) {\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n:where(.inputClearBtn) {\n max-height: fit-content;\n background: none;\n border: none;\n}\n\n:where(.inputClearBtnIcon) {\n display: block;\n position: relative;\n min-width: 14px;\n max-width: 14px;\n height: 15px;\n cursor: pointer;\n}\n\n:where(.inputClearBtnIcon)::before,\n:where(.inputClearBtnIcon)::after {\n position: absolute;\n left: 6px;\n content: \"\";\n height: 15px;\n width: 2px;\n background: var(--zd-color-primary);\n}\n\n:where(.inputClearBtnIcon)::before {\n transform: rotate(45deg);\n}\n\n:where(.inputClearBtnIcon)::after {\n transform: rotate(-45deg);\n}\n\n:where(.inputClearBtnIcon:hover)::before,\n:where(.inputClearBtnIcon:hover)::after {\n background: var(--zd-color-secondary);\n}\n\n:where(.expandToggle) {\n display: flex;\n min-width: fit-content;\n align-items: center;\n padding: 0 10px;\n}\n\n:where(.expandToggleIcon) {\n transform: rotate(135deg);\n border: solid var(--zd-color-primary);\n border-width: 0 2px 2px 0;\n padding: 4px;\n cursor: pointer;\n transition: 0.3s;\n}\n\n:where(.expandToggleIcon--active) {\n transform: translateY(-30%) rotate(45deg);\n color: var(--zd-color-secondary);\n}\n\n:where(.expandToggleIcon):hover {\n border-color: var(--zd-color-secondary);\n}\n\n:where(.listWrapper) {\n position: absolute;\n z-index: 2;\n min-width: 100%;\n}\n\n:where(.list) {\n position: absolute;\n z-index: 2;\n width: 100%;\n max-height: 100%;\n margin-top: 5px;\n border-radius: var(--zd-radius);\n border: var(--zd-border);\n overflow: auto;\n}\n\n:where(.option, .noData) {\n padding: 10px 8px;\n color: var(--zd-color-primary);\n list-style: none;\n}\n\n:where(.option) {\n cursor: pointer;\n}\n\n:where(.option):focus {\n outline: none;\n background: var(--zd-color-secondary-transp);\n}\n\n:where(.option):hover {\n font-weight: 700;\n}\n\n:where(.option--active) {\n color: var(--zd-color-secondary);\n}\n\n:where(.errorMessage) {\n margin-top: 5px;\n padding: 8px;\n color: var(--zd-color-error);\n border: 1px solid var(--zd-color-error);\n border-radius: var(--zd-radius);\n background: var(--zd-color-error-transp);\n}"]}
package/dist/index.esm.css DELETED
@@ -1,2 +0,0 @@
1
- :root{--zd-color-primary:#676767;--zd-color-primary-transp:#67676775;--zd-color-secondary:#0079bd;--zd-color-secondary-transp:#0079bd50;--zd-color-disabled:#ddd;--zd-color-error:#ff4d4f;--zd-color-error-transp:#ffe6e6;--zd-color-background-transp:#ffffffdd;--zd-font-family:Helvetica,Arial,sans-serif;--zd-font-size:14px;--zd-radius:3px;--zd-border:1px solid var(--zd-color-primary);--zd-focus-ring:0 0 0 0.2rem var(--zd-color-secondary-transp)}:where(.ZDrop-module_container__FMb26) *{box-sizing:border-box;margin:0;padding:0}:where(.ZDrop-module_container__FMb26){font-family:var(--zd-font-family);font-size:var(--zd-font-size);height:-moz-fit-content;height:fit-content;max-height:-moz-fit-content;max-height:fit-content;max-width:500px;min-width:200px;position:relative;width:-moz-fit-content;width:fit-content}:where(.ZDrop-module_label__WDDr6){color:var(--zd-color-primary);display:block;margin:0 0 5px 10px}:where(.ZDrop-module_inputField__QPEyq){border:var(--zd-border);border-radius:var(--zd-radius);display:flex;min-height:35px;overflow-y:auto;padding-left:10px;position:relative;transition:border .15s ease-in-out,box-shadow .15s ease-in-out}:where(.ZDrop-module_inputField__QPEyq)>input{cursor:pointer}:where(.ZDrop-module_inputField__QPEyq):hover{border-color:var(--zd-color-secondary)}:where(.ZDrop-module_inputField__QPEyq):focus-within{border-color:var(--zd-color-secondary);box-shadow:var(--zd-focus-ring)}:where(.ZDrop-module_inputField__QPEyq):focus-within>input{cursor:text}:where(.ZDrop-module_inputField--multiple__ceTgA){padding-left:4px}:where(.ZDrop-module_inputField--disabled__Iocv1){background:var(--zd-color-disabled);cursor:default;pointer-events:none}:where(.ZDrop-module_input__k-MBA){background:transparent;border:none;border-radius:var(--zd-radius);color:var(--zd-color-primary);min-height:100%;padding-right:10px;width:100%}:where(.ZDrop-module_input__k-MBA):focus{outline:none}:where(.ZDrop-module_input__k-MBA):disabled{background:var(--zd-color-disabled)}:where(.ZDrop-module_input__k-MBA)::-moz-placeholder{color:var(--zd-color-primary-transp)}:where(.ZDrop-module_input__k-MBA)::placeholder{color:var(--zd-color-primary-transp)}:where(.ZDrop-module_inputSingle__zZmCf){align-items:center;display:flex;height:auto;max-width:100%;min-height:35px;overflow:hidden;white-space:nowrap}:where(.ZDrop-module_inputSingleValue__pV1vr){border:var(--zd-border);border-radius:var(--zd-radius);height:100%;width:-moz-fit-content;width:fit-content}:where(.ZDrop-module_inputSingleValueRenderer__hQSCH){align-items:center;display:flex}:where(.ZDrop-module_inputSingleSearch__oIk6K){align-items:center;background:transparent;border:none;color:var(--zd-color-primary);display:flex;flex:1;line-height:35px;max-width:100%;min-height:35px;overflow:hidden;white-space:nowrap}:where(.ZDrop-module_inputSingleSearch__oIk6K):focus{outline:none}:where(.ZDrop-module_inputMultiple__oF9wt){align-items:center;display:flex;flex-wrap:wrap;height:auto;list-style:none;margin-right:5px;max-width:calc(100% - 47px)}:where(.ZDrop-module_inputMultipleValue__lSYME){align-items:center;background:var(--zd-color-disabled);border-radius:var(--zd-radius);color:var(--zd-color-primary);cursor:pointer;display:flex;margin:2px;min-width:-moz-fit-content;min-width:fit-content;padding:3px 6px;width:-moz-fit-content;width:fit-content}:where(.ZDrop-module_inputMultipleValue__lSYME) span{display:flex;min-width:-moz-fit-content;min-width:fit-content;white-space:nowrap;width:-moz-fit-content;width:fit-content}:where(.ZDrop-module_inputMultipleValueRemoveBtn__gbFkS){align-items:center;background:transparent;border:none;cursor:pointer;display:flex;justify-content:center;margin-left:3px;min-width:10px;position:relative;width:10px}:where(.ZDrop-module_inputMultipleValueRemoveBtn__gbFkS):focus{outline:none}:where(.ZDrop-module_inputMultipleValueRemoveBtnIcon__i4VBS){align-items:center;display:flex;height:10px;justify-content:center;position:relative;width:10px}:where(.ZDrop-module_inputMultipleValueRemoveBtnIcon__i4VBS):after,:where(.ZDrop-module_inputMultipleValueRemoveBtnIcon__i4VBS):before{background-color:var(--zd-color-primary);content:"";height:10px;position:absolute;width:2px}:where(.ZDrop-module_inputMultipleValueRemoveBtnIcon__i4VBS):before{transform:rotate(45deg)}:where(.ZDrop-module_inputMultipleValueRemoveBtnIcon__i4VBS):after{transform:rotate(-45deg)}:where(.ZDrop-module_inputMultipleValueRemoveBtn__gbFkS):focus>.ZDrop-module_inputMultipleValueRemoveBtnIcon__i4VBS:after,:where(.ZDrop-module_inputMultipleValueRemoveBtn__gbFkS):focus>.ZDrop-module_inputMultipleValueRemoveBtnIcon__i4VBS:before,:where(.ZDrop-module_inputMultipleValueRemoveBtn__gbFkS):hover>.ZDrop-module_inputMultipleValueRemoveBtnIcon__i4VBS:after,:where(.ZDrop-module_inputMultipleValueRemoveBtn__gbFkS):hover>.ZDrop-module_inputMultipleValueRemoveBtnIcon__i4VBS:before{background-color:var(--zd-color-secondary)}:where(.ZDrop-module_inputMultipleSearchWrapper__vmS7x){flex:auto;min-width:100%}:where(.ZDrop-module_inputMultipleSearch__-lQrC){background:transparent;border:none;color:var(--zd-color-primary);min-width:40px;padding:3px;width:100%}:where(.ZDrop-module_inputMultipleSearch__-lQrC):focus{outline:none}:where(.ZDrop-module_inputMultiplePlaceholder__GbBo7){padding-left:6px}:where(.ZDrop-module_inputClearBtnWrapper__S3uiC){align-items:center;display:flex;justify-content:center;position:relative}:where(.ZDrop-module_inputClearBtn__JY5Gm){background:none;border:none;max-height:-moz-fit-content;max-height:fit-content}:where(.ZDrop-module_inputClearBtnIcon__PXRiJ){cursor:pointer;display:block;height:15px;max-width:14px;min-width:14px;position:relative}:where(.ZDrop-module_inputClearBtnIcon__PXRiJ):after,:where(.ZDrop-module_inputClearBtnIcon__PXRiJ):before{background:var(--zd-color-primary);content:"";height:15px;left:6px;position:absolute;width:2px}:where(.ZDrop-module_inputClearBtnIcon__PXRiJ):before{transform:rotate(45deg)}:where(.ZDrop-module_inputClearBtnIcon__PXRiJ):after{transform:rotate(-45deg)}:where(.ZDrop-module_inputClearBtnIcon__PXRiJ:hover):after,:where(.ZDrop-module_inputClearBtnIcon__PXRiJ:hover):before{background:var(--zd-color-secondary)}:where(.ZDrop-module_expandToggle__zJYI1){align-items:center;display:flex;min-width:-moz-fit-content;min-width:fit-content;padding:0 10px}:where(.ZDrop-module_expandToggleIcon__63Yog){border:solid var(--zd-color-primary);border-width:0 2px 2px 0;cursor:pointer;padding:4px;transform:rotate(135deg);transition:.3s}:where(.ZDrop-module_expandToggleIcon--active__h2I5u){color:var(--zd-color-secondary);transform:translateY(-30%) rotate(45deg)}:where(.ZDrop-module_expandToggleIcon__63Yog):hover{border-color:var(--zd-color-secondary)}:where(.ZDrop-module_listWrapper__FGHRj){min-width:100%;position:absolute;z-index:2}:where(.ZDrop-module_list__162r4){border:var(--zd-border);border-radius:var(--zd-radius);margin-top:5px;max-height:100%;overflow:auto;position:absolute;width:100%;z-index:2}:where(.ZDrop-module_option__ZfKFl,.ZDrop-module_noData__-70Uu){color:var(--zd-color-primary);list-style:none;padding:10px 8px}:where(.ZDrop-module_option__ZfKFl){cursor:pointer}:where(.ZDrop-module_option__ZfKFl):focus{background:var(--zd-color-secondary-transp);outline:none}:where(.ZDrop-module_option__ZfKFl):hover{font-weight:700}:where(.ZDrop-module_option--active__OXcv5){color:var(--zd-color-secondary)}:where(.ZDrop-module_errorMessage__8YOT7){background:var(--zd-color-error-transp);border:1px solid var(--zd-color-error);border-radius:var(--zd-radius);color:var(--zd-color-error);margin-top:5px;padding:8px}
2
- /*# sourceMappingURL=index.esm.css.map */
package/dist/index.esm.css.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"sources":["ZDrop.module.scss"],"names":[],"mappings":"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","file":"index.esm.css","sourcesContent":["@charset \"UTF-8\";\n/* ZDrop.module.scss — „override-friendly” */\n:global(:root) {\n --zd-color-primary: #676767;\n --zd-color-primary-transp: #67676775;\n --zd-color-secondary: #0079bd;\n --zd-color-secondary-transp: #0079bd50;\n --zd-color-disabled: #ddd;\n --zd-color-error: #ff4d4f;\n --zd-color-error-transp: #ffe6e6;\n --zd-color-background-transp: #ffffffdd;\n --zd-font-family: Helvetica, Arial, sans-serif;\n --zd-font-size: 14px;\n --zd-radius: 3px;\n --zd-border: 1px solid var(--zd-color-primary);\n --zd-focus-ring: 0 0 0 0.2rem var(--zd-color-secondary-transp);\n}\n\n:where(.container) * {\n padding: 0;\n margin: 0;\n box-sizing: border-box;\n}\n\n:where(.container) {\n position: relative;\n width: fit-content;\n max-width: 500px;\n min-width: 200px;\n height: fit-content;\n max-height: fit-content;\n font-family: var(--zd-font-family);\n font-size: var(--zd-font-size);\n}\n\n:where(.label) {\n display: block;\n margin: 0 0 5px 10px;\n color: var(--zd-color-primary);\n}\n\n:where(.inputField) {\n position: relative;\n display: flex;\n min-height: 35px;\n border: var(--zd-border);\n border-radius: var(--zd-radius);\n padding-left: 10px;\n overflow-y: auto;\n transition: border 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n}\n\n:where(.inputField) > input {\n cursor: pointer;\n}\n\n:where(.inputField):hover {\n border-color: var(--zd-color-secondary);\n}\n\n:where(.inputField):focus-within {\n border-color: var(--zd-color-secondary);\n box-shadow: var(--zd-focus-ring);\n}\n\n:where(.inputField):focus-within > input {\n cursor: text;\n}\n\n:where(.inputField--multiple) {\n padding-left: 4px;\n}\n\n:where(.inputField--disabled) {\n background: var(--zd-color-disabled);\n cursor: default;\n pointer-events: none;\n}\n\n:where(.input) {\n width: 100%;\n min-height: 100%;\n padding-right: 10px;\n border: none;\n border-radius: var(--zd-radius);\n color: var(--zd-color-primary);\n background: transparent;\n}\n\n:where(.input):focus {\n outline: none;\n}\n\n:where(.input):disabled {\n background: var(--zd-color-disabled);\n}\n\n:where(.input)::placeholder {\n color: var(--zd-color-primary-transp);\n}\n\n:where(.inputSingle) {\n display: flex;\n align-items: center;\n max-width: 100%;\n min-height: 35px;\n white-space: nowrap;\n overflow: hidden;\n height: auto;\n}\n\n:where(.inputSingleValue) {\n width: fit-content;\n height: 100%;\n border: var(--zd-border);\n border-radius: var(--zd-radius);\n}\n\n:where(.inputSingleValueRenderer) {\n display: flex;\n align-items: center;\n}\n\n:where(.inputSingleSearch) {\n display: flex;\n align-items: center;\n flex: 1;\n max-width: 100%;\n min-height: 35px;\n line-height: 35px;\n overflow: hidden;\n white-space: nowrap;\n color: var(--zd-color-primary);\n border: none;\n background: transparent;\n}\n\n:where(.inputSingleSearch):focus {\n outline: none;\n}\n\n:where(.inputMultiple) {\n display: flex;\n flex-wrap: wrap;\n max-width: calc(100% - 47px);\n align-items: center;\n margin-right: 5px;\n list-style: none;\n height: auto;\n}\n\n:where(.inputMultipleValue) {\n display: flex;\n align-items: center;\n width: fit-content;\n min-width: fit-content;\n margin: 2px;\n padding: 3px 6px;\n color: var(--zd-color-primary);\n border-radius: var(--zd-radius);\n background: var(--zd-color-disabled);\n cursor: pointer;\n}\n:where(.inputMultipleValue) span {\n display: flex;\n width: fit-content;\n min-width: fit-content;\n white-space: nowrap;\n}\n\n:where(.inputMultipleValueRemoveBtn) {\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 10px;\n min-width: 10px;\n margin-left: 3px;\n background: transparent;\n border: none;\n cursor: pointer;\n}\n\n:where(.inputMultipleValueRemoveBtn):focus {\n outline: none;\n}\n\n:where(.inputMultipleValueRemoveBtnIcon) {\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n width: 10px;\n height: 10px;\n}\n\n:where(.inputMultipleValueRemoveBtnIcon)::before,\n:where(.inputMultipleValueRemoveBtnIcon)::after {\n position: absolute;\n content: \"\";\n height: 10px;\n width: 2px;\n background-color: var(--zd-color-primary);\n}\n\n:where(.inputMultipleValueRemoveBtnIcon)::before {\n transform: rotate(45deg);\n}\n\n:where(.inputMultipleValueRemoveBtnIcon)::after {\n transform: rotate(-45deg);\n}\n\n:where(.inputMultipleValueRemoveBtn):hover > .inputMultipleValueRemoveBtnIcon::before,\n:where(.inputMultipleValueRemoveBtn):hover > .inputMultipleValueRemoveBtnIcon::after,\n:where(.inputMultipleValueRemoveBtn):focus > .inputMultipleValueRemoveBtnIcon::after,\n:where(.inputMultipleValueRemoveBtn):focus > .inputMultipleValueRemoveBtnIcon::before {\n background-color: var(--zd-color-secondary);\n}\n\n:where(.inputMultipleSearchWrapper) {\n min-width: 100%;\n flex: auto;\n}\n\n:where(.inputMultipleSearch) {\n min-width: 40px;\n width: 100%;\n padding: 3px;\n color: var(--zd-color-primary);\n border: none;\n background: transparent;\n}\n\n:where(.inputMultipleSearch):focus {\n outline: none;\n}\n\n:where(.inputMultiplePlaceholder) {\n padding-left: 6px;\n}\n\n:where(.inputClearBtnWrapper) {\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n:where(.inputClearBtn) {\n max-height: fit-content;\n background: none;\n border: none;\n}\n\n:where(.inputClearBtnIcon) {\n display: block;\n position: relative;\n min-width: 14px;\n max-width: 14px;\n height: 15px;\n cursor: pointer;\n}\n\n:where(.inputClearBtnIcon)::before,\n:where(.inputClearBtnIcon)::after {\n position: absolute;\n left: 6px;\n content: \"\";\n height: 15px;\n width: 2px;\n background: var(--zd-color-primary);\n}\n\n:where(.inputClearBtnIcon)::before {\n transform: rotate(45deg);\n}\n\n:where(.inputClearBtnIcon)::after {\n transform: rotate(-45deg);\n}\n\n:where(.inputClearBtnIcon:hover)::before,\n:where(.inputClearBtnIcon:hover)::after {\n background: var(--zd-color-secondary);\n}\n\n:where(.expandToggle) {\n display: flex;\n min-width: fit-content;\n align-items: center;\n padding: 0 10px;\n}\n\n:where(.expandToggleIcon) {\n transform: rotate(135deg);\n border: solid var(--zd-color-primary);\n border-width: 0 2px 2px 0;\n padding: 4px;\n cursor: pointer;\n transition: 0.3s;\n}\n\n:where(.expandToggleIcon--active) {\n transform: translateY(-30%) rotate(45deg);\n color: var(--zd-color-secondary);\n}\n\n:where(.expandToggleIcon):hover {\n border-color: var(--zd-color-secondary);\n}\n\n:where(.listWrapper) {\n position: absolute;\n z-index: 2;\n min-width: 100%;\n}\n\n:where(.list) {\n position: absolute;\n z-index: 2;\n width: 100%;\n max-height: 100%;\n margin-top: 5px;\n border-radius: var(--zd-radius);\n border: var(--zd-border);\n overflow: auto;\n}\n\n:where(.option, .noData) {\n padding: 10px 8px;\n color: var(--zd-color-primary);\n list-style: none;\n}\n\n:where(.option) {\n cursor: pointer;\n}\n\n:where(.option):focus {\n outline: none;\n background: var(--zd-color-secondary-transp);\n}\n\n:where(.option):hover {\n font-weight: 700;\n}\n\n:where(.option--active) {\n color: var(--zd-color-secondary);\n}\n\n:where(.errorMessage) {\n margin-top: 5px;\n padding: 8px;\n color: var(--zd-color-error);\n border: 1px solid var(--zd-color-error);\n border-radius: var(--zd-radius);\n background: var(--zd-color-error-transp);\n}"]}