@hi-ui/tag-input 4.0.0-beta.2 → 4.0.0-beta.3

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 (3) hide show
  1. package/lib/cjs/styles/index.scss.js +1 -1
  2. package/lib/esm/styles/index.scss.js +1 -1
  3. package/package.json +11 -11
package/lib/cjs/styles/index.scss.js CHANGED
@@ -12,7 +12,7 @@
12
12
  Object.defineProperty(exports, '__esModule', {
13
13
  value: true
14
14
  });
15
- var css_248z = "@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n.hi-v4-tag-input {\n position: relative;\n -webkit-box-flex: 1;\n -ms-flex: 1 1;\n flex: 1 1; }\n.hi-v4-tag-input__container {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n width: 100%;\n min-width: 160px;\n font-size: 14px;\n vertical-align: middle;\n color: #000;\n color: var(--hi-v4-color-static-black, #000);\n border: 1px solid transparent;\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff);\n -webkit-transition: all 0.3s;\n transition: all 0.3s;\n padding: 4px 10px;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n min-height: 32px;\n overflow: hidden;\n border-color: #dfe2e8;\n border-color: var(--hi-v4-color-gray-300, #dfe2e8);\n border-radius: 4px; }\n.hi-v4-tag-input__container:not(.disabled):hover {\n border-color: #237ffa;\n border-color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input__container:not(.disabled).focused {\n border-color: #237ffa;\n border-color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input__container.disabled {\n cursor: not-allowed;\n color: #929aa6;\n color: var(--hi-v4-color-gray-500, #929aa6);\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input__container.disabled .hi-v4-tag-input__tag {\n background-color: #ebedf0;\n background-color: var(--hi-v4-color-gray-200, #ebedf0); }\n.hi-v4-tag-input__placeholder {\n color: #929aa6;\n color: var(--hi-v4-color-gray-500, #929aa6); }\n.hi-v4-tag-input__suffix {\n font-size: 16px;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-pack: end;\n -ms-flex-pack: end;\n justify-content: flex-end;\n min-width: 32px; }\n.hi-v4-tag-input__clear {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n width: 16px;\n height: 16px;\n font-size: 14px;\n color: #929aa6;\n color: var(--hi-v4-color-gray-500, #929aa6);\n -ms-flex-negative: 0;\n flex-shrink: 0;\n cursor: pointer;\n -webkit-transition: all 0.3s;\n transition: all 0.3s; }\n.hi-v4-tag-input__clear:hover {\n color: #000;\n color: var(--hi-v4-color-static-black, #000); }\n.hi-v4-tag-input__value {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n width: 100%;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n height: 22px;\n line-height: 22px; }\n.hi-v4-tag-input__tags {\n -webkit-box-flex: 0;\n -ms-flex: 0 1 auto;\n flex: 0 1 auto;\n display: inline-block;\n width: -webkit-fit-content;\n width: -moz-fit-content;\n width: fit-content;\n white-space: nowrap;\n height: 100%;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n margin-top: -4px;\n position: relative; }\n.hi-v4-tag-input__tag, .hi-v4-tag-input__tag--left {\n display: inline-block;\n margin-right: 4px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 0 8px;\n vertical-align: middle;\n font-size: 12px;\n color: #333;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7);\n border-radius: 4px; }\n.hi-v4-tag-input__tag--total {\n display: inline-block;\n margin-right: 6px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 0 8px;\n vertical-align: middle;\n font-size: 12px;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background-color: #bde2ff;\n background-color: var(--hi-v4-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n color: #237ffa;\n color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));\n border-radius: 4px;\n line-height: 22px;\n cursor: inherit; }\n.hi-v4-tag-input__tag {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center; }\n.hi-v4-tag-input__tag-content {\n display: inline-block;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n -webkit-box-sizing: border-box;\n box-sizing: border-box; }\n.hi-v4-tag-input__tag-closed {\n margin-left: 8px;\n margin-left: var(--hi-v4-spacing-4, 8px);\n font-size: 12px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n color: #8e8e8e;\n cursor: pointer; }\n.disabled .hi-v4-tag-input__tag-closed {\n cursor: not-allowed; }\n.hi-v4-tag-input__tag--left {\n margin: 0;\n max-width: 54px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n vertical-align: middle; }\n.hi-v4-tag-input--nowrap .hi-v4-tag-input__value {\n width: calc(100% - 64px);\n overflow-x: hidden; }\n.hi-v4-tag-input--wrap .hi-v4-tag-input__value {\n height: auto; }\n.hi-v4-tag-input--wrap .hi-v4-tag-input__tags {\n white-space: normal;\n margin-top: -4px; }\n.hi-v4-tag-input--wrap .hi-v4-tag-input__tag {\n margin-top: 4px; }\n.hi-v4-tag-input--expanded {\n position: relative; }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand {\n position: absolute;\n top: 0;\n left: 0;\n height: auto;\n z-index: 1;\n -webkit-box-flex: 1;\n -ms-flex: 1 1;\n flex: 1 1;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n width: 100%;\n min-width: 160px;\n font-size: 14px;\n vertical-align: middle;\n color: #000;\n color: var(--hi-v4-color-static-black, #000);\n border: 1px solid transparent;\n background-color: use-color-statc(\"white\");\n -webkit-transition: all 0.3s;\n transition: all 0.3s;\n padding: 3px 0;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -webkit-box-align: start;\n -ms-flex-align: start;\n align-items: flex-start;\n min-height: 32px;\n overflow: hidden;\n border-radius: 4px;\n border-color: #237ffa;\n border-color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__value {\n height: -webkit-fit-content;\n height: -moz-fit-content;\n height: fit-content;\n max-height: 74px;\n -webkit-box-align: stretch;\n -ms-flex-align: stretch;\n align-items: stretch;\n overflow: scroll;\n padding-left: 10px; }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__tags {\n white-space: normal;\n margin-top: -4px; }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__tag {\n margin-top: 4px; }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__suffix {\n -webkit-box-align: start;\n -ms-flex-align: start;\n align-items: flex-start;\n padding: 4px 10px 4px 0;\n position: sticky;\n top: 0; }\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n.hi-v4-tag-input-mock {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n border: none;\n outline: none;\n -webkit-box-shadow: none;\n box-shadow: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n cursor: text;\n background-color: transparent;\n -webkit-tap-highlight-color: transparent;\n position: relative;\n overflow: hidden;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-flex: 1;\n -ms-flex: 1 1;\n flex: 1 1;\n -webkit-transition-property: all;\n transition-property: all;\n -webkit-transition-duration: 200ms;\n transition-duration: 200ms;\n -webkit-transition-duration: var(--hi-v4-motion-duration-normal, 200ms);\n transition-duration: var(--hi-v4-motion-duration-normal, 200ms);\n -webkit-transition-timing-function: cubic-bezier(0.37, 0.02, 0.34, 1);\n transition-timing-function: cubic-bezier(0.37, 0.02, 0.34, 1);\n -webkit-transition-timing-function: var(--hi-v4-motion-bezier-normal, cubic-bezier(0.37, 0.02, 0.34, 1));\n transition-timing-function: var(--hi-v4-motion-bezier-normal, cubic-bezier(0.37, 0.02, 0.34, 1));\n width: 100%;\n height: auto;\n z-index: auto;\n font-size: inherit;\n line-height: inherit;\n color: #1f2733;\n color: var(--hi-v4-color-gray-700, #1f2733);\n border: 1px solid transparent;\n border: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-static-transparent, transparent);\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock:not(.hi-v4-tag-input-mock--disabled):hover {\n z-index: calc(1 + 1);\n z-index: calc(var(--hi-v4-zindex-absolute, 1) + 1); }\n.hi-v4-tag-input-mock:not(.hi-v4-tag-input-mock--disabled).focused {\n z-index: calc(1 + 1);\n z-index: calc(var(--hi-v4-zindex-absolute, 1) + 1); }\n.hi-v4-tag-input-mock.hi-v4-tag-input-mock--disabled {\n cursor: not-allowed; }\n.hi-v4-tag-input-mock.hi-v4-tag-input-mock--disabled .hi-v4-tag-input-mock__tag {\n background-color: #ebedf0;\n background-color: var(--hi-v4-color-gray-200, #ebedf0); }\n.hi-v4-tag-input-mock--wrap .hi-v4-tag-input-mock__value {\n height: auto; }\n.hi-v4-tag-input-mock--wrap .hi-v4-tag-input-mock__tags {\n white-space: normal; }\n.hi-v4-tag-input-mock__suffix {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n -webkit-box-pack: end;\n -ms-flex-pack: end;\n justify-content: flex-end;\n -ms-flex-negative: 0;\n flex-shrink: 0;\n color: #000;\n color: var(--hi-v4-color-static-black, #000);\n font-size: 1rem;\n font-size: var(--hi-v4-text-size-lg, 1rem);\n padding: 0;\n text-align: center; }\n.hi-v4-tag-input-mock__clear {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n width: 16px;\n height: 16px;\n font-size: 0.875rem;\n font-size: var(--hi-v4-text-size-normal, 0.875rem);\n color: #929aa6;\n color: var(--hi-v4-color-gray-500, #929aa6);\n text-align: center;\n -ms-flex-negative: 0;\n flex-shrink: 0;\n cursor: pointer;\n -webkit-transition-property: all;\n transition-property: all;\n -webkit-transition-duration: 200ms;\n transition-duration: 200ms;\n -webkit-transition-duration: var(--hi-v4-motion-duration-normal, 200ms);\n transition-duration: var(--hi-v4-motion-duration-normal, 200ms);\n -webkit-transition-timing-function: cubic-bezier(0.37, 0.02, 0.34, 1);\n transition-timing-function: cubic-bezier(0.37, 0.02, 0.34, 1);\n -webkit-transition-timing-function: var(--hi-v4-motion-bezier-normal, cubic-bezier(0.37, 0.02, 0.34, 1));\n transition-timing-function: var(--hi-v4-motion-bezier-normal, cubic-bezier(0.37, 0.02, 0.34, 1)); }\n.hi-v4-tag-input-mock__clear:hover {\n color: #000;\n color: var(--hi-v4-color-static-black, #000); }\n.hi-v4-tag-input-mock__tags {\n position: relative;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n white-space: nowrap;\n overflow: hidden; }\n.hi-v4-tag-input-mock__tag--total {\n display: inline-block;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n vertical-align: middle;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n cursor: inherit;\n margin-left: 8px;\n margin-left: var(--hi-v4-spacing-4, 8px);\n margin-right: 6px;\n margin-right: var(--hi-v4-spacing-3, 6px);\n padding: 0 8px;\n padding: 0 var(--hi-v4-spacing-4, 8px);\n font-size: 0.75rem;\n font-size: var(--hi-v4-text-size-sm, 0.75rem);\n border-radius: 4px;\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n line-height: 1.25rem;\n line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7);\n color: #1f2733;\n color: var(--hi-v4-color-gray-700, #1f2733); }\n.hi-v4-tag-input-mock--expandable .hi-v4-tag-input-mock__tag--total {\n background-color: #e2f3fe;\n background-color: var(--hi-v4-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));\n color: #237ffa;\n color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock__suffix, .hi-v4-tag-input-mock__placeholder {\n color: #c9ced6;\n color: var(--hi-v4-color-gray-400, #c9ced6); }\n.hi-v4-tag-input-mock__tag, .hi-v4-tag-input-mock__placeholder {\n margin-top: 2px;\n margin-top: var(--hi-v4-spacing-1, 2px);\n margin-bottom: 2px;\n margin-bottom: var(--hi-v4-spacing-1, 2px); }\n.hi-v4-tag-input-mock__tag {\n max-width: 100%;\n margin-right: 4px;\n margin-right: var(--hi-v4-spacing-2, 4px);\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 0 8px;\n padding: 0 var(--hi-v4-spacing-4, 8px);\n vertical-align: middle;\n font-size: 0.75rem;\n font-size: var(--hi-v4-text-size-sm, 0.75rem);\n color: #1f2733;\n color: var(--hi-v4-color-gray-700, #1f2733);\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7);\n border-radius: 4px;\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n position: relative;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-flex: 0;\n -ms-flex: none;\n flex: none;\n line-height: inherit; }\n.hi-v4-tag-input-mock__tag-content {\n display: inline-block;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n -webkit-box-sizing: border-box;\n box-sizing: border-box; }\n.hi-v4-tag-input-mock__tag-closed {\n margin-left: 4px;\n margin-left: var(--hi-v4-spacing-2, 4px);\n font-size: 0.75rem;\n font-size: var(--hi-v4-text-size-sm, 0.75rem);\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n color: #929aa6;\n color: var(--hi-v4-color-gray-500, #929aa6);\n cursor: pointer; }\n.hi-v4-tag-input-mock__tag-closed:hover {\n color: #237ffa;\n color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--disabled .hi-v4-tag-input-mock__tag-closed {\n cursor: not-allowed; }\n.hi-v4-tag-input-mock--disabled .hi-v4-tag-input-mock__tag-closed:hover {\n color: #929aa6;\n color: var(--hi-v4-color-gray-500, #929aa6); }\n.hi-v4-tag-input-mock--size-sm {\n height: 24px;\n height: var(--hi-v4-height-sm, 24px);\n font-size: 0.75rem;\n font-size: var(--hi-v4-text-size-sm, 0.75rem);\n line-height: 1.25rem;\n line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);\n border-radius: 4px;\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n padding: 0 calc(12px - 1px);\n padding: 0 calc(var(--hi-v4-spacing-6, 12px) - 1px); }\n.hi-v4-tag-input-mock--size-sm .hi-v4-tag-input-mock__tag,\n .hi-v4-tag-input-mock--size-sm .hi-v4-tag-input-mock__placeholder {\n margin-top: 1px;\n margin-bottom: 1px; }\n.hi-v4-tag-input-mock--size-md {\n height: 32px;\n height: var(--hi-v4-height-normal, 32px);\n font-size: 0.875rem;\n font-size: var(--hi-v4-text-size-normal, 0.875rem);\n line-height: 1.375rem;\n line-height: var(--hi-v4-text-lineheight-normal, 1.375rem);\n border-radius: 4px;\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n padding: 2px calc(12px - 1px);\n padding: 2px calc(var(--hi-v4-spacing-6, 12px) - 1px); }\n.hi-v4-tag-input-mock--size-lg {\n height: 40px;\n height: var(--hi-v4-height-lg, 40px);\n font-size: 1rem;\n font-size: var(--hi-v4-text-size-lg, 1rem);\n line-height: 1.5rem;\n line-height: var(--hi-v4-text-lineheight-lg, 1.5rem);\n border-radius: 4px;\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n padding: 5px calc(12px - 1px);\n padding: 5px calc(var(--hi-v4-spacing-6, 12px) - 1px); }\n.hi-v4-tag-input-mock--appearance-line {\n border-color: #dfe2e8;\n border-color: var(--hi-v4-color-gray-300, #dfe2e8); }\n.hi-v4-tag-input-mock--appearance-line:not(.hi-v4-tag-input-mock--disabled):hover {\n border-color: #237ffa;\n border-color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-line:not(.hi-v4-tag-input-mock--disabled).focused {\n -webkit-box-shadow: 0 0 0 2px #bde2ff;\n box-shadow: 0 0 0 2px #bde2ff;\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n box-shadow: 0 0 0 2px var(--hi-v4-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n border-color: #237ffa;\n border-color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-line:not(.hi-v4-tag-input-mock--disabled).invalid {\n border-color: #ff5959;\n border-color: var(--hi-v4-danger-500, var(--hi-v4-color-red-500, #ff5959)); }\n.hi-v4-tag-input-mock--appearance-line:not(.hi-v4-tag-input-mock--disabled).invalid.hover {\n border-color: #ff5959;\n border-color: var(--hi-v4-danger-500, var(--hi-v4-color-red-500, #ff5959)); }\n.hi-v4-tag-input-mock--appearance-line:not(.hi-v4-tag-input-mock--disabled).invalid.focused {\n -webkit-box-shadow: 0 0 0 2px #ffd1c9;\n box-shadow: 0 0 0 2px #ffd1c9;\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-danger-100, var(--hi-v4-color-red-100, #ffd1c9));\n box-shadow: 0 0 0 2px var(--hi-v4-danger-100, var(--hi-v4-color-red-100, #ffd1c9)); }\n.hi-v4-tag-input-mock--appearance-unset {\n width: auto;\n -webkit-box-pack: start;\n -ms-flex-pack: start;\n justify-content: flex-start;\n border-color: transparent; }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled):hover {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled):hover .hi-v4-tag-input-mock__tag {\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled):hover .hi-v4-tag-input-mock__tag--total {\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled):hover.hi-v4-tag-input-mock--expandable .hi-v4-tag-input-mock__tag--total {\n background-color: #e2f3fe;\n background-color: var(--hi-v4-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));\n color: #237ffa;\n color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).focused {\n -webkit-box-shadow: 0 0 0 2px #bde2ff;\n box-shadow: 0 0 0 2px #bde2ff;\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n box-shadow: 0 0 0 2px var(--hi-v4-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff);\n border-color: #237ffa;\n border-color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).focused .hi-v4-tag-input-mock__tag {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).focused .hi-v4-tag-input-mock__tag--total {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).focused.hi-v4-tag-input-mock--expandable .hi-v4-tag-input-mock__tag--total {\n background-color: #e2f3fe;\n background-color: var(--hi-v4-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));\n color: #237ffa;\n color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).invalid {\n border-color: #ff5959;\n border-color: var(--hi-v4-danger-500, var(--hi-v4-color-red-500, #ff5959)); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).invalid.hover {\n border-color: #ff5959;\n border-color: var(--hi-v4-danger-500, var(--hi-v4-color-red-500, #ff5959)); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).invalid.focused {\n -webkit-box-shadow: 0 0 0 2px #ffd1c9;\n box-shadow: 0 0 0 2px #ffd1c9;\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-danger-100, var(--hi-v4-color-red-100, #ffd1c9));\n box-shadow: 0 0 0 2px var(--hi-v4-danger-100, var(--hi-v4-color-red-100, #ffd1c9)); }\n.hi-v4-tag-input-mock--appearance-filled {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled .hi-v4-tag-input-mock__tag {\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-filled .hi-v4-tag-input-mock__tag--total {\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-filled.hi-v4-tag-input-mock--expandable .hi-v4-tag-input-mock__tag--total {\n background-color: #e2f3fe;\n background-color: var(--hi-v4-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));\n color: #237ffa;\n color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled):hover {\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff);\n border-color: #237ffa;\n border-color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled):hover .hi-v4-tag-input-mock__tag {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled):hover .hi-v4-tag-input-mock__tag--total {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled):hover.hi-v4-tag-input-mock--expandable .hi-v4-tag-input-mock__tag--total {\n background-color: #e2f3fe;\n background-color: var(--hi-v4-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));\n color: #237ffa;\n color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).focused {\n -webkit-box-shadow: 0 0 0 2px #bde2ff;\n box-shadow: 0 0 0 2px #bde2ff;\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n box-shadow: 0 0 0 2px var(--hi-v4-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n border-color: #237ffa;\n border-color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).focused .hi-v4-tag-input-mock__tag {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).focused .hi-v4-tag-input-mock__tag--total {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).focused.hi-v4-tag-input-mock--expandable .hi-v4-tag-input-mock__tag--total {\n background-color: #e2f3fe;\n background-color: var(--hi-v4-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));\n color: #237ffa;\n color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).invalid {\n border-color: #ff5959;\n border-color: var(--hi-v4-danger-500, var(--hi-v4-color-red-500, #ff5959)); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).invalid.hover {\n border-color: #ff5959;\n border-color: var(--hi-v4-danger-500, var(--hi-v4-color-red-500, #ff5959)); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).invalid.focused {\n -webkit-box-shadow: 0 0 0 2px #ffd1c9;\n box-shadow: 0 0 0 2px #ffd1c9;\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-danger-100, var(--hi-v4-color-red-100, #ffd1c9));\n box-shadow: 0 0 0 2px var(--hi-v4-danger-100, var(--hi-v4-color-red-100, #ffd1c9)); }\n.hi-v4-tag-input-mock--appearance-line.hi-v4-tag-input-mock--disabled, .hi-v4-tag-input-mock--appearance-unset.hi-v4-tag-input-mock--disabled, .hi-v4-tag-input-mock--appearance-filled.hi-v4-tag-input-mock--disabled {\n color: #c9ced6;\n color: var(--hi-v4-color-gray-400, #c9ced6); }\n.hi-v4-tag-input-mock--appearance-line.hi-v4-tag-input-mock--disabled, .hi-v4-tag-input-mock--appearance-filled.hi-v4-tag-input-mock--disabled {\n background-color: #ebedf0;\n background-color: var(--hi-v4-color-gray-200, #ebedf0); }\n";
15
+ var css_248z = "@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n.hi-v4-tag-input {\n position: relative;\n -webkit-box-flex: 1;\n -ms-flex: 1 1;\n flex: 1 1; }\n.hi-v4-tag-input__container {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n width: 100%;\n min-width: 160px;\n font-size: 14px;\n vertical-align: middle;\n color: var(--hi-v4-color-static-black, #000);\n border: 1px solid transparent;\n background-color: var(--hi-v4-color-static-white, #fff);\n -webkit-transition: all 0.3s;\n transition: all 0.3s;\n padding: 4px 10px;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n min-height: 32px;\n overflow: hidden;\n border-color: var(--hi-v4-color-gray-300, #dfe2e8);\n border-radius: 4px; }\n.hi-v4-tag-input__container:not(.disabled):hover {\n border-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input__container:not(.disabled).focused {\n border-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input__container.disabled {\n cursor: not-allowed;\n color: var(--hi-v4-color-gray-500, #929aa6);\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input__container.disabled .hi-v4-tag-input__tag {\n background-color: var(--hi-v4-color-gray-200, #ebedf0); }\n.hi-v4-tag-input__placeholder {\n color: var(--hi-v4-color-gray-500, #929aa6); }\n.hi-v4-tag-input__suffix {\n font-size: 16px;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-pack: end;\n -ms-flex-pack: end;\n justify-content: flex-end;\n min-width: 32px; }\n.hi-v4-tag-input__clear {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n width: 16px;\n height: 16px;\n font-size: 14px;\n color: var(--hi-v4-color-gray-500, #929aa6);\n -ms-flex-negative: 0;\n flex-shrink: 0;\n cursor: pointer;\n -webkit-transition: all 0.3s;\n transition: all 0.3s; }\n.hi-v4-tag-input__clear:hover {\n color: var(--hi-v4-color-static-black, #000); }\n.hi-v4-tag-input__value {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n width: 100%;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n height: 22px;\n line-height: 22px; }\n.hi-v4-tag-input__tags {\n -webkit-box-flex: 0;\n -ms-flex: 0 1 auto;\n flex: 0 1 auto;\n display: inline-block;\n width: -webkit-fit-content;\n width: -moz-fit-content;\n width: fit-content;\n white-space: nowrap;\n height: 100%;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n margin-top: -4px;\n position: relative; }\n.hi-v4-tag-input__tag, .hi-v4-tag-input__tag--left {\n display: inline-block;\n margin-right: 4px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 0 8px;\n vertical-align: middle;\n font-size: 12px;\n color: #333;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7);\n border-radius: 4px; }\n.hi-v4-tag-input__tag--total {\n display: inline-block;\n margin-right: 6px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 0 8px;\n vertical-align: middle;\n font-size: 12px;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background-color: var(--hi-v4-color-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));\n border-radius: 4px;\n line-height: 22px;\n cursor: inherit; }\n.hi-v4-tag-input__tag {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center; }\n.hi-v4-tag-input__tag-content {\n display: inline-block;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n -webkit-box-sizing: border-box;\n box-sizing: border-box; }\n.hi-v4-tag-input__tag-closed {\n margin-left: var(--hi-v4-spacing-4, 8px);\n font-size: 12px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n color: #8e8e8e;\n cursor: pointer; }\n.disabled .hi-v4-tag-input__tag-closed {\n cursor: not-allowed; }\n.hi-v4-tag-input__tag--left {\n margin: 0;\n max-width: 54px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n vertical-align: middle; }\n.hi-v4-tag-input--nowrap .hi-v4-tag-input__value {\n width: calc(100% - 64px);\n overflow-x: hidden; }\n.hi-v4-tag-input--wrap .hi-v4-tag-input__value {\n height: auto; }\n.hi-v4-tag-input--wrap .hi-v4-tag-input__tags {\n white-space: normal;\n margin-top: -4px; }\n.hi-v4-tag-input--wrap .hi-v4-tag-input__tag {\n margin-top: 4px; }\n.hi-v4-tag-input--expanded {\n position: relative; }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand {\n position: absolute;\n top: 0;\n left: 0;\n height: auto;\n z-index: 1;\n -webkit-box-flex: 1;\n -ms-flex: 1 1;\n flex: 1 1;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n width: 100%;\n min-width: 160px;\n font-size: 14px;\n vertical-align: middle;\n color: var(--hi-v4-color-static-black, #000);\n border: 1px solid transparent;\n background-color: use-color-statc(\"white\");\n -webkit-transition: all 0.3s;\n transition: all 0.3s;\n padding: 3px 0;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -webkit-box-align: start;\n -ms-flex-align: start;\n align-items: flex-start;\n min-height: 32px;\n overflow: hidden;\n border-radius: 4px;\n border-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__value {\n height: -webkit-fit-content;\n height: -moz-fit-content;\n height: fit-content;\n max-height: 74px;\n -webkit-box-align: stretch;\n -ms-flex-align: stretch;\n align-items: stretch;\n overflow: scroll;\n padding-left: 10px; }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__tags {\n white-space: normal;\n margin-top: -4px; }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__tag {\n margin-top: 4px; }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__suffix {\n -webkit-box-align: start;\n -ms-flex-align: start;\n align-items: flex-start;\n padding: 4px 10px 4px 0;\n position: sticky;\n top: 0; }\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n.hi-v4-tag-input-mock {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n border: none;\n outline: none;\n -webkit-box-shadow: none;\n box-shadow: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n cursor: text;\n background-color: transparent;\n -webkit-tap-highlight-color: transparent;\n position: relative;\n overflow: hidden;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-flex: 1;\n -ms-flex: 1 1;\n flex: 1 1;\n -webkit-transition-property: all;\n transition-property: all;\n -webkit-transition-duration: var(--hi-v4-motion-duration-normal, 200ms);\n transition-duration: var(--hi-v4-motion-duration-normal, 200ms);\n -webkit-transition-timing-function: var(--hi-v4-motion-bezier-normal, cubic-bezier(0.37, 0.02, 0.34, 1));\n transition-timing-function: var(--hi-v4-motion-bezier-normal, cubic-bezier(0.37, 0.02, 0.34, 1));\n width: 100%;\n height: auto;\n z-index: auto;\n font-size: inherit;\n line-height: inherit;\n color: var(--hi-v4-color-gray-700, #1f2733);\n border: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-static-transparent, transparent);\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock:not(.hi-v4-tag-input-mock--disabled):hover {\n z-index: calc(var(--hi-v4-zindex-absolute, 1) + 1); }\n.hi-v4-tag-input-mock:not(.hi-v4-tag-input-mock--disabled).focused {\n z-index: calc(var(--hi-v4-zindex-absolute, 1) + 1); }\n.hi-v4-tag-input-mock.hi-v4-tag-input-mock--disabled {\n cursor: not-allowed; }\n.hi-v4-tag-input-mock.hi-v4-tag-input-mock--disabled .hi-v4-tag-input-mock__tag {\n background-color: var(--hi-v4-color-gray-200, #ebedf0); }\n.hi-v4-tag-input-mock--wrap .hi-v4-tag-input-mock__value {\n height: auto; }\n.hi-v4-tag-input-mock--wrap .hi-v4-tag-input-mock__tags {\n white-space: normal; }\n.hi-v4-tag-input-mock__suffix {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n -webkit-box-pack: end;\n -ms-flex-pack: end;\n justify-content: flex-end;\n -ms-flex-negative: 0;\n flex-shrink: 0;\n color: var(--hi-v4-color-static-black, #000);\n font-size: var(--hi-v4-text-size-lg, 1rem);\n padding: 0;\n text-align: center; }\n.hi-v4-tag-input-mock__clear {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n width: 16px;\n height: 16px;\n font-size: var(--hi-v4-text-size-normal, 0.875rem);\n color: var(--hi-v4-color-gray-500, #929aa6);\n text-align: center;\n -ms-flex-negative: 0;\n flex-shrink: 0;\n cursor: pointer;\n -webkit-transition-property: all;\n transition-property: all;\n -webkit-transition-duration: var(--hi-v4-motion-duration-normal, 200ms);\n transition-duration: var(--hi-v4-motion-duration-normal, 200ms);\n -webkit-transition-timing-function: var(--hi-v4-motion-bezier-normal, cubic-bezier(0.37, 0.02, 0.34, 1));\n transition-timing-function: var(--hi-v4-motion-bezier-normal, cubic-bezier(0.37, 0.02, 0.34, 1)); }\n.hi-v4-tag-input-mock__clear:hover {\n color: var(--hi-v4-color-static-black, #000); }\n.hi-v4-tag-input-mock__tags {\n position: relative;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n white-space: nowrap;\n overflow: hidden; }\n.hi-v4-tag-input-mock__tag--total {\n display: inline-block;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n vertical-align: middle;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n cursor: inherit;\n margin-left: var(--hi-v4-spacing-4, 8px);\n margin-right: var(--hi-v4-spacing-3, 6px);\n padding: 0 var(--hi-v4-spacing-4, 8px);\n font-size: var(--hi-v4-text-size-sm, 0.75rem);\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);\n background-color: var(--hi-v4-color-gray-100, #f2f4f7);\n color: var(--hi-v4-color-gray-700, #1f2733); }\n.hi-v4-tag-input-mock--expandable .hi-v4-tag-input-mock__tag--total {\n background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));\n color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock__suffix, .hi-v4-tag-input-mock__placeholder {\n color: var(--hi-v4-color-gray-400, #c9ced6); }\n.hi-v4-tag-input-mock__tag, .hi-v4-tag-input-mock__placeholder {\n margin-top: var(--hi-v4-spacing-1, 2px);\n margin-bottom: var(--hi-v4-spacing-1, 2px); }\n.hi-v4-tag-input-mock__tag {\n max-width: 100%;\n margin-right: var(--hi-v4-spacing-2, 4px);\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 0 var(--hi-v4-spacing-4, 8px);\n vertical-align: middle;\n font-size: var(--hi-v4-text-size-sm, 0.75rem);\n color: var(--hi-v4-color-gray-700, #1f2733);\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7);\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n position: relative;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-flex: 0;\n -ms-flex: none;\n flex: none;\n line-height: inherit; }\n.hi-v4-tag-input-mock__tag-content {\n display: inline-block;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n -webkit-box-sizing: border-box;\n box-sizing: border-box; }\n.hi-v4-tag-input-mock__tag-closed {\n margin-left: var(--hi-v4-spacing-2, 4px);\n font-size: var(--hi-v4-text-size-sm, 0.75rem);\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n color: var(--hi-v4-color-gray-500, #929aa6);\n cursor: pointer; }\n.hi-v4-tag-input-mock__tag-closed:hover {\n color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--disabled .hi-v4-tag-input-mock__tag-closed {\n cursor: not-allowed; }\n.hi-v4-tag-input-mock--disabled .hi-v4-tag-input-mock__tag-closed:hover {\n color: var(--hi-v4-color-gray-500, #929aa6); }\n.hi-v4-tag-input-mock--size-sm {\n height: var(--hi-v4-height-sm, 24px);\n font-size: var(--hi-v4-text-size-sm, 0.75rem);\n line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n padding: 0 calc(var(--hi-v4-spacing-6, 12px) - 1px); }\n.hi-v4-tag-input-mock--size-sm .hi-v4-tag-input-mock__tag,\n .hi-v4-tag-input-mock--size-sm .hi-v4-tag-input-mock__placeholder {\n margin-top: 1px;\n margin-bottom: 1px; }\n.hi-v4-tag-input-mock--size-md {\n height: var(--hi-v4-height-normal, 32px);\n font-size: var(--hi-v4-text-size-normal, 0.875rem);\n line-height: var(--hi-v4-text-lineheight-normal, 1.375rem);\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n padding: 2px calc(var(--hi-v4-spacing-6, 12px) - 1px); }\n.hi-v4-tag-input-mock--size-lg {\n height: var(--hi-v4-height-lg, 40px);\n font-size: var(--hi-v4-text-size-lg, 1rem);\n line-height: var(--hi-v4-text-lineheight-lg, 1.5rem);\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n padding: 5px calc(var(--hi-v4-spacing-6, 12px) - 1px); }\n.hi-v4-tag-input-mock--appearance-line {\n border-color: var(--hi-v4-color-gray-300, #dfe2e8); }\n.hi-v4-tag-input-mock--appearance-line:not(.hi-v4-tag-input-mock--disabled):hover {\n border-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-line:not(.hi-v4-tag-input-mock--disabled).focused {\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n box-shadow: 0 0 0 2px var(--hi-v4-color-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n border-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-line:not(.hi-v4-tag-input-mock--disabled).invalid {\n border-color: var(--hi-v4-color-danger-500, var(--hi-v4-color-red-500, #ff5959)); }\n.hi-v4-tag-input-mock--appearance-line:not(.hi-v4-tag-input-mock--disabled).invalid.hover {\n border-color: var(--hi-v4-color-danger-500, var(--hi-v4-color-red-500, #ff5959)); }\n.hi-v4-tag-input-mock--appearance-line:not(.hi-v4-tag-input-mock--disabled).invalid.focused {\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-danger-100, var(--hi-v4-color-red-100, #ffd1c9));\n box-shadow: 0 0 0 2px var(--hi-v4-color-danger-100, var(--hi-v4-color-red-100, #ffd1c9)); }\n.hi-v4-tag-input-mock--appearance-unset {\n width: auto;\n -webkit-box-pack: start;\n -ms-flex-pack: start;\n justify-content: flex-start;\n border-color: transparent; }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled):hover {\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled):hover .hi-v4-tag-input-mock__tag {\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled):hover .hi-v4-tag-input-mock__tag--total {\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled):hover.hi-v4-tag-input-mock--expandable .hi-v4-tag-input-mock__tag--total {\n background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));\n color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).focused {\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n box-shadow: 0 0 0 2px var(--hi-v4-color-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n background-color: var(--hi-v4-color-static-white, #fff);\n border-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).focused .hi-v4-tag-input-mock__tag {\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).focused .hi-v4-tag-input-mock__tag--total {\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).focused.hi-v4-tag-input-mock--expandable .hi-v4-tag-input-mock__tag--total {\n background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));\n color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).invalid {\n border-color: var(--hi-v4-color-danger-500, var(--hi-v4-color-red-500, #ff5959)); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).invalid.hover {\n border-color: var(--hi-v4-color-danger-500, var(--hi-v4-color-red-500, #ff5959)); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).invalid.focused {\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-danger-100, var(--hi-v4-color-red-100, #ffd1c9));\n box-shadow: 0 0 0 2px var(--hi-v4-color-danger-100, var(--hi-v4-color-red-100, #ffd1c9)); }\n.hi-v4-tag-input-mock--appearance-filled {\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled .hi-v4-tag-input-mock__tag {\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-filled .hi-v4-tag-input-mock__tag--total {\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-filled.hi-v4-tag-input-mock--expandable .hi-v4-tag-input-mock__tag--total {\n background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));\n color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled):hover {\n background-color: var(--hi-v4-color-static-white, #fff);\n border-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled):hover .hi-v4-tag-input-mock__tag {\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled):hover .hi-v4-tag-input-mock__tag--total {\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled):hover.hi-v4-tag-input-mock--expandable .hi-v4-tag-input-mock__tag--total {\n background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));\n color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).focused {\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n box-shadow: 0 0 0 2px var(--hi-v4-color-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n border-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).focused .hi-v4-tag-input-mock__tag {\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).focused .hi-v4-tag-input-mock__tag--total {\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).focused.hi-v4-tag-input-mock--expandable .hi-v4-tag-input-mock__tag--total {\n background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));\n color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).invalid {\n border-color: var(--hi-v4-color-danger-500, var(--hi-v4-color-red-500, #ff5959)); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).invalid.hover {\n border-color: var(--hi-v4-color-danger-500, var(--hi-v4-color-red-500, #ff5959)); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).invalid.focused {\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-danger-100, var(--hi-v4-color-red-100, #ffd1c9));\n box-shadow: 0 0 0 2px var(--hi-v4-color-danger-100, var(--hi-v4-color-red-100, #ffd1c9)); }\n.hi-v4-tag-input-mock--appearance-line.hi-v4-tag-input-mock--disabled, .hi-v4-tag-input-mock--appearance-unset.hi-v4-tag-input-mock--disabled, .hi-v4-tag-input-mock--appearance-filled.hi-v4-tag-input-mock--disabled {\n color: var(--hi-v4-color-gray-400, #c9ced6); }\n.hi-v4-tag-input-mock--appearance-line.hi-v4-tag-input-mock--disabled, .hi-v4-tag-input-mock--appearance-filled.hi-v4-tag-input-mock--disabled {\n background-color: var(--hi-v4-color-gray-200, #ebedf0); }\n";
16
16
 
17
17
  var __styleInject__ = require('style-inject/dist/style-inject.es.js')["default"];
18
18
 
package/lib/esm/styles/index.scss.js CHANGED
@@ -7,7 +7,7 @@
7
7
  * This source code is licensed under the MIT license found in the
8
8
  * LICENSE file in the root directory of this source tree.
9
9
  */
10
- var css_248z = "@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n.hi-v4-tag-input {\n position: relative;\n -webkit-box-flex: 1;\n -ms-flex: 1 1;\n flex: 1 1; }\n.hi-v4-tag-input__container {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n width: 100%;\n min-width: 160px;\n font-size: 14px;\n vertical-align: middle;\n color: #000;\n color: var(--hi-v4-color-static-black, #000);\n border: 1px solid transparent;\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff);\n -webkit-transition: all 0.3s;\n transition: all 0.3s;\n padding: 4px 10px;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n min-height: 32px;\n overflow: hidden;\n border-color: #dfe2e8;\n border-color: var(--hi-v4-color-gray-300, #dfe2e8);\n border-radius: 4px; }\n.hi-v4-tag-input__container:not(.disabled):hover {\n border-color: #237ffa;\n border-color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input__container:not(.disabled).focused {\n border-color: #237ffa;\n border-color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input__container.disabled {\n cursor: not-allowed;\n color: #929aa6;\n color: var(--hi-v4-color-gray-500, #929aa6);\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input__container.disabled .hi-v4-tag-input__tag {\n background-color: #ebedf0;\n background-color: var(--hi-v4-color-gray-200, #ebedf0); }\n.hi-v4-tag-input__placeholder {\n color: #929aa6;\n color: var(--hi-v4-color-gray-500, #929aa6); }\n.hi-v4-tag-input__suffix {\n font-size: 16px;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-pack: end;\n -ms-flex-pack: end;\n justify-content: flex-end;\n min-width: 32px; }\n.hi-v4-tag-input__clear {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n width: 16px;\n height: 16px;\n font-size: 14px;\n color: #929aa6;\n color: var(--hi-v4-color-gray-500, #929aa6);\n -ms-flex-negative: 0;\n flex-shrink: 0;\n cursor: pointer;\n -webkit-transition: all 0.3s;\n transition: all 0.3s; }\n.hi-v4-tag-input__clear:hover {\n color: #000;\n color: var(--hi-v4-color-static-black, #000); }\n.hi-v4-tag-input__value {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n width: 100%;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n height: 22px;\n line-height: 22px; }\n.hi-v4-tag-input__tags {\n -webkit-box-flex: 0;\n -ms-flex: 0 1 auto;\n flex: 0 1 auto;\n display: inline-block;\n width: -webkit-fit-content;\n width: -moz-fit-content;\n width: fit-content;\n white-space: nowrap;\n height: 100%;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n margin-top: -4px;\n position: relative; }\n.hi-v4-tag-input__tag, .hi-v4-tag-input__tag--left {\n display: inline-block;\n margin-right: 4px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 0 8px;\n vertical-align: middle;\n font-size: 12px;\n color: #333;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7);\n border-radius: 4px; }\n.hi-v4-tag-input__tag--total {\n display: inline-block;\n margin-right: 6px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 0 8px;\n vertical-align: middle;\n font-size: 12px;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background-color: #bde2ff;\n background-color: var(--hi-v4-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n color: #237ffa;\n color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));\n border-radius: 4px;\n line-height: 22px;\n cursor: inherit; }\n.hi-v4-tag-input__tag {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center; }\n.hi-v4-tag-input__tag-content {\n display: inline-block;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n -webkit-box-sizing: border-box;\n box-sizing: border-box; }\n.hi-v4-tag-input__tag-closed {\n margin-left: 8px;\n margin-left: var(--hi-v4-spacing-4, 8px);\n font-size: 12px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n color: #8e8e8e;\n cursor: pointer; }\n.disabled .hi-v4-tag-input__tag-closed {\n cursor: not-allowed; }\n.hi-v4-tag-input__tag--left {\n margin: 0;\n max-width: 54px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n vertical-align: middle; }\n.hi-v4-tag-input--nowrap .hi-v4-tag-input__value {\n width: calc(100% - 64px);\n overflow-x: hidden; }\n.hi-v4-tag-input--wrap .hi-v4-tag-input__value {\n height: auto; }\n.hi-v4-tag-input--wrap .hi-v4-tag-input__tags {\n white-space: normal;\n margin-top: -4px; }\n.hi-v4-tag-input--wrap .hi-v4-tag-input__tag {\n margin-top: 4px; }\n.hi-v4-tag-input--expanded {\n position: relative; }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand {\n position: absolute;\n top: 0;\n left: 0;\n height: auto;\n z-index: 1;\n -webkit-box-flex: 1;\n -ms-flex: 1 1;\n flex: 1 1;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n width: 100%;\n min-width: 160px;\n font-size: 14px;\n vertical-align: middle;\n color: #000;\n color: var(--hi-v4-color-static-black, #000);\n border: 1px solid transparent;\n background-color: use-color-statc(\"white\");\n -webkit-transition: all 0.3s;\n transition: all 0.3s;\n padding: 3px 0;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -webkit-box-align: start;\n -ms-flex-align: start;\n align-items: flex-start;\n min-height: 32px;\n overflow: hidden;\n border-radius: 4px;\n border-color: #237ffa;\n border-color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__value {\n height: -webkit-fit-content;\n height: -moz-fit-content;\n height: fit-content;\n max-height: 74px;\n -webkit-box-align: stretch;\n -ms-flex-align: stretch;\n align-items: stretch;\n overflow: scroll;\n padding-left: 10px; }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__tags {\n white-space: normal;\n margin-top: -4px; }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__tag {\n margin-top: 4px; }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__suffix {\n -webkit-box-align: start;\n -ms-flex-align: start;\n align-items: flex-start;\n padding: 4px 10px 4px 0;\n position: sticky;\n top: 0; }\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n.hi-v4-tag-input-mock {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n border: none;\n outline: none;\n -webkit-box-shadow: none;\n box-shadow: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n cursor: text;\n background-color: transparent;\n -webkit-tap-highlight-color: transparent;\n position: relative;\n overflow: hidden;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-flex: 1;\n -ms-flex: 1 1;\n flex: 1 1;\n -webkit-transition-property: all;\n transition-property: all;\n -webkit-transition-duration: 200ms;\n transition-duration: 200ms;\n -webkit-transition-duration: var(--hi-v4-motion-duration-normal, 200ms);\n transition-duration: var(--hi-v4-motion-duration-normal, 200ms);\n -webkit-transition-timing-function: cubic-bezier(0.37, 0.02, 0.34, 1);\n transition-timing-function: cubic-bezier(0.37, 0.02, 0.34, 1);\n -webkit-transition-timing-function: var(--hi-v4-motion-bezier-normal, cubic-bezier(0.37, 0.02, 0.34, 1));\n transition-timing-function: var(--hi-v4-motion-bezier-normal, cubic-bezier(0.37, 0.02, 0.34, 1));\n width: 100%;\n height: auto;\n z-index: auto;\n font-size: inherit;\n line-height: inherit;\n color: #1f2733;\n color: var(--hi-v4-color-gray-700, #1f2733);\n border: 1px solid transparent;\n border: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-static-transparent, transparent);\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock:not(.hi-v4-tag-input-mock--disabled):hover {\n z-index: calc(1 + 1);\n z-index: calc(var(--hi-v4-zindex-absolute, 1) + 1); }\n.hi-v4-tag-input-mock:not(.hi-v4-tag-input-mock--disabled).focused {\n z-index: calc(1 + 1);\n z-index: calc(var(--hi-v4-zindex-absolute, 1) + 1); }\n.hi-v4-tag-input-mock.hi-v4-tag-input-mock--disabled {\n cursor: not-allowed; }\n.hi-v4-tag-input-mock.hi-v4-tag-input-mock--disabled .hi-v4-tag-input-mock__tag {\n background-color: #ebedf0;\n background-color: var(--hi-v4-color-gray-200, #ebedf0); }\n.hi-v4-tag-input-mock--wrap .hi-v4-tag-input-mock__value {\n height: auto; }\n.hi-v4-tag-input-mock--wrap .hi-v4-tag-input-mock__tags {\n white-space: normal; }\n.hi-v4-tag-input-mock__suffix {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n -webkit-box-pack: end;\n -ms-flex-pack: end;\n justify-content: flex-end;\n -ms-flex-negative: 0;\n flex-shrink: 0;\n color: #000;\n color: var(--hi-v4-color-static-black, #000);\n font-size: 1rem;\n font-size: var(--hi-v4-text-size-lg, 1rem);\n padding: 0;\n text-align: center; }\n.hi-v4-tag-input-mock__clear {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n width: 16px;\n height: 16px;\n font-size: 0.875rem;\n font-size: var(--hi-v4-text-size-normal, 0.875rem);\n color: #929aa6;\n color: var(--hi-v4-color-gray-500, #929aa6);\n text-align: center;\n -ms-flex-negative: 0;\n flex-shrink: 0;\n cursor: pointer;\n -webkit-transition-property: all;\n transition-property: all;\n -webkit-transition-duration: 200ms;\n transition-duration: 200ms;\n -webkit-transition-duration: var(--hi-v4-motion-duration-normal, 200ms);\n transition-duration: var(--hi-v4-motion-duration-normal, 200ms);\n -webkit-transition-timing-function: cubic-bezier(0.37, 0.02, 0.34, 1);\n transition-timing-function: cubic-bezier(0.37, 0.02, 0.34, 1);\n -webkit-transition-timing-function: var(--hi-v4-motion-bezier-normal, cubic-bezier(0.37, 0.02, 0.34, 1));\n transition-timing-function: var(--hi-v4-motion-bezier-normal, cubic-bezier(0.37, 0.02, 0.34, 1)); }\n.hi-v4-tag-input-mock__clear:hover {\n color: #000;\n color: var(--hi-v4-color-static-black, #000); }\n.hi-v4-tag-input-mock__tags {\n position: relative;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n white-space: nowrap;\n overflow: hidden; }\n.hi-v4-tag-input-mock__tag--total {\n display: inline-block;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n vertical-align: middle;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n cursor: inherit;\n margin-left: 8px;\n margin-left: var(--hi-v4-spacing-4, 8px);\n margin-right: 6px;\n margin-right: var(--hi-v4-spacing-3, 6px);\n padding: 0 8px;\n padding: 0 var(--hi-v4-spacing-4, 8px);\n font-size: 0.75rem;\n font-size: var(--hi-v4-text-size-sm, 0.75rem);\n border-radius: 4px;\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n line-height: 1.25rem;\n line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7);\n color: #1f2733;\n color: var(--hi-v4-color-gray-700, #1f2733); }\n.hi-v4-tag-input-mock--expandable .hi-v4-tag-input-mock__tag--total {\n background-color: #e2f3fe;\n background-color: var(--hi-v4-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));\n color: #237ffa;\n color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock__suffix, .hi-v4-tag-input-mock__placeholder {\n color: #c9ced6;\n color: var(--hi-v4-color-gray-400, #c9ced6); }\n.hi-v4-tag-input-mock__tag, .hi-v4-tag-input-mock__placeholder {\n margin-top: 2px;\n margin-top: var(--hi-v4-spacing-1, 2px);\n margin-bottom: 2px;\n margin-bottom: var(--hi-v4-spacing-1, 2px); }\n.hi-v4-tag-input-mock__tag {\n max-width: 100%;\n margin-right: 4px;\n margin-right: var(--hi-v4-spacing-2, 4px);\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 0 8px;\n padding: 0 var(--hi-v4-spacing-4, 8px);\n vertical-align: middle;\n font-size: 0.75rem;\n font-size: var(--hi-v4-text-size-sm, 0.75rem);\n color: #1f2733;\n color: var(--hi-v4-color-gray-700, #1f2733);\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7);\n border-radius: 4px;\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n position: relative;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-flex: 0;\n -ms-flex: none;\n flex: none;\n line-height: inherit; }\n.hi-v4-tag-input-mock__tag-content {\n display: inline-block;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n -webkit-box-sizing: border-box;\n box-sizing: border-box; }\n.hi-v4-tag-input-mock__tag-closed {\n margin-left: 4px;\n margin-left: var(--hi-v4-spacing-2, 4px);\n font-size: 0.75rem;\n font-size: var(--hi-v4-text-size-sm, 0.75rem);\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n color: #929aa6;\n color: var(--hi-v4-color-gray-500, #929aa6);\n cursor: pointer; }\n.hi-v4-tag-input-mock__tag-closed:hover {\n color: #237ffa;\n color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--disabled .hi-v4-tag-input-mock__tag-closed {\n cursor: not-allowed; }\n.hi-v4-tag-input-mock--disabled .hi-v4-tag-input-mock__tag-closed:hover {\n color: #929aa6;\n color: var(--hi-v4-color-gray-500, #929aa6); }\n.hi-v4-tag-input-mock--size-sm {\n height: 24px;\n height: var(--hi-v4-height-sm, 24px);\n font-size: 0.75rem;\n font-size: var(--hi-v4-text-size-sm, 0.75rem);\n line-height: 1.25rem;\n line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);\n border-radius: 4px;\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n padding: 0 calc(12px - 1px);\n padding: 0 calc(var(--hi-v4-spacing-6, 12px) - 1px); }\n.hi-v4-tag-input-mock--size-sm .hi-v4-tag-input-mock__tag,\n .hi-v4-tag-input-mock--size-sm .hi-v4-tag-input-mock__placeholder {\n margin-top: 1px;\n margin-bottom: 1px; }\n.hi-v4-tag-input-mock--size-md {\n height: 32px;\n height: var(--hi-v4-height-normal, 32px);\n font-size: 0.875rem;\n font-size: var(--hi-v4-text-size-normal, 0.875rem);\n line-height: 1.375rem;\n line-height: var(--hi-v4-text-lineheight-normal, 1.375rem);\n border-radius: 4px;\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n padding: 2px calc(12px - 1px);\n padding: 2px calc(var(--hi-v4-spacing-6, 12px) - 1px); }\n.hi-v4-tag-input-mock--size-lg {\n height: 40px;\n height: var(--hi-v4-height-lg, 40px);\n font-size: 1rem;\n font-size: var(--hi-v4-text-size-lg, 1rem);\n line-height: 1.5rem;\n line-height: var(--hi-v4-text-lineheight-lg, 1.5rem);\n border-radius: 4px;\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n padding: 5px calc(12px - 1px);\n padding: 5px calc(var(--hi-v4-spacing-6, 12px) - 1px); }\n.hi-v4-tag-input-mock--appearance-line {\n border-color: #dfe2e8;\n border-color: var(--hi-v4-color-gray-300, #dfe2e8); }\n.hi-v4-tag-input-mock--appearance-line:not(.hi-v4-tag-input-mock--disabled):hover {\n border-color: #237ffa;\n border-color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-line:not(.hi-v4-tag-input-mock--disabled).focused {\n -webkit-box-shadow: 0 0 0 2px #bde2ff;\n box-shadow: 0 0 0 2px #bde2ff;\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n box-shadow: 0 0 0 2px var(--hi-v4-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n border-color: #237ffa;\n border-color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-line:not(.hi-v4-tag-input-mock--disabled).invalid {\n border-color: #ff5959;\n border-color: var(--hi-v4-danger-500, var(--hi-v4-color-red-500, #ff5959)); }\n.hi-v4-tag-input-mock--appearance-line:not(.hi-v4-tag-input-mock--disabled).invalid.hover {\n border-color: #ff5959;\n border-color: var(--hi-v4-danger-500, var(--hi-v4-color-red-500, #ff5959)); }\n.hi-v4-tag-input-mock--appearance-line:not(.hi-v4-tag-input-mock--disabled).invalid.focused {\n -webkit-box-shadow: 0 0 0 2px #ffd1c9;\n box-shadow: 0 0 0 2px #ffd1c9;\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-danger-100, var(--hi-v4-color-red-100, #ffd1c9));\n box-shadow: 0 0 0 2px var(--hi-v4-danger-100, var(--hi-v4-color-red-100, #ffd1c9)); }\n.hi-v4-tag-input-mock--appearance-unset {\n width: auto;\n -webkit-box-pack: start;\n -ms-flex-pack: start;\n justify-content: flex-start;\n border-color: transparent; }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled):hover {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled):hover .hi-v4-tag-input-mock__tag {\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled):hover .hi-v4-tag-input-mock__tag--total {\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled):hover.hi-v4-tag-input-mock--expandable .hi-v4-tag-input-mock__tag--total {\n background-color: #e2f3fe;\n background-color: var(--hi-v4-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));\n color: #237ffa;\n color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).focused {\n -webkit-box-shadow: 0 0 0 2px #bde2ff;\n box-shadow: 0 0 0 2px #bde2ff;\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n box-shadow: 0 0 0 2px var(--hi-v4-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff);\n border-color: #237ffa;\n border-color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).focused .hi-v4-tag-input-mock__tag {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).focused .hi-v4-tag-input-mock__tag--total {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).focused.hi-v4-tag-input-mock--expandable .hi-v4-tag-input-mock__tag--total {\n background-color: #e2f3fe;\n background-color: var(--hi-v4-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));\n color: #237ffa;\n color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).invalid {\n border-color: #ff5959;\n border-color: var(--hi-v4-danger-500, var(--hi-v4-color-red-500, #ff5959)); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).invalid.hover {\n border-color: #ff5959;\n border-color: var(--hi-v4-danger-500, var(--hi-v4-color-red-500, #ff5959)); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).invalid.focused {\n -webkit-box-shadow: 0 0 0 2px #ffd1c9;\n box-shadow: 0 0 0 2px #ffd1c9;\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-danger-100, var(--hi-v4-color-red-100, #ffd1c9));\n box-shadow: 0 0 0 2px var(--hi-v4-danger-100, var(--hi-v4-color-red-100, #ffd1c9)); }\n.hi-v4-tag-input-mock--appearance-filled {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled .hi-v4-tag-input-mock__tag {\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-filled .hi-v4-tag-input-mock__tag--total {\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-filled.hi-v4-tag-input-mock--expandable .hi-v4-tag-input-mock__tag--total {\n background-color: #e2f3fe;\n background-color: var(--hi-v4-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));\n color: #237ffa;\n color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled):hover {\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff);\n border-color: #237ffa;\n border-color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled):hover .hi-v4-tag-input-mock__tag {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled):hover .hi-v4-tag-input-mock__tag--total {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled):hover.hi-v4-tag-input-mock--expandable .hi-v4-tag-input-mock__tag--total {\n background-color: #e2f3fe;\n background-color: var(--hi-v4-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));\n color: #237ffa;\n color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).focused {\n -webkit-box-shadow: 0 0 0 2px #bde2ff;\n box-shadow: 0 0 0 2px #bde2ff;\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n box-shadow: 0 0 0 2px var(--hi-v4-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n border-color: #237ffa;\n border-color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).focused .hi-v4-tag-input-mock__tag {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).focused .hi-v4-tag-input-mock__tag--total {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).focused.hi-v4-tag-input-mock--expandable .hi-v4-tag-input-mock__tag--total {\n background-color: #e2f3fe;\n background-color: var(--hi-v4-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));\n color: #237ffa;\n color: var(--hi-v4-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).invalid {\n border-color: #ff5959;\n border-color: var(--hi-v4-danger-500, var(--hi-v4-color-red-500, #ff5959)); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).invalid.hover {\n border-color: #ff5959;\n border-color: var(--hi-v4-danger-500, var(--hi-v4-color-red-500, #ff5959)); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).invalid.focused {\n -webkit-box-shadow: 0 0 0 2px #ffd1c9;\n box-shadow: 0 0 0 2px #ffd1c9;\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-danger-100, var(--hi-v4-color-red-100, #ffd1c9));\n box-shadow: 0 0 0 2px var(--hi-v4-danger-100, var(--hi-v4-color-red-100, #ffd1c9)); }\n.hi-v4-tag-input-mock--appearance-line.hi-v4-tag-input-mock--disabled, .hi-v4-tag-input-mock--appearance-unset.hi-v4-tag-input-mock--disabled, .hi-v4-tag-input-mock--appearance-filled.hi-v4-tag-input-mock--disabled {\n color: #c9ced6;\n color: var(--hi-v4-color-gray-400, #c9ced6); }\n.hi-v4-tag-input-mock--appearance-line.hi-v4-tag-input-mock--disabled, .hi-v4-tag-input-mock--appearance-filled.hi-v4-tag-input-mock--disabled {\n background-color: #ebedf0;\n background-color: var(--hi-v4-color-gray-200, #ebedf0); }\n";
10
+ var css_248z = "@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n.hi-v4-tag-input {\n position: relative;\n -webkit-box-flex: 1;\n -ms-flex: 1 1;\n flex: 1 1; }\n.hi-v4-tag-input__container {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n width: 100%;\n min-width: 160px;\n font-size: 14px;\n vertical-align: middle;\n color: var(--hi-v4-color-static-black, #000);\n border: 1px solid transparent;\n background-color: var(--hi-v4-color-static-white, #fff);\n -webkit-transition: all 0.3s;\n transition: all 0.3s;\n padding: 4px 10px;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n min-height: 32px;\n overflow: hidden;\n border-color: var(--hi-v4-color-gray-300, #dfe2e8);\n border-radius: 4px; }\n.hi-v4-tag-input__container:not(.disabled):hover {\n border-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input__container:not(.disabled).focused {\n border-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input__container.disabled {\n cursor: not-allowed;\n color: var(--hi-v4-color-gray-500, #929aa6);\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input__container.disabled .hi-v4-tag-input__tag {\n background-color: var(--hi-v4-color-gray-200, #ebedf0); }\n.hi-v4-tag-input__placeholder {\n color: var(--hi-v4-color-gray-500, #929aa6); }\n.hi-v4-tag-input__suffix {\n font-size: 16px;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-pack: end;\n -ms-flex-pack: end;\n justify-content: flex-end;\n min-width: 32px; }\n.hi-v4-tag-input__clear {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n width: 16px;\n height: 16px;\n font-size: 14px;\n color: var(--hi-v4-color-gray-500, #929aa6);\n -ms-flex-negative: 0;\n flex-shrink: 0;\n cursor: pointer;\n -webkit-transition: all 0.3s;\n transition: all 0.3s; }\n.hi-v4-tag-input__clear:hover {\n color: var(--hi-v4-color-static-black, #000); }\n.hi-v4-tag-input__value {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n width: 100%;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n height: 22px;\n line-height: 22px; }\n.hi-v4-tag-input__tags {\n -webkit-box-flex: 0;\n -ms-flex: 0 1 auto;\n flex: 0 1 auto;\n display: inline-block;\n width: -webkit-fit-content;\n width: -moz-fit-content;\n width: fit-content;\n white-space: nowrap;\n height: 100%;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n margin-top: -4px;\n position: relative; }\n.hi-v4-tag-input__tag, .hi-v4-tag-input__tag--left {\n display: inline-block;\n margin-right: 4px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 0 8px;\n vertical-align: middle;\n font-size: 12px;\n color: #333;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7);\n border-radius: 4px; }\n.hi-v4-tag-input__tag--total {\n display: inline-block;\n margin-right: 6px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 0 8px;\n vertical-align: middle;\n font-size: 12px;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background-color: var(--hi-v4-color-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));\n border-radius: 4px;\n line-height: 22px;\n cursor: inherit; }\n.hi-v4-tag-input__tag {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center; }\n.hi-v4-tag-input__tag-content {\n display: inline-block;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n -webkit-box-sizing: border-box;\n box-sizing: border-box; }\n.hi-v4-tag-input__tag-closed {\n margin-left: var(--hi-v4-spacing-4, 8px);\n font-size: 12px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n color: #8e8e8e;\n cursor: pointer; }\n.disabled .hi-v4-tag-input__tag-closed {\n cursor: not-allowed; }\n.hi-v4-tag-input__tag--left {\n margin: 0;\n max-width: 54px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n vertical-align: middle; }\n.hi-v4-tag-input--nowrap .hi-v4-tag-input__value {\n width: calc(100% - 64px);\n overflow-x: hidden; }\n.hi-v4-tag-input--wrap .hi-v4-tag-input__value {\n height: auto; }\n.hi-v4-tag-input--wrap .hi-v4-tag-input__tags {\n white-space: normal;\n margin-top: -4px; }\n.hi-v4-tag-input--wrap .hi-v4-tag-input__tag {\n margin-top: 4px; }\n.hi-v4-tag-input--expanded {\n position: relative; }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand {\n position: absolute;\n top: 0;\n left: 0;\n height: auto;\n z-index: 1;\n -webkit-box-flex: 1;\n -ms-flex: 1 1;\n flex: 1 1;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n width: 100%;\n min-width: 160px;\n font-size: 14px;\n vertical-align: middle;\n color: var(--hi-v4-color-static-black, #000);\n border: 1px solid transparent;\n background-color: use-color-statc(\"white\");\n -webkit-transition: all 0.3s;\n transition: all 0.3s;\n padding: 3px 0;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -webkit-box-align: start;\n -ms-flex-align: start;\n align-items: flex-start;\n min-height: 32px;\n overflow: hidden;\n border-radius: 4px;\n border-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__value {\n height: -webkit-fit-content;\n height: -moz-fit-content;\n height: fit-content;\n max-height: 74px;\n -webkit-box-align: stretch;\n -ms-flex-align: stretch;\n align-items: stretch;\n overflow: scroll;\n padding-left: 10px; }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__tags {\n white-space: normal;\n margin-top: -4px; }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__tag {\n margin-top: 4px; }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__suffix {\n -webkit-box-align: start;\n -ms-flex-align: start;\n align-items: flex-start;\n padding: 4px 10px 4px 0;\n position: sticky;\n top: 0; }\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n.hi-v4-tag-input-mock {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n border: none;\n outline: none;\n -webkit-box-shadow: none;\n box-shadow: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n cursor: text;\n background-color: transparent;\n -webkit-tap-highlight-color: transparent;\n position: relative;\n overflow: hidden;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-flex: 1;\n -ms-flex: 1 1;\n flex: 1 1;\n -webkit-transition-property: all;\n transition-property: all;\n -webkit-transition-duration: var(--hi-v4-motion-duration-normal, 200ms);\n transition-duration: var(--hi-v4-motion-duration-normal, 200ms);\n -webkit-transition-timing-function: var(--hi-v4-motion-bezier-normal, cubic-bezier(0.37, 0.02, 0.34, 1));\n transition-timing-function: var(--hi-v4-motion-bezier-normal, cubic-bezier(0.37, 0.02, 0.34, 1));\n width: 100%;\n height: auto;\n z-index: auto;\n font-size: inherit;\n line-height: inherit;\n color: var(--hi-v4-color-gray-700, #1f2733);\n border: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-static-transparent, transparent);\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock:not(.hi-v4-tag-input-mock--disabled):hover {\n z-index: calc(var(--hi-v4-zindex-absolute, 1) + 1); }\n.hi-v4-tag-input-mock:not(.hi-v4-tag-input-mock--disabled).focused {\n z-index: calc(var(--hi-v4-zindex-absolute, 1) + 1); }\n.hi-v4-tag-input-mock.hi-v4-tag-input-mock--disabled {\n cursor: not-allowed; }\n.hi-v4-tag-input-mock.hi-v4-tag-input-mock--disabled .hi-v4-tag-input-mock__tag {\n background-color: var(--hi-v4-color-gray-200, #ebedf0); }\n.hi-v4-tag-input-mock--wrap .hi-v4-tag-input-mock__value {\n height: auto; }\n.hi-v4-tag-input-mock--wrap .hi-v4-tag-input-mock__tags {\n white-space: normal; }\n.hi-v4-tag-input-mock__suffix {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n -webkit-box-pack: end;\n -ms-flex-pack: end;\n justify-content: flex-end;\n -ms-flex-negative: 0;\n flex-shrink: 0;\n color: var(--hi-v4-color-static-black, #000);\n font-size: var(--hi-v4-text-size-lg, 1rem);\n padding: 0;\n text-align: center; }\n.hi-v4-tag-input-mock__clear {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n width: 16px;\n height: 16px;\n font-size: var(--hi-v4-text-size-normal, 0.875rem);\n color: var(--hi-v4-color-gray-500, #929aa6);\n text-align: center;\n -ms-flex-negative: 0;\n flex-shrink: 0;\n cursor: pointer;\n -webkit-transition-property: all;\n transition-property: all;\n -webkit-transition-duration: var(--hi-v4-motion-duration-normal, 200ms);\n transition-duration: var(--hi-v4-motion-duration-normal, 200ms);\n -webkit-transition-timing-function: var(--hi-v4-motion-bezier-normal, cubic-bezier(0.37, 0.02, 0.34, 1));\n transition-timing-function: var(--hi-v4-motion-bezier-normal, cubic-bezier(0.37, 0.02, 0.34, 1)); }\n.hi-v4-tag-input-mock__clear:hover {\n color: var(--hi-v4-color-static-black, #000); }\n.hi-v4-tag-input-mock__tags {\n position: relative;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n white-space: nowrap;\n overflow: hidden; }\n.hi-v4-tag-input-mock__tag--total {\n display: inline-block;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n vertical-align: middle;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n cursor: inherit;\n margin-left: var(--hi-v4-spacing-4, 8px);\n margin-right: var(--hi-v4-spacing-3, 6px);\n padding: 0 var(--hi-v4-spacing-4, 8px);\n font-size: var(--hi-v4-text-size-sm, 0.75rem);\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);\n background-color: var(--hi-v4-color-gray-100, #f2f4f7);\n color: var(--hi-v4-color-gray-700, #1f2733); }\n.hi-v4-tag-input-mock--expandable .hi-v4-tag-input-mock__tag--total {\n background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));\n color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock__suffix, .hi-v4-tag-input-mock__placeholder {\n color: var(--hi-v4-color-gray-400, #c9ced6); }\n.hi-v4-tag-input-mock__tag, .hi-v4-tag-input-mock__placeholder {\n margin-top: var(--hi-v4-spacing-1, 2px);\n margin-bottom: var(--hi-v4-spacing-1, 2px); }\n.hi-v4-tag-input-mock__tag {\n max-width: 100%;\n margin-right: var(--hi-v4-spacing-2, 4px);\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 0 var(--hi-v4-spacing-4, 8px);\n vertical-align: middle;\n font-size: var(--hi-v4-text-size-sm, 0.75rem);\n color: var(--hi-v4-color-gray-700, #1f2733);\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7);\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n position: relative;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-flex: 0;\n -ms-flex: none;\n flex: none;\n line-height: inherit; }\n.hi-v4-tag-input-mock__tag-content {\n display: inline-block;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n -webkit-box-sizing: border-box;\n box-sizing: border-box; }\n.hi-v4-tag-input-mock__tag-closed {\n margin-left: var(--hi-v4-spacing-2, 4px);\n font-size: var(--hi-v4-text-size-sm, 0.75rem);\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n color: var(--hi-v4-color-gray-500, #929aa6);\n cursor: pointer; }\n.hi-v4-tag-input-mock__tag-closed:hover {\n color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--disabled .hi-v4-tag-input-mock__tag-closed {\n cursor: not-allowed; }\n.hi-v4-tag-input-mock--disabled .hi-v4-tag-input-mock__tag-closed:hover {\n color: var(--hi-v4-color-gray-500, #929aa6); }\n.hi-v4-tag-input-mock--size-sm {\n height: var(--hi-v4-height-sm, 24px);\n font-size: var(--hi-v4-text-size-sm, 0.75rem);\n line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n padding: 0 calc(var(--hi-v4-spacing-6, 12px) - 1px); }\n.hi-v4-tag-input-mock--size-sm .hi-v4-tag-input-mock__tag,\n .hi-v4-tag-input-mock--size-sm .hi-v4-tag-input-mock__placeholder {\n margin-top: 1px;\n margin-bottom: 1px; }\n.hi-v4-tag-input-mock--size-md {\n height: var(--hi-v4-height-normal, 32px);\n font-size: var(--hi-v4-text-size-normal, 0.875rem);\n line-height: var(--hi-v4-text-lineheight-normal, 1.375rem);\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n padding: 2px calc(var(--hi-v4-spacing-6, 12px) - 1px); }\n.hi-v4-tag-input-mock--size-lg {\n height: var(--hi-v4-height-lg, 40px);\n font-size: var(--hi-v4-text-size-lg, 1rem);\n line-height: var(--hi-v4-text-lineheight-lg, 1.5rem);\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n padding: 5px calc(var(--hi-v4-spacing-6, 12px) - 1px); }\n.hi-v4-tag-input-mock--appearance-line {\n border-color: var(--hi-v4-color-gray-300, #dfe2e8); }\n.hi-v4-tag-input-mock--appearance-line:not(.hi-v4-tag-input-mock--disabled):hover {\n border-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-line:not(.hi-v4-tag-input-mock--disabled).focused {\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n box-shadow: 0 0 0 2px var(--hi-v4-color-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n border-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-line:not(.hi-v4-tag-input-mock--disabled).invalid {\n border-color: var(--hi-v4-color-danger-500, var(--hi-v4-color-red-500, #ff5959)); }\n.hi-v4-tag-input-mock--appearance-line:not(.hi-v4-tag-input-mock--disabled).invalid.hover {\n border-color: var(--hi-v4-color-danger-500, var(--hi-v4-color-red-500, #ff5959)); }\n.hi-v4-tag-input-mock--appearance-line:not(.hi-v4-tag-input-mock--disabled).invalid.focused {\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-danger-100, var(--hi-v4-color-red-100, #ffd1c9));\n box-shadow: 0 0 0 2px var(--hi-v4-color-danger-100, var(--hi-v4-color-red-100, #ffd1c9)); }\n.hi-v4-tag-input-mock--appearance-unset {\n width: auto;\n -webkit-box-pack: start;\n -ms-flex-pack: start;\n justify-content: flex-start;\n border-color: transparent; }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled):hover {\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled):hover .hi-v4-tag-input-mock__tag {\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled):hover .hi-v4-tag-input-mock__tag--total {\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled):hover.hi-v4-tag-input-mock--expandable .hi-v4-tag-input-mock__tag--total {\n background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));\n color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).focused {\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n box-shadow: 0 0 0 2px var(--hi-v4-color-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n background-color: var(--hi-v4-color-static-white, #fff);\n border-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).focused .hi-v4-tag-input-mock__tag {\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).focused .hi-v4-tag-input-mock__tag--total {\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).focused.hi-v4-tag-input-mock--expandable .hi-v4-tag-input-mock__tag--total {\n background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));\n color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).invalid {\n border-color: var(--hi-v4-color-danger-500, var(--hi-v4-color-red-500, #ff5959)); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).invalid.hover {\n border-color: var(--hi-v4-color-danger-500, var(--hi-v4-color-red-500, #ff5959)); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).invalid.focused {\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-danger-100, var(--hi-v4-color-red-100, #ffd1c9));\n box-shadow: 0 0 0 2px var(--hi-v4-color-danger-100, var(--hi-v4-color-red-100, #ffd1c9)); }\n.hi-v4-tag-input-mock--appearance-filled {\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled .hi-v4-tag-input-mock__tag {\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-filled .hi-v4-tag-input-mock__tag--total {\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-filled.hi-v4-tag-input-mock--expandable .hi-v4-tag-input-mock__tag--total {\n background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));\n color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled):hover {\n background-color: var(--hi-v4-color-static-white, #fff);\n border-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled):hover .hi-v4-tag-input-mock__tag {\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled):hover .hi-v4-tag-input-mock__tag--total {\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled):hover.hi-v4-tag-input-mock--expandable .hi-v4-tag-input-mock__tag--total {\n background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));\n color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).focused {\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n box-shadow: 0 0 0 2px var(--hi-v4-color-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));\n border-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).focused .hi-v4-tag-input-mock__tag {\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).focused .hi-v4-tag-input-mock__tag--total {\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).focused.hi-v4-tag-input-mock--expandable .hi-v4-tag-input-mock__tag--total {\n background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));\n color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).invalid {\n border-color: var(--hi-v4-color-danger-500, var(--hi-v4-color-red-500, #ff5959)); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).invalid.hover {\n border-color: var(--hi-v4-color-danger-500, var(--hi-v4-color-red-500, #ff5959)); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).invalid.focused {\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-danger-100, var(--hi-v4-color-red-100, #ffd1c9));\n box-shadow: 0 0 0 2px var(--hi-v4-color-danger-100, var(--hi-v4-color-red-100, #ffd1c9)); }\n.hi-v4-tag-input-mock--appearance-line.hi-v4-tag-input-mock--disabled, .hi-v4-tag-input-mock--appearance-unset.hi-v4-tag-input-mock--disabled, .hi-v4-tag-input-mock--appearance-filled.hi-v4-tag-input-mock--disabled {\n color: var(--hi-v4-color-gray-400, #c9ced6); }\n.hi-v4-tag-input-mock--appearance-line.hi-v4-tag-input-mock--disabled, .hi-v4-tag-input-mock--appearance-filled.hi-v4-tag-input-mock--disabled {\n background-color: var(--hi-v4-color-gray-200, #ebedf0); }\n";
11
11
 
12
12
  var __styleInject__ = require('style-inject/dist/style-inject.es.js')["default"];
13
13
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hi-ui/tag-input",
3
- "version": "4.0.0-beta.2",
3
+ "version": "4.0.0-beta.3",
4
4
  "description": "A sub-package for @hi-ui/hiui.",
5
5
  "keywords": [],
6
6
  "author": "HIUI <mi-hiui@xiaomi.com>",
@@ -44,15 +44,15 @@
44
44
  },
45
45
  "dependencies": {
46
46
  "@hi-ui/classname": "^4.0.0-beta.0",
47
- "@hi-ui/core": "^4.0.0-beta.1",
48
- "@hi-ui/core-css": "^4.0.0-beta.1",
47
+ "@hi-ui/core": "^4.0.0-beta.2",
48
+ "@hi-ui/core-css": "^4.0.0-beta.2",
49
49
  "@hi-ui/env": "^4.0.0-beta.0",
50
- "@hi-ui/icons": "^4.0.0-beta.1",
51
- "@hi-ui/type-assertion": "^4.0.0-beta.0",
52
- "@hi-ui/use-latest": "^4.0.0-beta.0",
53
- "@hi-ui/use-merge-refs": "^4.0.0-beta.0",
54
- "@hi-ui/use-outside-click": "^4.0.0-beta.0",
55
- "@hi-ui/use-uncontrolled-state": "^4.0.0-beta.0",
50
+ "@hi-ui/icons": "^4.0.0-beta.2",
51
+ "@hi-ui/type-assertion": "^4.0.0-beta.1",
52
+ "@hi-ui/use-latest": "^4.0.0-beta.1",
53
+ "@hi-ui/use-merge-refs": "^4.0.0-beta.1",
54
+ "@hi-ui/use-outside-click": "^4.0.0-beta.1",
55
+ "@hi-ui/use-uncontrolled-state": "^4.0.0-beta.1",
56
56
  "react-resize-detector": "^6.7.6"
57
57
  },
58
58
  "peerDependencies": {
@@ -60,9 +60,9 @@
60
60
  "react-dom": ">=16.8.6"
61
61
  },
62
62
  "devDependencies": {
63
- "@hi-ui/hi-build": "^4.0.0-beta.0",
63
+ "@hi-ui/hi-build": "^4.0.0-beta.1",
64
64
  "react": "^17.0.1",
65
65
  "react-dom": "^17.0.1"
66
66
  },
67
- "gitHead": "e44279db28297930b5608023f96343780d1f4e1c"
67
+ "gitHead": "34009f66090d5e0003a9453c9f0f743e74438815"
68
68
  }