@qikdev/vue-ui 0.2.311 → 0.2.314

package/dist/style.css

@@ -913,27 +913,28 @@ tr.inactive[data-v-323b93e8]:after {
   background: #b14e4e;
   color: #fff;
 }
-.basic-input-style[data-v-bdd928b4] {
+.basic-input-style[data-v-0acb5372] {
   color: inherit;
   background: color-mix(in lab, currentColor 4%, transparent);
   border: 1px solid color-mix(in lab, currentColor 18%, transparent);
 }
-.avatar-image[data-v-bdd928b4] {
+.avatar-image[data-v-0acb5372] {
   width: 100%;
   display: block;
   border-radius: 100%;
   overflow: hidden;
   position: relative;
   background-color: color-mix(in lab, currentColor 25%, transparent);
+  container-type: inline-size;
 }
-.avatar-image .avatar-img[data-v-bdd928b4] {
+.avatar-image .avatar-img[data-v-0acb5372] {
   background-size: cover;
   background-position: center center;
   height: 0;
   padding-bottom: 100%;
   position: relative;
 }
-.avatar-image .initials[data-v-bdd928b4] {
+.avatar-image .initials[data-v-0acb5372] {
   display: flex;
   align-items: center;
   justify-content: center;
@@ -946,38 +947,42 @@ tr.inactive[data-v-323b93e8]:after {
   font-size: 0.9em;
   font-weight: 500;
   color: var(--bg1, currentColor);
+  font-size: 50cqw;
 }
-.basic-input-style[data-v-594a0385] {
+.basic-input-style[data-v-740b543a] {
   color: inherit;
   background: color-mix(in lab, currentColor 4%, transparent);
   border: 1px solid color-mix(in lab, currentColor 18%, transparent);
 }
-.ux-spinner.large[data-v-594a0385] {
+.ux-spinner[data-v-740b543a] {
+  pointer-events: none;
+}
+.ux-spinner.large[data-v-740b543a] {
   position: absolute;
   left: 50%;
   top: 50%;
   transform: translate3d(-50%, -50%, 0);
   font-size: clamp(50px, 10vw, 500px);
 }
-.ux-spinner svg[data-v-594a0385] {
+.ux-spinner svg[data-v-740b543a] {
   width: 1em !important;
   height: 1em !important;
   stroke: currentColor;
 }
-.ux-spinner .spinner_V8m1[data-v-594a0385] {
+.ux-spinner .spinner_V8m1[data-v-740b543a] {
   transform-origin: center;
-  animation: spinner_zKoa-594a0385 2s linear infinite;
+  animation: spinner_zKoa-740b543a 2s linear infinite;
 }
-.ux-spinner .spinner_V8m1 circle[data-v-594a0385] {
+.ux-spinner .spinner_V8m1 circle[data-v-740b543a] {
   stroke-linecap: round;
-  animation: spinner_YpZS-594a0385 1.5s ease-in-out infinite;
+  animation: spinner_YpZS-740b543a 1.5s ease-in-out infinite;
 }
-@keyframes spinner_zKoa-594a0385 {
+@keyframes spinner_zKoa-740b543a {
   to {
     transform: rotate(360deg);
   }
 }
-@keyframes spinner_YpZS-594a0385 {
+@keyframes spinner_YpZS-740b543a {
   0% {
     stroke-dasharray: 0 150;
     stroke-dashoffset: 0;
@@ -992,13 +997,13 @@ tr.inactive[data-v-323b93e8]:after {
     stroke-dashoffset: -59;
   }
 }
-.ux-spinner[lg][data-v-594a0385] {
+.ux-spinner[lg][data-v-740b543a] {
   font-size: 2em;
 }
-.ux-spinner[xl][data-v-594a0385] {
+.ux-spinner[xl][data-v-740b543a] {
   font-size: 4em;
 }
-.ux-spinner[xxl][data-v-594a0385] {
+.ux-spinner[xxl][data-v-740b543a] {
   font-size: 6em;
 }
 .basic-input-style[data-v-ea56e98b] {
@@ -1256,27 +1261,27 @@ a.disabled[data-v-7a924ee2] {
   width: 1em;
   text-align: center;
 }
-.basic-input-style[data-v-a19aee17] {
+.basic-input-style[data-v-7ef96353] {
   color: inherit;
   background: color-mix(in lab, currentColor 4%, transparent);
   border: 1px solid color-mix(in lab, currentColor 18%, transparent);
 }
-.ux-menu-outer[data-v-a19aee17] {
+.ux-menu-outer[data-v-7ef96353] {
   position: absolute;
   z-index: 10;
   font-size: 12px;
 }
-.ux-menu-panel[data-v-a19aee17] {
+.ux-menu-panel[data-v-7ef96353] {
   position: absolute;
   max-height: 70vh;
   overflow: auto;
   border: 1px solid color-mix(in lab, currentColor 10%, transparent);
   box-shadow: 0 0.2em 1em #0000001a;
 }
-.ux-menu-panel.flex[data-v-a19aee17] {
+.ux-menu-panel.flex[data-v-7ef96353] {
   display: flex;
 }
-.ux-menu-panel[data-v-a19aee17] .ux-list-item {
+.ux-menu-panel[data-v-7ef96353] .ux-list-item {
   white-space: nowrap;
   text-overflow: ellipsis;
   overflow: hidden;
@@ -1474,19 +1479,19 @@ li.expanded > .ux-link .caret[data-v-cbfd31c1] {
 .ux-list-item[data-v-a5de8929]:hover {
   background: color-mix(in lab, currentColor 5%, transparent);
 }
-.basic-input-style[data-v-8e1886fb] {
+.basic-input-style[data-v-de5516aa] {
   color: inherit;
   background: color-mix(in lab, currentColor 4%, transparent);
   border: 1px solid color-mix(in lab, currentColor 18%, transparent);
 }
-.cell[data-v-8e1886fb] {
+.cell[data-v-de5516aa] {
   display: flex;
   min-width: 150px;
 }
-.cell > div[data-v-8e1886fb] {
+.cell > div[data-v-de5516aa] {
   flex: 1;
 }
-.cell label[data-v-8e1886fb] {
+.cell label[data-v-de5516aa] {
   display: block;
   font-size: 0.8em;
   margin-bottom: 0.3em;
@@ -1494,12 +1499,12 @@ li.expanded > .ux-link .caret[data-v-cbfd31c1] {
   font-weight: 700;
   opacity: 0.5;
 }
-.cell input[data-v-8e1886fb] {
+.cell input[data-v-de5516aa] {
   min-width: 150px;
   flex: 1;
   width: 100%;
 }
-input[data-v-8e1886fb] {
+input[data-v-de5516aa] {
   border-radius: 0.1em;
   padding: 0.5em;
   box-sizing: border-box;
@@ -1511,7 +1516,7 @@ input[data-v-8e1886fb] {
   height: 2.5em;
   color: inherit;
 }
-input[data-v-8e1886fb]:focus {
+input[data-v-de5516aa]:focus {
   background: none;
   border: 1px solid var(--primary);
   outline: none;
@@ -1862,6 +1867,146 @@ input[data-v-1078f395]:focus {
     border-bottom: 1px solid color-mix(in lab, currentColor 18%, transparent);
   }
 }
+.basic-input-style[data-v-6ddd93f2] {
+  color: inherit;
+  background: color-mix(in lab, currentColor 4%, transparent);
+  border: 1px solid color-mix(in lab, currentColor 18%, transparent);
+}
+.search[data-v-6ddd93f2] {
+  position: relative;
+  width: 100%;
+}
+.search > .icon[data-v-6ddd93f2] {
+  position: absolute;
+  right: 0;
+  top: 50%;
+  translate: 0 -50%;
+  bottom: 0;
+  padding: 0 1em;
+}
+.search input[data-v-6ddd93f2] {
+  width: 100%;
+  border-radius: 5em;
+  padding: 0.5em 1em;
+  box-sizing: border-box;
+  font-size: inherit;
+  appearance: none;
+  line-height: 1;
+  color: inherit;
+  background: color-mix(in lab, currentColor 6%, transparent);
+  border: 1px solid transparent;
+}
+.search input[data-v-6ddd93f2]:focus {
+  background: var(--bg1, #fff);
+  border: 1px solid var(--primary);
+  outline: none;
+}
+.basic-input-style[data-v-1f0deee2] {
+  color: inherit;
+  background: color-mix(in lab, currentColor 4%, transparent);
+  border: 1px solid color-mix(in lab, currentColor 18%, transparent);
+}
+.invisible[data-v-1f0deee2] {
+  opacity: 0.5;
+  pointer-events: none;
+}
+.search-component[data-v-1f0deee2] {
+  position: relative;
+  width: 100%;
+}
+.face[data-v-1f0deee2] {
+  width: 20px;
+}
+.ux-content-search-selected-items[data-v-1f0deee2] {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+  margin-bottom: 8px;
+}
+.ux-content-search-selected-item[data-v-1f0deee2] {
+  background-color: #f0f0f0;
+  padding: 4px 8px;
+  border-radius: 4px;
+  font-size: 14px;
+}
+.ux-content-search-options[data-v-1f0deee2] {
+  position: absolute;
+  max-height: 20vh;
+  overflow-y: auto;
+  z-index: 100;
+  box-shadow: 0 4px 6px #0000001a;
+  border: 1px solid color-mix(in lab, currentColor, var(--bg1));
+  border-radius: 4px;
+  margin-top: 4px;
+  background-color: var(--bg1);
+}
+.ux-content-search-option.active[data-v-1f0deee2] {
+  background-color: color-mix(in lab, var(--primary) 15%, var(--bg1));
+}
+.basic-input-style[data-v-ec70a3d8],
+input[data-v-ec70a3d8] {
+  color: inherit;
+  background: color-mix(in lab, currentColor 4%, transparent);
+  border: 1px solid color-mix(in lab, currentColor 18%, transparent);
+}
+.ux-text-row[data-v-ec70a3d8] {
+  margin-bottom: 0.5em;
+}
+[data-v-ec70a3d8] .ux-list {
+  font-size: 0.9em;
+}
+input[data-v-ec70a3d8] {
+  border-radius: 0.1em;
+  padding: 0.5em;
+  box-sizing: border-box;
+  font-size: inherit;
+  appearance: none;
+  line-height: 1;
+  height: 2.5em;
+}
+input[data-v-ec70a3d8]:focus {
+  background: none;
+  border: 1px solid var(--primary);
+  outline: none;
+}
+.ux-text-row .ux-btn[data-v-ec70a3d8] {
+  margin-left: 0.25em;
+}
+.ux-text-input-multiple[data-v-ec70a3d8] {
+  width: 100%;
+}
+.ux-text-input-single[data-v-ec70a3d8] {
+  width: calc(100% - 0.5em);
+  margin: 0 0.5em 0 0;
+}
+.items[data-v-ec70a3d8] {
+  border-radius: 0.3em;
+  overflow: hidden;
+  margin-bottom: 0.5em;
+}
+@media (prefers-color-scheme: light) {
+  .items[data-v-ec70a3d8] {
+    border: 1px solid color-mix(in lab, currentColor 15%, transparent);
+  }
+}
+@media (prefers-color-scheme: dark) {
+  .items[data-v-ec70a3d8] {
+    border: 1px solid color-mix(in lab, currentColor 18%, transparent);
+  }
+}
+.items .content-item[data-v-ec70a3d8] {
+  border: none;
+}
+@media (prefers-color-scheme: light) {
+  .items .content-item[data-v-ec70a3d8] {
+    border-bottom: 1px solid color-mix(in lab, currentColor 15%, transparent);
+  }
+}
+@media (prefers-color-scheme: dark) {
+  .items .content-item[data-v-ec70a3d8] {
+    border-bottom: 1px solid color-mix(in lab, currentColor 18%, transparent);
+  }
+}
 .basic-input-style[data-v-17c04ff2] {
   color: inherit;
   background: color-mix(in lab, currentColor 4%, transparent);
@@ -2400,19 +2545,19 @@ textarea[data-v-a44b8610]:focus {
 .ux-text-area-single[data-v-a44b8610] {
   width: 100%;
 }
-.basic-input-style[data-v-36fae159] {
+.basic-input-style[data-v-1b7b8bfb] {
   color: inherit;
   background: color-mix(in lab, currentColor 4%, transparent);
   border: 1px solid color-mix(in lab, currentColor 18%, transparent);
 }
-.filter-condition[data-v-36fae159] {
+.filter-condition[data-v-1b7b8bfb] {
   padding: 0.2em;
   border-radius: 0.3em;
   background: var(--bg1, #fff);
   border: 1px solid rgba(0, 0, 0, 0.1);
   margin: 0.2em 0.5em;
 }
-label[data-v-36fae159] {
+label[data-v-1b7b8bfb] {
   display: block;
   text-transform: uppercase;
   font-weight: 700;
@@ -2991,40 +3136,6 @@ input[data-v-c8feb6c2]:focus {
   display: flex;
   min-height: 300px;
 }
-.basic-input-style[data-v-6ddd93f2] {
-  color: inherit;
-  background: color-mix(in lab, currentColor 4%, transparent);
-  border: 1px solid color-mix(in lab, currentColor 18%, transparent);
-}
-.search[data-v-6ddd93f2] {
-  position: relative;
-  width: 100%;
-}
-.search > .icon[data-v-6ddd93f2] {
-  position: absolute;
-  right: 0;
-  top: 50%;
-  translate: 0 -50%;
-  bottom: 0;
-  padding: 0 1em;
-}
-.search input[data-v-6ddd93f2] {
-  width: 100%;
-  border-radius: 5em;
-  padding: 0.5em 1em;
-  box-sizing: border-box;
-  font-size: inherit;
-  appearance: none;
-  line-height: 1;
-  color: inherit;
-  background: color-mix(in lab, currentColor 6%, transparent);
-  border: 1px solid transparent;
-}
-.search input[data-v-6ddd93f2]:focus {
-  background: var(--bg1, #fff);
-  border: 1px solid var(--primary);
-  outline: none;
-}
 .basic-input-style[data-v-a40a42bc] {
   color: inherit;
   background: color-mix(in lab, currentColor 4%, transparent);
@@ -3382,18 +3493,18 @@ td[data-v-f5a130e8]:first-child {
   border-color: var(--primary);
   opacity: 0.5;
 }
-.basic-input-style[data-v-8a2384ee] {
+.basic-input-style[data-v-b5298f2c] {
   color: inherit;
   background: color-mix(in lab, currentColor 4%, transparent);
   border: 1px solid color-mix(in lab, currentColor 18%, transparent);
 }
-.ux-field[data-v-8a2384ee] {
+.ux-field[data-v-b5298f2c] {
   margin-bottom: 1em;
 }
-.ux-field.ux-layout-only[data-v-8a2384ee] {
+.ux-field.ux-layout-only[data-v-b5298f2c] {
   margin-bottom: 0;
 }
-.ux-field .ux-field-message[data-v-8a2384ee] {
+.ux-field .ux-field-message[data-v-b5298f2c] {
   border: red;
   background: rgba(255, 0, 0, 0.1);
   color: red;
@@ -3403,23 +3514,23 @@ td[data-v-f5a130e8]:first-child {
   margin: 0.3em 0;
   display: inline-block;
 }
-[data-v-8a2384ee] .ux-field-title {
+[data-v-b5298f2c] .ux-field-title {
   margin-top: 0.5em;
   display: block;
   margin-bottom: 0.2em;
   font-size: 0.9em;
   font-weight: 700;
 }
-.ux-field.ux-field-hide[data-v-8a2384ee] {
+.ux-field.ux-field-hide[data-v-b5298f2c] {
   display: none !important;
   margin: 0 !important;
 }
-[data-v-8a2384ee] .ux-field-description {
+[data-v-b5298f2c] .ux-field-description {
   font-size: clamp(12px, 0.8em, 16px);
   opacity: 0.5;
   margin-bottom: 0.5em;
 }
-.ux-field.ux-field-error[data-v-8a2384ee] > .ux-field-title {
+.ux-field.ux-field-error[data-v-b5298f2c] > .ux-field-title {
   color: red;
 }
 .basic-input-style[data-v-f0b9d2cd] {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qikdev/vue-ui",
-  "version": "0.2.311",
+  "version": "0.2.314",
   "files": [
     "dist"
   ],