ropav 0.0.10 → 0.0.12

package/dist/select.css

@@ -1,243 +1,256 @@
-.rp-select[data-v-abf4b97a] {
-  --_rp-select-height: var(--rp-size-control-md);
-  --_rp-select-padding-x: calc(var(--rp-size-control-md) / 3);
-  --_rp-select-font-size: var(--rp-font-size-md);
-  --_rp-select-option-min-height: calc(var(--rp-size-control-md) - var(--rp-spacing-4));
-  --_rp-select-option-padding-y: var(--rp-spacing-1);
-  --_rp-select-radius: var(--rp-radius-sm);
-  --_rp-select-invalid-border: var(--rp-color-red-filled);
-  --_rp-select-invalid-ring: color-mix(in srgb, var(--rp-color-red-filled) 32%, transparent);
-  --_rp-select-option-focused-bg: var(--rp-color-default-hover);
-  position: relative;
-  display: inline-flex;
-  font-family: var(--rp-font-family);
-  font-weight: var(--rp-font-weight-normal);
-  line-height: 1;
-}
-.rp-select--size-xs[data-v-abf4b97a] {
-  --_rp-select-height: var(--rp-size-control-xs);
-  --_rp-select-padding-x: calc(var(--rp-size-control-xs) / 3);
-  --_rp-select-font-size: var(--rp-font-size-xs);
-  --_rp-select-option-min-height: calc(var(--rp-size-control-xs) - var(--rp-spacing-2));
-  --_rp-select-option-padding-y: calc(var(--rp-spacing-1) / 2);
-}
-.rp-select--size-sm[data-v-abf4b97a] {
-  --_rp-select-height: var(--rp-size-control-sm);
-  --_rp-select-padding-x: calc(var(--rp-size-control-sm) / 3);
-  --_rp-select-font-size: var(--rp-font-size-sm);
-  --_rp-select-option-min-height: calc(var(--rp-size-control-sm) - var(--rp-spacing-3));
-  --_rp-select-option-padding-y: var(--rp-spacing-1);
-}
-.rp-select--size-md[data-v-abf4b97a] {
-  --_rp-select-height: var(--rp-size-control-md);
-  --_rp-select-padding-x: calc(var(--rp-size-control-md) / 3);
-  --_rp-select-font-size: var(--rp-font-size-md);
-  --_rp-select-option-min-height: calc(var(--rp-size-control-md) - var(--rp-spacing-4));
-  --_rp-select-option-padding-y: var(--rp-spacing-1);
-}
-.rp-select--size-lg[data-v-abf4b97a] {
-  --_rp-select-height: var(--rp-size-control-lg);
-  --_rp-select-padding-x: calc(var(--rp-size-control-lg) / 3);
-  --_rp-select-font-size: var(--rp-font-size-lg);
-  --_rp-select-option-min-height: calc(var(--rp-size-control-lg) - var(--rp-spacing-5));
-  --_rp-select-option-padding-y: calc(var(--rp-spacing-3) / 2);
-}
-.rp-select--size-xl[data-v-abf4b97a] {
-  --_rp-select-height: var(--rp-size-control-xl);
-  --_rp-select-padding-x: calc(var(--rp-size-control-xl) / 3);
-  --_rp-select-font-size: var(--rp-font-size-xl);
-  --_rp-select-option-min-height: calc(var(--rp-size-control-xl) - var(--rp-spacing-6));
-  --_rp-select-option-padding-y: var(--rp-spacing-2);
-}
-html.dark .rp-select[data-v-abf4b97a], [data-rp-color-scheme=dark] .rp-select[data-v-abf4b97a] {
-  --_rp-select-invalid-border: var(--rp-color-red-light-color);
-  --_rp-select-invalid-ring: color-mix(
-      in srgb,
-      var(--rp-color-red-light-color) 32%,
-      transparent
-  );
-  --_rp-select-option-focused-bg: var(--rp-color-default-hover);
-}
-.rp-select--disabled[data-v-abf4b97a] {
-  opacity: var(--rp-opacity-disabled);
-  cursor: not-allowed;
-}
-.rp-select__trigger[data-v-abf4b97a] {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  justify-content: space-between;
-  width: 100%;
-  min-width: 180px;
-  height: var(--_rp-select-height);
-  padding: 0 var(--_rp-select-padding-x);
-  font-size: var(--_rp-select-font-size);
-  background-color: var(--rp-color-control-bg);
-  border: var(--rp-border-width-thin) solid var(--rp-color-control-border);
-  border-radius: var(--_rp-select-radius);
-  cursor: pointer;
-  transition: border-color var(--rp-transition-fast), box-shadow var(--rp-transition-fast);
-  gap: var(--rp-spacing-2);
-}
-.rp-select__trigger[data-v-abf4b97a]:hover {
-  border-color: var(--rp-color-control-border-hover);
-}
-.rp-select__trigger[data-v-abf4b97a]:focus-visible {
-  outline: none;
-  border-color: var(--rp-color-control-border-focus);
-  box-shadow: 0 0 0 var(--rp-border-width-medium) var(--rp-color-focus-ring);
-}
-.rp-select--radius-xs[data-v-abf4b97a] {
-  --_rp-select-radius: var(--rp-radius-xs);
-}
-.rp-select--radius-sm[data-v-abf4b97a] {
-  --_rp-select-radius: var(--rp-radius-sm);
-}
-.rp-select--radius-md[data-v-abf4b97a] {
-  --_rp-select-radius: var(--rp-radius-md);
-}
-.rp-select--radius-lg[data-v-abf4b97a] {
-  --_rp-select-radius: var(--rp-radius-lg);
-}
-.rp-select--radius-xl[data-v-abf4b97a] {
-  --_rp-select-radius: var(--rp-radius-xl);
-}
-.rp-select--open .rp-select__trigger[data-v-abf4b97a] {
-  border-color: var(--rp-color-control-border-focus);
-  box-shadow: 0 0 0 var(--rp-border-width-medium) var(--rp-color-focus-ring);
-}
-.rp-select--invalid .rp-select__trigger[data-v-abf4b97a] {
-  border-color: var(--_rp-select-invalid-border);
-}
-.rp-select--invalid .rp-select__trigger[data-v-abf4b97a]:focus-visible, .rp-select--open.rp-select--invalid .rp-select__trigger[data-v-abf4b97a] {
-  border-color: var(--_rp-select-invalid-border);
-  box-shadow: 0 0 0 var(--rp-border-width-medium) var(--_rp-select-invalid-ring);
-}
-.rp-select__value[data-v-abf4b97a] {
-  flex: 1;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  color: var(--rp-color-control-fg);
-}
-.rp-select__placeholder[data-v-abf4b97a] {
-  color: var(--rp-color-control-placeholder);
-}
-.rp-select__indicator[data-v-abf4b97a] {
-  display: inline-flex;
-  align-items: center;
-  width: 1em;
-  height: 1em;
-  flex-shrink: 0;
-}
-.rp-select__indicator svg[data-v-abf4b97a] {
-  width: 100%;
-  height: 100%;
-}
-.rp-select__indicator[data-v-abf4b97a] {
-  position: relative;
-  color: var(--rp-color-control-icon);
-  transform: translateX(var(--rp-spacing-1));
-}
-.rp-select__arrow[data-v-abf4b97a] {
-  display: inline-flex;
-  align-items: center;
-  width: 1em;
-  height: 1em;
-  flex-shrink: 0;
-}
-.rp-select__arrow svg[data-v-abf4b97a] {
-  width: 100%;
-  height: 100%;
-}
-.rp-select__arrow[data-v-abf4b97a] {
-  transition: opacity var(--rp-transition-fast);
-}
-.rp-select__clear[data-v-abf4b97a] {
-  padding: 0;
-  font: inherit;
-  background: none;
-  border: none;
-  cursor: pointer;
-  display: inline-flex;
-  align-items: center;
-  width: 1em;
-  height: 1em;
-  flex-shrink: 0;
-}
-.rp-select__clear svg[data-v-abf4b97a] {
-  width: 100%;
-  height: 100%;
-}
-.rp-select__clear[data-v-abf4b97a] {
-  position: absolute;
-  inset: 0;
-  z-index: 1;
-  color: var(--rp-color-control-icon);
-  opacity: 0;
-  pointer-events: none;
-  transition: color var(--rp-transition-fast), opacity var(--rp-transition-fast);
-}
-.rp-select__clear[data-v-abf4b97a]:hover {
-  color: var(--rp-color-control-fg);
-}
-.rp-select__trigger:hover .rp-select__clear[data-v-abf4b97a] {
-  opacity: 1;
-  pointer-events: auto;
-}
-.rp-select__trigger:hover .rp-select__clear + .rp-select__arrow[data-v-abf4b97a] {
-  opacity: 0;
-}
-.rp-select__dropdown[data-v-abf4b97a] {
-  position: absolute;
-  top: calc(100% + var(--rp-spacing-2));
-  left: 0;
-  right: 0;
-  z-index: 100;
-  background-color: var(--rp-color-default);
-  border: var(--rp-border-width-thin) solid var(--rp-color-default-border);
-  border-radius: var(--_rp-select-radius);
-  box-shadow: var(--rp-shadow-md);
-  padding: var(--rp-spacing-1) 0;
-  max-height: 240px;
-  overflow-y: auto;
-  padding: var(--rp-spacing-1);
-}
-.rp-select__option[data-v-abf4b97a] {
-  display: flex;
-  align-items: center;
-  min-height: var(--_rp-select-option-min-height);
-  padding: var(--_rp-select-option-padding-y) var(--_rp-select-padding-x);
-  border-radius: var(--_rp-select-radius);
-  font-size: var(--_rp-select-font-size);
-  cursor: pointer;
-  transition: color var(--rp-transition-fast);
-  color: var(--rp-color-control-fg);
-}
-.rp-select__option--focused[data-v-abf4b97a] {
-  background-color: var(--_rp-select-option-focused-bg);
-}
-.rp-select__option--selected[data-v-abf4b97a] {
-  color: var(--rp-primary-color-light-color);
-}
-.rp-select__option--disabled[data-v-abf4b97a] {
-  color: var(--rp-color-disabled-color);
-  cursor: not-allowed;
-}
-.rp-select__empty[data-v-abf4b97a] {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding: var(--rp-spacing-4);
-  color: var(--rp-color-dimmed);
-  font-size: var(--_rp-select-font-size);
-}
-.rp-select-dropdown-enter-active[data-v-abf4b97a],
-.rp-select-dropdown-leave-active[data-v-abf4b97a] {
-  transition: opacity var(--rp-transition-fast), transform var(--rp-transition-fast);
-}
-.rp-select-dropdown-enter-from[data-v-abf4b97a],
-.rp-select-dropdown-leave-to[data-v-abf4b97a] {
-  opacity: 0;
-  transform: translateY(calc(-1 * var(--rp-spacing-1)));
+@layer ropav.components {
+.rp-select[data-v-5c4e4e6a] {
+    --_rp-select-height: var(--rp-size-control-md);
+    --_rp-select-padding-x: calc(var(--rp-size-control-md) / 3);
+    --_rp-select-font-size: var(--rp-font-size-md);
+    --_rp-select-option-min-height: calc(var(--rp-size-control-md) - var(--rp-spacing-4));
+    --_rp-select-option-padding-y: var(--rp-spacing-1);
+    --_rp-select-radius: var(--rp-radius-sm);
+    --_rp-select-invalid-border: var(--rp-color-red-filled);
+    --_rp-select-invalid-ring: color-mix(in srgb, var(--rp-color-red-filled) 32%, transparent);
+    --_rp-select-option-focused-bg: var(--rp-color-default-hover);
+    position: relative;
+    display: inline-flex;
+    font-family: var(--rp-font-family);
+    font-weight: var(--rp-font-weight-normal);
+    line-height: 1;
+}
+.rp-select__native[data-v-5c4e4e6a] {
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    padding: 0;
+    margin: -1px;
+    overflow: hidden;
+    clip: rect(0, 0, 0, 0);
+    white-space: nowrap;
+    border-width: 0;
+}
+.rp-select--size-xs[data-v-5c4e4e6a] {
+    --_rp-select-height: var(--rp-size-control-xs);
+    --_rp-select-padding-x: calc(var(--rp-size-control-xs) / 3);
+    --_rp-select-font-size: var(--rp-font-size-xs);
+    --_rp-select-option-min-height: calc(var(--rp-size-control-xs) - var(--rp-spacing-2));
+    --_rp-select-option-padding-y: calc(var(--rp-spacing-1) / 2);
+}
+.rp-select--size-sm[data-v-5c4e4e6a] {
+    --_rp-select-height: var(--rp-size-control-sm);
+    --_rp-select-padding-x: calc(var(--rp-size-control-sm) / 3);
+    --_rp-select-font-size: var(--rp-font-size-sm);
+    --_rp-select-option-min-height: calc(var(--rp-size-control-sm) - var(--rp-spacing-3));
+    --_rp-select-option-padding-y: var(--rp-spacing-1);
+}
+.rp-select--size-md[data-v-5c4e4e6a] {
+    --_rp-select-height: var(--rp-size-control-md);
+    --_rp-select-padding-x: calc(var(--rp-size-control-md) / 3);
+    --_rp-select-font-size: var(--rp-font-size-md);
+    --_rp-select-option-min-height: calc(var(--rp-size-control-md) - var(--rp-spacing-4));
+    --_rp-select-option-padding-y: var(--rp-spacing-1);
+}
+.rp-select--size-lg[data-v-5c4e4e6a] {
+    --_rp-select-height: var(--rp-size-control-lg);
+    --_rp-select-padding-x: calc(var(--rp-size-control-lg) / 3);
+    --_rp-select-font-size: var(--rp-font-size-lg);
+    --_rp-select-option-min-height: calc(var(--rp-size-control-lg) - var(--rp-spacing-5));
+    --_rp-select-option-padding-y: calc(var(--rp-spacing-3) / 2);
+}
+.rp-select--size-xl[data-v-5c4e4e6a] {
+    --_rp-select-height: var(--rp-size-control-xl);
+    --_rp-select-padding-x: calc(var(--rp-size-control-xl) / 3);
+    --_rp-select-font-size: var(--rp-font-size-xl);
+    --_rp-select-option-min-height: calc(var(--rp-size-control-xl) - var(--rp-spacing-6));
+    --_rp-select-option-padding-y: var(--rp-spacing-2);
+}
+html.dark .rp-select[data-v-5c4e4e6a], [data-rp-color-scheme=dark] .rp-select[data-v-5c4e4e6a] {
+    --_rp-select-invalid-border: var(--rp-color-red-light-color);
+    --_rp-select-invalid-ring: color-mix(
+        in srgb,
+        var(--rp-color-red-light-color) 32%,
+        transparent
+    );
+    --_rp-select-option-focused-bg: var(--rp-color-default-hover);
+}
+.rp-select--disabled[data-v-5c4e4e6a] {
+    opacity: var(--rp-opacity-disabled);
+    cursor: not-allowed;
+}
+.rp-select__trigger[data-v-5c4e4e6a] {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    justify-content: space-between;
+    width: 100%;
+    min-width: 180px;
+    height: var(--_rp-select-height);
+    padding: 0 var(--_rp-select-padding-x);
+    font-size: var(--_rp-select-font-size);
+    background-color: var(--rp-color-control-bg);
+    border: var(--rp-border-width-thin) solid var(--rp-color-control-border);
+    border-radius: var(--_rp-select-radius);
+    cursor: pointer;
+    transition: border-color var(--rp-transition-fast), box-shadow var(--rp-transition-fast);
+    gap: var(--rp-spacing-2);
+}
+.rp-select__trigger[data-v-5c4e4e6a]:hover {
+    border-color: var(--rp-color-control-border-hover);
+}
+.rp-select__trigger[data-v-5c4e4e6a]:focus-visible {
+    outline: none;
+    border-color: var(--rp-color-control-border-focus);
+    box-shadow: 0 0 0 var(--rp-border-width-medium) var(--rp-color-focus-ring);
+}
+.rp-select--radius-xs[data-v-5c4e4e6a] {
+    --_rp-select-radius: var(--rp-radius-xs);
+}
+.rp-select--radius-sm[data-v-5c4e4e6a] {
+    --_rp-select-radius: var(--rp-radius-sm);
+}
+.rp-select--radius-md[data-v-5c4e4e6a] {
+    --_rp-select-radius: var(--rp-radius-md);
+}
+.rp-select--radius-lg[data-v-5c4e4e6a] {
+    --_rp-select-radius: var(--rp-radius-lg);
+}
+.rp-select--radius-xl[data-v-5c4e4e6a] {
+    --_rp-select-radius: var(--rp-radius-xl);
+}
+.rp-select--open .rp-select__trigger[data-v-5c4e4e6a] {
+    border-color: var(--rp-color-control-border-focus);
+    box-shadow: 0 0 0 var(--rp-border-width-medium) var(--rp-color-focus-ring);
+}
+.rp-select--invalid .rp-select__trigger[data-v-5c4e4e6a] {
+    border-color: var(--_rp-select-invalid-border);
+}
+.rp-select--invalid .rp-select__trigger[data-v-5c4e4e6a]:focus-visible, .rp-select--open.rp-select--invalid .rp-select__trigger[data-v-5c4e4e6a] {
+    border-color: var(--_rp-select-invalid-border);
+    box-shadow: 0 0 0 var(--rp-border-width-medium) var(--_rp-select-invalid-ring);
+}
+.rp-select__value[data-v-5c4e4e6a] {
+    flex: 1;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    color: var(--rp-color-control-fg);
+}
+.rp-select__placeholder[data-v-5c4e4e6a] {
+    color: var(--rp-color-control-placeholder);
+}
+.rp-select__indicator[data-v-5c4e4e6a] {
+    display: inline-flex;
+    align-items: center;
+    width: 1em;
+    height: 1em;
+    flex-shrink: 0;
+}
+.rp-select__indicator svg[data-v-5c4e4e6a] {
+    width: 100%;
+    height: 100%;
+}
+.rp-select__indicator[data-v-5c4e4e6a] {
+    position: relative;
+    color: var(--rp-color-control-icon);
+    transform: translateX(var(--rp-spacing-1));
+}
+.rp-select__arrow[data-v-5c4e4e6a] {
+    display: inline-flex;
+    align-items: center;
+    width: 1em;
+    height: 1em;
+    flex-shrink: 0;
+}
+.rp-select__arrow svg[data-v-5c4e4e6a] {
+    width: 100%;
+    height: 100%;
+}
+.rp-select__arrow[data-v-5c4e4e6a] {
+    transition: opacity var(--rp-transition-fast);
+}
+.rp-select__clear[data-v-5c4e4e6a] {
+    padding: 0;
+    font: inherit;
+    background: none;
+    border: none;
+    cursor: pointer;
+    display: inline-flex;
+    align-items: center;
+    width: 1em;
+    height: 1em;
+    flex-shrink: 0;
+}
+.rp-select__clear svg[data-v-5c4e4e6a] {
+    width: 100%;
+    height: 100%;
+}
+.rp-select__clear[data-v-5c4e4e6a] {
+    position: absolute;
+    inset: 0;
+    z-index: 1;
+    color: var(--rp-color-control-icon);
+    opacity: 0;
+    pointer-events: none;
+    transition: color var(--rp-transition-fast), opacity var(--rp-transition-fast);
+}
+.rp-select__clear[data-v-5c4e4e6a]:hover {
+    color: var(--rp-color-control-fg);
+}
+.rp-select__trigger:hover .rp-select__clear[data-v-5c4e4e6a] {
+    opacity: 1;
+    pointer-events: auto;
+}
+.rp-select__trigger:hover .rp-select__clear + .rp-select__arrow[data-v-5c4e4e6a] {
+    opacity: 0;
+}
+.rp-select__dropdown[data-v-5c4e4e6a] {
+    position: absolute;
+    top: calc(100% + var(--rp-spacing-2));
+    left: 0;
+    right: 0;
+    z-index: 100;
+    background-color: var(--rp-color-default);
+    border: var(--rp-border-width-thin) solid var(--rp-color-default-border);
+    border-radius: var(--_rp-select-radius);
+    box-shadow: var(--rp-shadow-md);
+    padding: var(--rp-spacing-1) 0;
+    max-height: 240px;
+    overflow-y: auto;
+    padding: var(--rp-spacing-1);
+}
+.rp-select__option[data-v-5c4e4e6a] {
+    display: flex;
+    align-items: center;
+    min-height: var(--_rp-select-option-min-height);
+    padding: var(--_rp-select-option-padding-y) var(--_rp-select-padding-x);
+    border-radius: var(--_rp-select-radius);
+    font-size: var(--_rp-select-font-size);
+    cursor: pointer;
+    transition: color var(--rp-transition-fast);
+    color: var(--rp-color-control-fg);
+}
+.rp-select__option--focused[data-v-5c4e4e6a] {
+    background-color: var(--_rp-select-option-focused-bg);
+}
+.rp-select__option--selected[data-v-5c4e4e6a] {
+    color: var(--rp-primary-color-light-color);
+}
+.rp-select__option--disabled[data-v-5c4e4e6a] {
+    color: var(--rp-color-disabled-color);
+    cursor: not-allowed;
+}
+.rp-select__empty[data-v-5c4e4e6a] {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: var(--rp-spacing-4);
+    color: var(--rp-color-dimmed);
+    font-size: var(--_rp-select-font-size);
+}
+.rp-select-dropdown-enter-active[data-v-5c4e4e6a],
+  .rp-select-dropdown-leave-active[data-v-5c4e4e6a] {
+    transition: opacity var(--rp-transition-fast), transform var(--rp-transition-fast);
+}
+.rp-select-dropdown-enter-from[data-v-5c4e4e6a],
+  .rp-select-dropdown-leave-to[data-v-5c4e4e6a] {
+    opacity: 0;
+    transform: translateY(calc(-1 * var(--rp-spacing-1)));
+}
 }