@rarui/styles 2.2.5 → 2.3.0-rc.1

package/dist/packages/input/select/rarui-select.css

@@ -0,0 +1,134 @@
+.rarui-select__1ooq5720 {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  position: relative;
+  width: 100%;
+  overflow: hidden;
+  border-style: solid;
+  transition: all 150ms ease;
+  box-sizing: border-box;
+  cursor: pointer;
+  background-color: var(--rarui-colors-surface-primary);
+  padding: 0 var(--rarui-spacing-2xs);
+  border-radius: var(--rarui-shape-border-radius-2xs);
+  border-width: var(--rarui-shape-border-width-1);
+  border-color: var(--rarui-colors-border-secondary);
+  color: var(--rarui-colors-content-secondary);
+}
+.rarui-select__1ooq5720:hover {
+  border-color: var(--rarui-colors-border-primary);
+}
+.rarui-select__1ooq5720:active {
+  background-color: var(--rarui-colors-surface-press);
+}
+.rarui-select__1ooq5720:focus {
+  border-color: var(--rarui-colors-border-primary);
+}
+.rarui-select__1ooq5720:focus-within {
+  outline: none;
+  box-shadow: var(--rarui-elevation-focus-ring);
+}
+.rarui-select__1ooq5720:has(input:disabled) {
+  border-color: var(--rarui-colors-surface-disabled);
+}
+.rarui-select__1ooq5720[aria-disabled='true'] {
+  cursor: not-allowed;
+  background-color: var(--rarui-colors-surface-disabled);
+  border-color: var(--rarui-colors-surface-disabled);
+}
+.rarui-select_appearance_success__1ooq5721 {
+  border-color: var(--rarui-colors-border-success);
+}
+.rarui-select_appearance_success__1ooq5721:hover {
+  border-color: var(--rarui-colors-border-success);
+}
+.rarui-select_appearance_success__1ooq5721:focus {
+  border-color: var(--rarui-colors-border-success);
+}
+.rarui-select_appearance_success__1ooq5721:active {
+  background-color: var(--rarui-colors-surface-success-press);
+}
+.rarui-select_appearance_error__1ooq5722 {
+  border-color: var(--rarui-colors-border-error);
+}
+.rarui-select_appearance_error__1ooq5722:hover {
+  border-color: var(--rarui-colors-border-error);
+}
+.rarui-select_appearance_error__1ooq5722:focus {
+  border-color: var(--rarui-colors-border-error);
+}
+.rarui-select_appearance_error__1ooq5722:active {
+  background-color: var(--rarui-colors-surface-error-press);
+}
+.rarui-select_size_large__1ooq5723 {
+  height: 3rem;
+}
+.rarui-select_size_medium__1ooq5724 {
+  height: 2.5rem;
+}
+.rarui-select_size_small__1ooq5725 {
+  height: 2rem;
+  padding: 0 var(--rarui-spacing-3xs);
+}
+.rarui-select_list__1ooq5726 {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  overflow-y: scroll;
+  padding: 0.125rem;
+  gap: var(--rarui-spacing-3xs);
+}
+.rarui-select_list__1ooq5726::-webkit-scrollbar {
+  width: .375rem;
+  background: transparent;
+}
+.rarui-select_list__1ooq5726::-webkit-scrollbar-thumb {
+  border-radius: var(--rarui-shape-border-radius-2xs);
+  background-color: var(--rarui-colors-content-disabled);
+}
+.rarui-select_close__1ooq5727 {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  background: transparent;
+  color: currentcolor;
+  transition: all 150ms ease;
+  height: 1rem;
+  width: 1rem;
+  border: 0;
+  padding: 0;
+  border-radius: var(--rarui-shape-border-radius-2xs);
+}
+.rarui-select_close__1ooq5727:focus-within {
+  outline: none;
+  box-shadow: var(--rarui-elevation-focus-ring);
+}
+.rarui-select_close__1ooq5727:hover {
+  color: var(--rarui-colors-content-primary);
+}
+.rarui-select_close__1ooq5727:disabled {
+  cursor: not-allowed;
+  color: var(--rarui-colors-content-disabled);
+}
+@media screen and (min-width: 0px) {
+  .rarui-select_maxHeight-xs__1ooq572c {
+    max-height: var(--maxHeight-xs__1ooq5728);
+  }
+}
+@media screen and (min-width: 768px) {
+  .rarui-select_maxHeight-md__1ooq572d {
+    max-height: var(--maxHeight-md__1ooq5729);
+  }
+}
+@media screen and (min-width: 1200px) {
+  .rarui-select_maxHeight-lg__1ooq572e {
+    max-height: var(--maxHeight-lg__1ooq572a);
+  }
+}
+@media screen and (min-width: 1400px) {
+  .rarui-select_maxHeight-xl__1ooq572f {
+    max-height: var(--maxHeight-xl__1ooq572b);
+  }
+}

package/dist/packages/input/select/rarui-select.css.js

@@ -0,0 +1 @@
+import"./../../../themes/globals.css";import"./rarui-select.css";import{c as e}from"../../../node_modules/rainbow-sprinkles/dist/createRuntimeFn-891c4670.esm.js";import{c as a}from"../../../node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.js";var s=e({config:{maxHeight:{dynamic:{default:"rarui-select_maxHeight-xs__1ooq572c",conditions:{xs:"rarui-select_maxHeight-xs__1ooq572c",md:"rarui-select_maxHeight-md__1ooq572d",lg:"rarui-select_maxHeight-lg__1ooq572e",xl:"rarui-select_maxHeight-xl__1ooq572f"}},name:"maxHeight",vars:{conditions:{xs:"var(--maxHeight-xs__1ooq5728)",md:"var(--maxHeight-md__1ooq5729)",lg:"var(--maxHeight-lg__1ooq572a)",xl:"var(--maxHeight-xl__1ooq572b)"},default:"var(--maxHeight-xs__1ooq5728)"},dynamicScale:!0}}}),r={select:a({defaultClassName:"rarui-select__1ooq5720",variantClassNames:{appearance:{success:"rarui-select_appearance_success__1ooq5721",error:"rarui-select_appearance_error__1ooq5722"},size:{large:"rarui-select_size_large__1ooq5723",medium:"rarui-select_size_medium__1ooq5724",small:"rarui-select_size_small__1ooq5725"}},defaultVariants:{},compoundVariants:[]}),list:"rarui-select_list__1ooq5726",close:"rarui-select_close__1ooq5727"};export{s as selectSprinkle,r as selectStyles};

package/dist/packages/input/textarea/index.js

@@ -0,0 +1 @@
+import{textareaStyles as r}from"./rarui-textarea.css.js";var a={classnames:r};export{a as textarea};

package/dist/packages/input/textarea/rarui-textarea.css

@@ -0,0 +1,54 @@
+.rarui-textarea__l6tpie0 {
+  width: 100%;
+  border-style: solid;
+  transition: all 150ms ease;
+  box-sizing: border-box;
+  padding: var(--rarui-spacing-2xs);
+  font-family: var(--rarui-fontFamily-body);
+  background-color: var(--rarui-colors-surface-primary);
+  color: var(--rarui-colors-content-primary);
+  border-radius: var(--rarui-shape-border-radius-2xs);
+  border-color: var(--rarui-colors-border-secondary);
+}
+.rarui-textarea__l6tpie0:hover {
+  border-color: var(--rarui-colors-border-primary);
+}
+.rarui-textarea__l6tpie0:focus {
+  border-color: var(--rarui-colors-border-primary);
+}
+.rarui-textarea__l6tpie0:focus-within {
+  outline: none;
+  box-shadow: var(--rarui-elevation-focus-ring);
+}
+.rarui-textarea__l6tpie0:disabled {
+  background-color: var(--rarui-colors-surface-disabled);
+  border-color: var(--rarui-colors-surface-disabled);
+  color: var(--rarui-colors-content-disabled);
+}
+.rarui-textarea__l6tpie0::placeholder {
+  color: var(--rarui-colors-content-disabled);
+}
+.rarui-textarea_appearance_success__l6tpie1 {
+  border-color: var(--rarui-colors-border-success);
+}
+.rarui-textarea_appearance_success__l6tpie1:hover {
+  border-color: var(--rarui-colors-border-success);
+}
+.rarui-textarea_appearance_success__l6tpie1:focus {
+  border-color: var(--rarui-colors-border-success);
+}
+.rarui-textarea_appearance_success__l6tpie1:disabled {
+  border-color: var(--rarui-colors-surface-disabled);
+}
+.rarui-textarea_appearance_error__l6tpie2 {
+  border-color: var(--rarui-colors-border-error);
+}
+.rarui-textarea_appearance_error__l6tpie2:hover {
+  border-color: var(--rarui-colors-border-error);
+}
+.rarui-textarea_appearance_error__l6tpie2:focus {
+  border-color: var(--rarui-colors-border-error);
+}
+.rarui-textarea_appearance_error__l6tpie2:disabled {
+  border-color: var(--rarui-colors-surface-disabled);
+}

package/dist/packages/input/textarea/rarui-textarea.css.js

@@ -0,0 +1 @@
+import"./../../../themes/globals.css";import"./rarui-textarea.css";import{c as a}from"../../../node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.js";var e={textarea:a({defaultClassName:"rarui-textarea__l6tpie0",variantClassNames:{appearance:{success:"rarui-textarea_appearance_success__l6tpie1",error:"rarui-textarea_appearance_error__l6tpie2"}},defaultVariants:{},compoundVariants:[]})};export{e as textareaStyles};

package/dist/packages/input/toggle/index.js

@@ -0,0 +1 @@
+import{__assign as r}from"tslib";import{styles as s}from"./rarui-toggle.css.js";var o={classnames:r({},s)};export{o as toggle};

package/dist/packages/input/toggle/rarui-toggle.css

@@ -0,0 +1,208 @@
+.rarui-toggle__1acg1b30 {
+  display: flex;
+  align-items: center;
+  width: fit-content;
+  gap: var(--rarui-spacing-3xs);
+  position: relative;
+  cursor: pointer;
+  border-radius: var(--rarui-shape-border-radius-pill);
+}
+.rarui-toggle__1acg1b30:before {
+  content: "";
+  position: absolute;
+  left: .3125rem;
+  background-color: var(--rarui-colors-surface-invert-secondary);
+  border-radius: var(--rarui-shape-border-radius-pill);
+  z-index: 1;
+  transition: all 150ms ease;
+}
+.rarui-toggle__1acg1b30:after {
+  content: "";
+  inset: 0;
+  opacity: 0;
+  position: absolute;
+  pointer-events: none;
+  border-radius: 100%;
+  transition: all 150ms ease;
+  background-color: transparent;
+}
+.rarui-toggle__1acg1b30:hover:after {
+  opacity: 1;
+  background-color: var(--rarui-colors-surface-hover);
+}
+.rarui-toggle__1acg1b30:has(input:checked):before {
+  left: 1.5625rem;
+  background-color: var(--rarui-colors-surface-primary);
+}
+.rarui-toggle__1acg1b30:has(input:checked):after {
+  left: .9375rem;
+}
+.rarui-toggle__1acg1b30[aria-disabled='true']:hover:after {
+  opacity: 0;
+}
+.rarui-toggle__1acg1b30[aria-disabled='true']:before {
+  background-color: var(--rarui-colors-surface-primary);
+}
+.rarui-toggle__1acg1b30:has(input:checked)[aria-disabled='true']:before {
+  background-color: var(--rarui-colors-surface-primary);
+}
+.rarui-toggle_size_large__1acg1b31:before {
+  width: 1.5rem;
+  height: 1.5rem;
+}
+.rarui-toggle_size_large__1acg1b31:after {
+  top: -.3125rem;
+  left: -.3125rem;
+  height: 2.75rem;
+  width: 2.75rem;
+}
+.rarui-toggle_size_small__1acg1b32:before {
+  width: 1rem;
+  height: 1rem;
+}
+.rarui-toggle_size_small__1acg1b32:after {
+  top: -.4375rem;
+  left: -.5rem;
+  height: 2.5rem;
+  width: 2.5rem;
+}
+.rarui-toggle_error_true__1acg1b33:before {
+  background-color: var(--rarui-colors-surface-error);
+}
+.rarui-toggle_error_true__1acg1b33:has(input:checked):before {
+  background-color: var(--rarui-colors-content-on-error);
+}
+.rarui-toggle_input__1acg1b34 {
+  position: absolute;
+  overflow: hidden;
+  opacity: 0;
+  height: 0;
+  width: 0;
+}
+.rarui-toggle_slider__1acg1b35 {
+  background-color: var(--rarui-colors-surface-disabled);
+  border-color: var(--rarui-colors-border-secondary);
+  border-radius: var(--rarui-shape-border-radius-pill);
+  border-width: var(--rarui-shape-border-width-1);
+  border-style: solid;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  position: relative;
+  transition: all 150ms ease;
+  overflow: hidden;
+}
+.rarui-toggle_slider__1acg1b35:before {
+  content: "";
+  position: absolute;
+  width: 100%;
+  height: 100%;
+}
+.rarui-toggle_slider__1acg1b35[aria-disabled='true'] {
+  border-color: var(--rarui-colors-surface-disabled);
+}
+.rarui-toggle_slider__1acg1b35:not([aria-disabled='true']):hover:before {
+  background-color: var(--rarui-colors-surface-hover);
+}
+.rarui-toggle_slider_size_large__1acg1b36 {
+  width: 3.25rem;
+  height: 2rem;
+}
+.rarui-toggle_slider_size_large__1acg1b36:after {
+  content: "";
+}
+.rarui-toggle_slider_size_small__1acg1b37 {
+  width: 2.75rem;
+  height: 1.5rem;
+}
+.rarui-toggle_slider_error_true__1acg1b38 {
+  background-color: var(--rarui-colors-surface-error-subdued);
+  border-color: var(--rarui-colors-border-error);
+  &[aria-disabled='true'] {
+    background-color: var(--rarui-colors-surface-disabled);
+    border-color: var(--rarui-colors-surface-disabled);
+  }
+}
+.rarui-toggle_unchecked__1acg1b39 {
+  position: absolute;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  overflow: hidden;
+  z-index: 2;
+  opacity: 1;
+  left: 0;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  transition: all 150ms ease;
+}
+.rarui-toggle__1acg1b30:has(.rarui-toggle_input__1acg1b34:checked) .rarui-toggle_unchecked__1acg1b39 {
+  opacity: 0;
+}
+.rarui-toggle_unchecked__1acg1b39[aria-disabled='true']:after, .rarui-toggle_unchecked__1acg1b39[aria-disabled='true']:before {
+  background-color: var(--rarui-colors-surface-disabled);
+}
+.rarui-toggle_unchecked_size_large__1acg1b3a {
+  left: 1rem;
+  height: 1.5rem;
+  width: 1.5rem;
+  border-radius: 0.75rem;
+}
+.rarui-toggle_unchecked_size_small__1acg1b3b {
+  left: 0.75rem;
+  width: 1rem;
+  height: 1rem;
+  border-radius: 0.5rem;
+}
+.rarui-toggle_checked__1acg1b3c {
+  position: absolute;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  overflow: hidden;
+  z-index: 2;
+  left: 0;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  opacity: 0;
+  transition: all 150ms ease;
+}
+.rarui-toggle__1acg1b30:has(.rarui-toggle_input__1acg1b34:checked) .rarui-toggle_checked__1acg1b3c {
+  opacity: 1;
+}
+.rarui-toggle_checked__1acg1b3c[aria-disabled='true']:after, .rarui-toggle_checked__1acg1b3c[aria-disabled='true']:before {
+  background-color: var(--rarui-colors-surface-disabled);
+}
+.rarui-toggle_checked_size_large__1acg1b3d {
+  left: 2.25rem;
+  height: 1.5rem;
+  width: 1.5rem;
+  border-radius: 0.75rem;
+}
+.rarui-toggle_checked_size_small__1acg1b3e {
+  left: 2rem;
+  width: 1rem;
+  height: 1rem;
+  border-radius: 0.5rem;
+}
+.rarui-toggle__1acg1b30:has(.rarui-toggle_input__1acg1b34:checked) .rarui-toggle_slider__1acg1b35 {
+  background-color: var(--rarui-colors-surface-brand);
+  border-color: var(--rarui-colors-surface-brand);
+}
+.rarui-toggle__1acg1b30:has(.rarui-toggle_input__1acg1b34:checked) .rarui-toggle_slider__1acg1b35[aria-disabled='true'] {
+  background-color: var(--rarui-colors-surface-disabled);
+  border-color: var(--rarui-colors-surface-disabled);
+}
+.rarui-toggle__1acg1b30:has(.rarui-toggle_input__1acg1b34:checked) .rarui-toggle_slider__1acg1b35:not([aria-disabled='true']):hover:before {
+  background-color: var(--rarui-colors-surface-hover);
+}
+.rarui-toggle__1acg1b30:has(.rarui-toggle_input__1acg1b34:checked) .rarui-toggle_slider__1acg1b35:after {
+  opacity: 1;
+}
+.rarui-toggle__1acg1b30:has(.rarui-toggle_input__1acg1b34:checked) .rarui-toggle_slider_error_true__1acg1b38 {
+  background-color: var(--rarui-colors-surface-error);
+  border-color: var(--rarui-colors-surface-error);
+}
+.rarui-toggle__1acg1b30:has(.rarui-toggle_input__1acg1b34:checked) .rarui-toggle_slider_error_true__1acg1b38:after {
+  opacity: 0;
+}

package/dist/packages/input/toggle/rarui-toggle.css.js

@@ -0,0 +1 @@
+import"./../../../themes/globals.css";import"./rarui-toggle.css";import{c as a}from"../../../node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.js";a({defaultClassName:"rarui-toggle_checked__1acg1b3c",variantClassNames:{size:{large:"rarui-toggle_checked_size_large__1acg1b3d",small:"rarui-toggle_checked_size_small__1acg1b3e"}},defaultVariants:{},compoundVariants:[]}),a({defaultClassName:"rarui-toggle_slider__1acg1b35",variantClassNames:{size:{large:"rarui-toggle_slider_size_large__1acg1b36",small:"rarui-toggle_slider_size_small__1acg1b37"},error:{true:"rarui-toggle_slider_error_true__1acg1b38"}},defaultVariants:{},compoundVariants:[]});var e={toggle:a({defaultClassName:"rarui-toggle__1acg1b30",variantClassNames:{size:{large:"rarui-toggle_size_large__1acg1b31",small:"rarui-toggle_size_small__1acg1b32"},error:{true:"rarui-toggle_error_true__1acg1b33"}},defaultVariants:{},compoundVariants:[]}),input:"rarui-toggle_input__1acg1b34",slider:a({defaultClassName:"rarui-toggle_slider__1acg1b35",variantClassNames:{size:{large:"rarui-toggle_slider_size_large__1acg1b36",small:"rarui-toggle_slider_size_small__1acg1b37"},error:{true:"rarui-toggle_slider_error_true__1acg1b38"}},defaultVariants:{},compoundVariants:[]}),unchecked:a({defaultClassName:"rarui-toggle_unchecked__1acg1b39",variantClassNames:{size:{large:"rarui-toggle_unchecked_size_large__1acg1b3a",small:"rarui-toggle_unchecked_size_small__1acg1b3b"}},defaultVariants:{},compoundVariants:[]}),checked:a({defaultClassName:"rarui-toggle_checked__1acg1b3c",variantClassNames:{size:{large:"rarui-toggle_checked_size_large__1acg1b3d",small:"rarui-toggle_checked_size_small__1acg1b3e"}},defaultVariants:{},compoundVariants:[]})};a({defaultClassName:"rarui-toggle_unchecked__1acg1b39",variantClassNames:{size:{large:"rarui-toggle_unchecked_size_large__1acg1b3a",small:"rarui-toggle_unchecked_size_small__1acg1b3b"}},defaultVariants:{},compoundVariants:[]});export{e as styles};

package/dist/packages/layout/box/index.js

@@ -0,0 +1 @@
+import{boxSprinkle as r}from"./rarui-box.css.js";var o={sprinkle:r};export{o as box};