@yr3/ui 1.0.0

package/dist/components/Input/input.css

@@ -0,0 +1,128 @@
+input {
+  width: 100%;
+  border: none;
+  background: transparent;
+  outline: none;
+  padding: 4px;
+  height: 30px;
+  text-indent: 4px;
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  appearance: none;
+  -webkit-appearance: none;
+  z-index: 1;
+}
+
+input[type=number i] {
+  appearance: none;
+  -webkit-appearance: none;
+  -moz-appearance: textfield;
+}
+
+input[type=number]::-webkit-outer-spin-button,
+input[type=number]::-webkit-inner-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+
+input::placeholder {
+  color: var(--color-disabled);
+  opacity: 0.7;
+  padding: 0px 8px;
+  font-size: 14px;
+}
+
+.yr3Input {
+  position: relative;
+  width: 100%;
+  height: 40px;
+  background: transparent;
+  border: none;
+  border-radius: var(--border-radius);
+}
+
+/* ===== FOCUS ===== */
+.yr3Input:focus {
+  border-color: var(--color-primary);
+}
+
+.yr3Phone {
+  display: flex;
+  gap: 8px;
+  width: 100%;
+}
+
+.yr3Phone .yr3Select {
+  width: 90px;
+  flex-shrink: 0;
+}
+
+.yr3Phone__field {
+  flex: 1;
+  padding: 12px;
+  border: 1px solid var(--color-border);
+  border-radius: var(--border-radius);
+  font-family: var(--font-family-base);
+}
+
+.yr3Places--menu {
+  position: absolute;
+  width: 100%;
+  height: auto;
+  max-height: 200px;
+  overflow: auto;
+  display: flex;
+  flex-direction: column;
+  top: 100%;
+  left: 0;
+  background: var(--color-surface);
+  border: 1px solid color-mix(in srgb, var(--color-primary) 50%, transparent);
+  border-radius: var(--border-radius);
+  color: var(--color-text-primary);
+  margin-top: 4px;
+  z-index: 10;
+}
+
+.yr3Input--color-primary {
+  color: var(--color-primary);
+}
+
+.yr3Input--color-secondary {
+  color: var(--color-secondary);
+}
+
+.yr3Input--color-success {
+  color: var(--color-success);
+}
+
+.yr3Input--color-error {
+  color: var(--color-error);
+}
+
+.yr3Input--color-warning {
+  color: var(--color-warning);
+}
+
+.yr3Input--color-info {
+  color: var(--color-info);
+}
+
+.yr3Input--color-disabled {
+  color: var(--color-disabled);
+}
+
+.yr3Input--color-background {
+  color: var(--color-background);
+}
+
+.yr3Input--color-text {
+  color: var(--color-text-primary);
+}
+
+.yr3Input--label {
+  height: 40px;
+  transform: translateY(5px);
+}
+
+/*# sourceMappingURL=input.css.map */

package/dist/components/Input/input.css.map

@@ -0,0 +1 @@
+{"version":3,"sourceRoot":"","sources":["../../../src/components/Input/input.scss"],"names":[],"mappings":"AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIJ;EACI;EACA;EACA;;;AAGJ;AAAA;EAEE;EACA;;;AAEF;EACI;EACA;EACA;EACA;;;AAGJ;EACE;EACA;EACA;EACA;EACA;EACA;;;AAIF;AACA;EACE;;;AAIF;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAGF;EACE;EACA","file":"input.css"}

package/dist/components/InputArea/inputArea.css

@@ -0,0 +1,88 @@
+.yr3InputArea {
+  width: 100%;
+  resize: vertical;
+  min-height: 40px;
+  padding: 24px 8px 8px 8px;
+  color: var(--border-color);
+  font-family: var(--font-family-base);
+  border-radius: var(--border-radius);
+  transition: border 0.2s ease;
+}
+.yr3InputArea--base {
+  border: none;
+  background: transparent;
+  resize: none;
+  --border-radius: 0px;
+}
+.yr3InputArea--outlined {
+  border: 1px solid var(--border-color);
+  background: var(--color-surface);
+  --border-radius: 0px;
+}
+.yr3InputArea--filled {
+  background: var(--border-color);
+  border: 1px solid transparent;
+  --border-radius: 0px;
+}
+.yr3InputArea--lined {
+  background: transparent;
+  border: none;
+  border-bottom: 1px solid var(--border-color);
+  --border-radius: 0px;
+  resize: none;
+}
+.yr3InputArea:focus {
+  outline: none;
+  border-color: var(--border-color);
+}
+
+.yr3InputArea--color-primary {
+  --border-color: var(--color-primary);
+  color: var(--color-surface);
+}
+
+.yr3InputArea--color-secondary {
+  --border-color: var(--color-secondary);
+  color: var(--color-surface);
+}
+
+.yr3InputArea--color-success {
+  --border-color: var(--color-success);
+  color: var(--color-surface);
+}
+
+.yr3InputArea--color-error {
+  --border-color: var(--color-error);
+  color: var(--color-surface);
+}
+
+.yr3InputArea--color-warning {
+  --border-color: var(--color-warning);
+  color: var(--color-surface);
+}
+
+.yr3InputArea--color-info {
+  --border-color: var(--color-info);
+  color: var(--color-surface);
+}
+
+.yr3InputArea--color-disabled {
+  --border-color: var(--color-disabled);
+  color: var(--color-surface);
+}
+
+.yr3InputArea--color-background {
+  --border-color: var(--color-background);
+  color: var(--color-surface);
+}
+
+.yr3InputArea--color-text {
+  --border-color: var(--color-text-primary);
+  color: var(--color-surface);
+}
+
+.yr3InputArea--rounded {
+  --border-radius: var(--radius-sm);
+}
+
+/*# sourceMappingURL=inputArea.css.map */

package/dist/components/InputArea/inputArea.css.map

@@ -0,0 +1 @@
+{"version":3,"sourceRoot":"","sources":["../../../src/components/InputArea/inputArea.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;;AAEF;EACE;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;;;AAIJ;EACE;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;;;AAGF;EACE","file":"inputArea.css"}

package/dist/components/Label/label.css

@@ -0,0 +1,61 @@
+.yr3Label {
+  position: absolute;
+  top: 0;
+  left: 0px;
+  top: 50%;
+  transform: translateY(-50%);
+  color: var(--color-label);
+  pointer-events: none;
+  transition: all 0.2s ease;
+  z-index: 2;
+  font-size: 12px;
+  padding: 0px 0px 0px 8px;
+}
+.yr3Label.yr3Input--active {
+  top: 0;
+  transform: translateY(20%) scale(0.85);
+  color: var(--color-label);
+}
+.yr3Label.yr3InputArea--active {
+  top: 0;
+  transform: translateY(20%) scale(0.85);
+  color: var(--color-label);
+}
+
+.yr3Label--color-primary {
+  --color-label: var(--color-primary);
+}
+
+.yr3Label--color-secondary {
+  --color-label: var(--color-secondary);
+}
+
+.yr3Label--color-success {
+  --color-label: var(--color-success);
+}
+
+.yr3Label--color-error {
+  --color-label: var(--color-error);
+}
+
+.yr3Label--color-warning {
+  --color-label: var(--color-warning);
+}
+
+.yr3Label--color-info {
+  --color-label: var(--color-info);
+}
+
+.yr3Label--color-disabled {
+  --color-label: var(--color-disabled);
+}
+
+.yr3Label--color-background {
+  --color-label: var(--color-background);
+}
+
+.yr3Label--color-text {
+  --color-label: var(--color-text-primary);
+}
+
+/*# sourceMappingURL=label.css.map */

package/dist/components/Label/label.css.map

@@ -0,0 +1 @@
+{"version":3,"sourceRoot":"","sources":["../../../src/components/Label/label.scss"],"names":[],"mappings":"AAAA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;EACA;;AAEJ;EACI;EACA;EACA;;;AAIR;EACI;;;AAEJ;EACI;;;AAEJ;EACI;;;AAEJ;EACI;;;AAEJ;EACI;;;AAEJ;EACI;;;AAEJ;EACI;;;AAEJ;EACI;;;AAEJ;EACI","file":"label.css"}

package/dist/components/Modal/modal.css

@@ -0,0 +1,42 @@
+.yr3Modal {
+  animation: fadeIn 0.3s ease;
+  z-index: 1000;
+  position: fixed;
+  display: none;
+}
+
+.yr3Modal.yr3Modal--open {
+  display: flex;
+  top: 0;
+  left: 0;
+  justify-content: center;
+  align-items: center;
+  flex-direction: column;
+  width: 100%;
+  height: 100%;
+}
+
+.yr3Modal-container {
+  background: var(--color-bg);
+  border-radius: var(--radius-md);
+  padding: var(--padding-md, 16px);
+  z-index: 1100;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+}
+
+.yr3Modal-container--sm {
+  width: 300px;
+}
+
+.yr3Modal-container--md {
+  width: 400px;
+}
+
+.yr3Modal-container--lg {
+  width: 600px;
+}
+
+/*# sourceMappingURL=modal.css.map */

package/dist/components/Modal/modal.css.map

@@ -0,0 +1 @@
+{"version":3,"sourceRoot":"","sources":["../../../src/components/Modal/modal.scss"],"names":[],"mappings":"AAAA;EACI;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIJ;EACI;;;AAGJ;EACI;;;AAEJ;EACI","file":"modal.css"}

package/dist/components/Notistack/notistack.css

@@ -0,0 +1,225 @@
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+@keyframes scaleIn {
+  from {
+    transform: scale(0.95);
+    opacity: 0;
+  }
+  to {
+    transform: scale(1);
+    opacity: 1;
+  }
+}
+@keyframes slideIn {
+  from {
+    transform: translateY(20px);
+    opacity: 0;
+  }
+  to {
+    transform: translateY(0);
+    opacity: 1;
+  }
+}
+@keyframes slideOut {
+  from {
+    transform: translateY(0);
+    opacity: 1;
+  }
+  to {
+    transform: translateY(20px);
+    opacity: 0;
+  }
+}
+@keyframes slideTopIn {
+  from {
+    transform: translateY(-40px);
+    opacity: 0;
+  }
+  to {
+    transform: translateY(0);
+    opacity: 1;
+  }
+}
+@keyframes slideTopOut {
+  from {
+    transform: translateY(0);
+    opacity: 1;
+  }
+  to {
+    transform: translateY(-40px);
+    opacity: 0;
+  }
+}
+@keyframes slideTopCenterIn {
+  from {
+    transform: translateY(-40px);
+    opacity: 0;
+  }
+  to {
+    transform: translateY(0);
+    opacity: 1;
+  }
+}
+@keyframes slideTopCenterOut {
+  from {
+    transform: translateY(0);
+    opacity: 1;
+  }
+  to {
+    transform: translateY(-40px);
+    opacity: 0;
+  }
+}
+.yr3Notistack {
+  position: fixed;
+  padding: 12px 16px;
+  width: 200px;
+  border-radius: 8px;
+  background: var(--color-surface);
+  color: var(--color-text-primary);
+  overflow: hidden;
+  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.27);
+}
+
+.yr3Notistack--success {
+  background: var(--color-success);
+}
+
+.yr3Notistack--error {
+  background: var(--color-error);
+}
+
+.yr3Notistack--progress {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  height: 3px;
+  width: 100%;
+  background: rgba(255, 255, 255, 0.5);
+  animation: progress linear forwards;
+}
+
+@keyframes progress {
+  from {
+    transform: scaleX(1);
+    transform-origin: left;
+  }
+  to {
+    transform: scaleX(0);
+    transform-origin: left;
+  }
+}
+.yr3Notistack--color-primary {
+  background: var(--color-primary);
+  color: var(--color-surface);
+}
+
+.yr3Notistack--color-secondary {
+  background: var(--color-secondary);
+  color: var(--color-on-secondary);
+}
+
+.yr3Notistack--color-info {
+  background: var(--color-info);
+}
+
+.yr3Notistack--color-default {
+  background: var(--color-surface);
+  color: var(--color-text-primary);
+}
+
+.yr3Notistack--color-success {
+  background: var(--color-success);
+  color: var(--color-on-success);
+}
+
+.yr3Notistack--color-error {
+  background: var(--color-error);
+  color: var(--color-on-error);
+}
+
+.yr3Notistack--color-warning {
+  background: var(--color-warning);
+  color: var(--color-on-warning);
+}
+
+.yr3Notistack--color-disabled {
+  background: var(--color-disabled);
+  color: var(--color-on-disabled);
+}
+
+.yr3Notistack--color-background {
+  background: var(--color-surface);
+  color: var(--color-text-primary);
+}
+
+.yr3Notistack--color-text {
+  background: var(--color-text-primary);
+  color: var(--color-on-surface);
+}
+
+.yr3Notistack--bottom-right {
+  bottom: 20px;
+  right: 20px;
+  animation: slideIn 0.3s ease;
+}
+.yr3Notistack--bottom-right.yr3Notistack--exit {
+  animation: slideOut 0.3s ease forwards;
+}
+
+.yr3Notistack--bottom-left {
+  bottom: 20px;
+  left: 20px;
+  animation: slideIn 0.3s ease;
+}
+.yr3Notistack--bottom-left.yr3Notistack--exit {
+  animation: slideOut 0.3s ease forwards;
+}
+
+.yr3Notistack--top-left {
+  top: 20px;
+  left: 20px;
+  animation: slideTopIn 0.3s ease;
+}
+.yr3Notistack--top-left.yr3Notistack--exit {
+  animation: slideTopOut 0.3s ease forwards;
+}
+
+.yr3Notistack--top-right {
+  top: 20px;
+  right: 20px;
+  animation: slideTopIn 0.3s ease;
+}
+.yr3Notistack--top-right.yr3Notistack--exit {
+  animation: slideTopOut 0.3s ease forwards;
+}
+
+.yr3Notistack--bottom-center {
+  bottom: 20px;
+  left: calc(50% - 100px);
+  right: calc(50% - 100px);
+  align-items: center;
+  animation: slideIn 0.3s ease forwards;
+}
+.yr3Notistack--bottom-center.yr3Notistack--exit {
+  animation: slideOut 0.3s ease forwards;
+}
+
+.yr3Notistack--top-center {
+  top: 20px;
+  left: calc(50% - 100px);
+  right: calc(50% - 100px);
+  align-items: center;
+  animation: slideTopCenterIn 0.3s ease;
+}
+.yr3Notistack--top-center.yr3Notistack--exit {
+  animation: slideTopCenterOut 0.3s ease forwards;
+}
+
+/*# sourceMappingURL=notistack.css.map */

package/dist/components/Notistack/notistack.css.map

@@ -0,0 +1 @@
+{"version":3,"sourceRoot":"","sources":["../../../src/styles/aminations.scss","../../../src/components/Notistack/notistack.scss"],"names":[],"mappings":"AAAA;EACE;IAAO;;EACP;IAAK;;;AAGP;EACE;IAAO;IAAwB;;EAC/B;IAAK;IAAqB;;;AAG5B;EACE;IACE;IACA;;EAEF;IACE;IACA;;;AAIJ;EACE;IACE;IACA;;EAEF;IACE;IACA;;;AAIJ;EACE;IACE;IACA;;EAEF;IACE;IACA;;;AAIJ;EACE;IACE;IACA;;EAEF;IACE;IACA;;;AAIJ;EACE;IACE;IACA;;EAEF;IACE;IACA;;;AAIJ;EACE;IACE;IACA;;EAEF;IACE;IACA;;;ACrEJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;IACE;IACA;;EAEF;IACE;IACA;;;AAKJ;EACE;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;;;AAmCF;EACE;EACA;EACA;;AACA;EACA;;;AAKF;EACE;EACA;EACA;;AACA;EACA;;;AAIF;EACE;EACA;EACA;;AACA;EACA;;;AAIF;EACE;EACA;EACA;;AACA;EACA;;;AAIF;EACE;EACA;EACA;EACA;EACA;;AACA;EACG;;;AAKL;EACE;EACA;EACA;EACA;EACA;;AACA;EACE","file":"notistack.css"}

package/dist/components/Pending/pending.css

@@ -0,0 +1,79 @@
+.yr3Pending {
+  position: relative;
+  overflow: hidden;
+  background: var(--pending-surface, hsl(0, 0%, 41%));
+}
+
+/* SHIMMER */
+.yr3Pending::after {
+  content: "";
+  position: absolute;
+  inset: 0;
+  background: linear-gradient(90deg, transparent, rgba(220, 219, 219, 0.4), transparent);
+  animation: pulse 1.5s ease-in-out infinite;
+}
+
+/* VARIANTS */
+.yr3Pending--rect {
+  width: 100%;
+  height: 100px;
+}
+
+.yr3Pending--circle {
+  border-radius: 50%;
+}
+
+.yr3Pending--text {
+  height: 14px;
+  border-radius: 4px;
+}
+
+.yr3Pending--color-primary {
+  --pending-surface: var(--color-primary);
+}
+
+.yr3Pending--color-secondary {
+  --pending-surface: var(--color-secondary);
+}
+
+.yr3Pending--color-disabled {
+  --pending-surface: var(--color-disabled);
+}
+
+.yr3Pending--color-text {
+  --pending-surface: var(--color-text-primary);
+}
+
+.yr3Pending--color-error {
+  --pending-surface: var(--color-error);
+}
+
+.yr3Pending--color-success {
+  --pending-surface: var(--color-success);
+}
+
+.yr3Pending--color-warning {
+  --pending-surface: var(--color-warning);
+}
+
+.yr3Pending--color-info {
+  --pending-surface: var(--color-info);
+}
+
+.yr3Pending--color-background {
+  --pending-surface: var(--bg-background);
+}
+
+@keyframes pulse {
+  0% {
+    opacity: 0.6;
+  }
+  50% {
+    opacity: 1;
+  }
+  100% {
+    opacity: 0.6;
+  }
+}
+
+/*# sourceMappingURL=pending.css.map */

package/dist/components/Pending/pending.css.map

@@ -0,0 +1 @@
+{"version":3,"sourceRoot":"","sources":["../../../src/components/Pending/pending.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;;;AAGF;AACA;EACE;EACA;EACA;EACA;EAMA;;;AAIF;AAEA;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAMF;EACE;IAAK;;EACL;IAAM;;EACN;IAAO","file":"pending.css"}