@pathscale/ui 1.1.33 → 1.1.35

package/dist/components/menu/menu.css

@@ -1,364 +0,0 @@
-@layer components {
-  .menu {
-      display: flex;
-      width: fit-content;
-      flex-direction: column;
-      flex-wrap: wrap;
-      padding: calc(0.25rem * 2);
-      --menu-active-fg: var(--color-neutral-content);
-      --menu-active-bg: var(--color-neutral);
-      font-size: 0.875rem;
-    }
-
-  .menu :where(li ul) {
-      position: relative;
-      margin-inline-start: calc(0.25rem * 4);
-      padding-inline-start: calc(0.25rem * 2);
-      white-space: nowrap;
-    }
-
-  .menu :where(li ul):before {
-      position: absolute;
-      inset-inline-start: calc(0.25rem * 0);
-      top: calc(0.25rem * 3);
-      bottom: calc(0.25rem * 3);
-      background-color: var(--color-base-content);
-      opacity: 10%;
-      width: var(--border);
-      content: "";
-    }
-
-  .menu :where(li > .menu-dropdown:not(.menu-dropdown-show)) {
-      display: none;
-    }
-
-  .menu :where(li:not(.menu-title) > *:not(ul, details, .menu-title, .btn)),
-    .menu :where(li:not(.menu-title) > details > summary:not(.menu-title)) {
-      display: grid;
-      grid-auto-flow: column;
-      align-content: flex-start;
-      align-items: center;
-      gap: calc(0.25rem * 2);
-      border-radius: var(--radius-field);
-      padding-inline: calc(0.25rem * 3);
-      padding-block: calc(0.25rem * 1.5);
-      text-align: start;
-      transition-property: color, background-color, box-shadow;
-      transition-duration: 0.2s;
-      transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
-      grid-auto-columns: minmax(auto, max-content) auto max-content;
-      text-wrap: balance;
-      user-select: none;
-    }
-
-  .menu :where(li > details > summary) {
-      --tw-outline-style: none;
-      outline-style: none;
-    }
-
-  @media (forced-colors: active) {
-    .menu :where(li > details > summary) {
-      outline: 2px solid transparent;
-      outline-offset: 2px;
-    }
-    }
-
-  .menu :where(li > details > summary)::-webkit-details-marker {
-      display: none;
-    }
-
-  .menu :where(li > details > summary):after,
-    .menu :where(li > .menu-dropdown-toggle):after {
-      justify-self: flex-end;
-      display: block;
-      height: 0.375rem;
-      width: 0.375rem;
-      rotate: -135deg;
-      translate: 0 -1px;
-      transition-property: rotate, translate;
-      transition-duration: 0.2s;
-      content: "";
-      transform-origin: 50% 50%;
-      box-shadow: 2px 2px inset;
-      pointer-events: none;
-    }
-
-  .menu details {
-      overflow: hidden;
-      interpolate-size: allow-keywords;
-    }
-
-  .menu details::details-content {
-      block-size: 0;
-    }
-
-  @media (prefers-reduced-motion: no-preference) {
-    .menu details::details-content {
-      transition-behavior: allow-discrete;
-      transition-property: block-size, content-visibility;
-      transition-duration: 0.2s;
-      transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
-    }
-    }
-
-  .menu details[open]::details-content {
-      block-size: auto;
-    }
-
-  .menu :where(li > details[open] > summary):after,
-    .menu :where(li > .menu-dropdown-toggle.menu-dropdown-show):after {
-      rotate: 45deg;
-      translate: 0 1px;
-    }
-
-  .menu :where( li:not(.menu-title, .disabled) > *:not(ul, details, .menu-title), li:not(.menu-title, .disabled) > details > summary:not(.menu-title) ):not(.menu-active, :active, .btn).menu-focus,
-    .menu :where( li:not(.menu-title, .disabled) > *:not(ul, details, .menu-title), li:not(.menu-title, .disabled) > details > summary:not(.menu-title) ):not(.menu-active, :active, .btn):focus-visible {
-      cursor: pointer;
-      background-color: var(--color-base-content);
-      color: var(--color-base-content);
-      --tw-outline-style: none;
-      outline-style: none;
-    }
-
-  @supports (color: color-mix(in lab, red, red)) {
-    .menu :where( li:not(.menu-title, .disabled) > *:not(ul, details, .menu-title), li:not(.menu-title, .disabled) > details > summary:not(.menu-title) ):not(.menu-active, :active, .btn).menu-focus,
-    .menu :where( li:not(.menu-title, .disabled) > *:not(ul, details, .menu-title), li:not(.menu-title, .disabled) > details > summary:not(.menu-title) ):not(.menu-active, :active, .btn):focus-visible {
-      background-color: color-mix(in oklab, var(--color-base-content) 10%, transparent);
-    }
-    }
-
-  @media (forced-colors: active) {
-    .menu :where( li:not(.menu-title, .disabled) > *:not(ul, details, .menu-title), li:not(.menu-title, .disabled) > details > summary:not(.menu-title) ):not(.menu-active, :active, .btn).menu-focus,
-    .menu :where( li:not(.menu-title, .disabled) > *:not(ul, details, .menu-title), li:not(.menu-title, .disabled) > details > summary:not(.menu-title) ):not(.menu-active, :active, .btn):focus-visible {
-      outline: 2px solid transparent;
-      outline-offset: 2px;
-    }
-    }
-
-  .menu :where( li:not(.menu-title, .disabled) > *:not(ul, details, .menu-title):not(.menu-active, :active, .btn):hover, li:not(.menu-title, .disabled) > details > summary:not(.menu-title):not(.menu-active, :active, .btn):hover ) {
-      cursor: pointer;
-      background-color: var(--color-base-content);
-      --tw-outline-style: none;
-      outline-style: none;
-      box-shadow: 0 1px oklch(0% 0 0 / 0.01) inset, 0 -1px oklch(100% 0 0 / 0.01) inset;
-    }
-
-  @supports (color: color-mix(in lab, red, red)) {
-    .menu :where( li:not(.menu-title, .disabled) > *:not(ul, details, .menu-title):not(.menu-active, :active, .btn):hover, li:not(.menu-title, .disabled) > details > summary:not(.menu-title):not(.menu-active, :active, .btn):hover ) {
-      background-color: color-mix(in oklab, var(--color-base-content) 10%, transparent);
-    }
-    }
-
-  @media (forced-colors: active) {
-    .menu :where( li:not(.menu-title, .disabled) > *:not(ul, details, .menu-title):not(.menu-active, :active, .btn):hover, li:not(.menu-title, .disabled) > details > summary:not(.menu-title):not(.menu-active, :active, .btn):hover ) {
-      outline: 2px solid transparent;
-      outline-offset: 2px;
-    }
-    }
-
-  .menu :where(li:empty) {
-      background-color: var(--color-base-content);
-      opacity: 10%;
-      margin: 0.5rem 1rem;
-      height: 1px;
-    }
-
-  .menu :where(li) {
-      position: relative;
-      display: flex;
-      flex-shrink: 0;
-      flex-direction: column;
-      flex-wrap: wrap;
-      align-items: stretch;
-    }
-
-  .menu :where(li) .badge {
-      justify-self: flex-end;
-    }
-
-  .menu :where(li) > *:not(ul, .menu-title, details, .btn):active,
-    .menu :where(li) > *:not(ul, .menu-title, details, .btn).menu-active,
-    .menu :where(li) > details > summary:active {
-      --tw-outline-style: none;
-      outline-style: none;
-      color: var(--menu-active-fg);
-      background-color: var(--menu-active-bg);
-      background-size: auto, calc(var(--noise) * 100%);
-      background-image: none, var(--fx-noise);
-    }
-
-  @media (forced-colors: active) {
-    .menu :where(li) > *:not(ul, .menu-title, details, .btn):active,
-    .menu :where(li) > *:not(ul, .menu-title, details, .btn).menu-active,
-    .menu :where(li) > details > summary:active {
-      outline: 2px solid transparent;
-      outline-offset: 2px;
-    }
-    }
-
-  .menu :where(li) > *:not(ul, .menu-title, details, .btn):active:not(.menu :where(li) > *:not(ul, .menu-title, details, .btn):active:active),
-    .menu :where(li) > *:not(ul, .menu-title, details, .btn).menu-active:not(.menu :where(li) > *:not(ul, .menu-title, details, .btn).menu-active:active),
-    .menu :where(li) > details > summary:active:not(.menu :where(li) > details > summary:active:active) {
-      box-shadow: 0 2px calc(var(--depth) * 3px) -2px var(--menu-active-bg);
-    }
-
-  .menu :where(li).menu-disabled {
-      pointer-events: none;
-      color: var(--color-base-content);
-    }
-
-  @supports (color: color-mix(in lab, red, red)) {
-    .menu :where(li).menu-disabled {
-      color: color-mix(in oklab, var(--color-base-content) 20%, transparent);
-    }
-    }
-
-  .menu .dropdown:focus-within .menu-dropdown-toggle:after {
-      rotate: 45deg;
-      translate: 0 1px;
-    }
-
-  .menu .dropdown-content {
-      margin-top: calc(0.25rem * 2);
-      padding: calc(0.25rem * 2);
-    }
-
-  .menu .dropdown-content:before {
-      display: none;
-    }
-
-  .menu-horizontal {
-      display: inline-flex;
-      flex-direction: row;
-    }
-
-  .menu-horizontal > li:not(.menu-title) > details > ul {
-      position: absolute;
-      margin-inline-start: calc(0.25rem * 0);
-      margin-top: calc(0.25rem * 4);
-      transform-origin: top;
-      border-radius: var(--radius-box);
-      background-color: var(--color-base-100);
-      padding-block: calc(0.25rem * 2);
-      padding-inline-end: calc(0.25rem * 2);
-      opacity: 0%;
-      scale: 95%;
-      box-shadow: 0 1px 3px 0 oklch(0% 0 0/0.1), 0 1px 2px -1px oklch(0% 0 0/0.1);
-    }
-
-  @media (prefers-reduced-motion: no-preference) {
-    @starting-style {
-    .menu-horizontal > li:not(.menu-title) > details > ul {
-      scale: 95%;
-      opacity: 0;
-    }
-    }
-    }
-
-  .menu-horizontal > li:not(.menu-title) > details[open] > ul {
-      opacity: 100%;
-      scale: 100%;
-    }
-
-  .menu-horizontal > li > details > ul:before {
-      --tw-content: none;
-      content: var(--tw-content);
-    }
-
-  .menu-vertical {
-      display: inline-flex;
-      flex-direction: column;
-    }
-
-  .menu-vertical > li:not(.menu-title) > details > ul {
-      position: relative;
-      margin-inline-start: calc(0.25rem * 4);
-      margin-top: calc(0.25rem * 0);
-      padding-block: calc(0.25rem * 0);
-      padding-inline-end: calc(0.25rem * 0);
-      background-color: revert-layer;
-      border-radius: revert-layer;
-      animation: revert-layer;
-      transition: revert-layer;
-      box-shadow: revert-layer;
-    }
-
-  .menu-lg :where(li:not(.menu-title) > *:not(ul, details, .menu-title)),
-    .menu-lg :where(li:not(.menu-title) > details > summary:not(.menu-title)) {
-      border-radius: var(--radius-field);
-      padding-inline: calc(0.25rem * 4);
-      padding-block: calc(0.25rem * 1.5);
-      font-size: 1.125rem;
-    }
-
-  .menu-lg .menu-title {
-      padding-inline: calc(0.25rem * 6);
-      padding-block: calc(0.25rem * 3);
-    }
-
-  .menu-md :where(li:not(.menu-title) > *:not(ul, details, .menu-title)),
-    .menu-md :where(li:not(.menu-title) > details > summary:not(.menu-title)) {
-      border-radius: var(--radius-field);
-      padding-inline: calc(0.25rem * 3);
-      padding-block: calc(0.25rem * 1.5);
-      font-size: 0.875rem;
-    }
-
-  .menu-md .menu-title {
-      padding-inline: calc(0.25rem * 3);
-      padding-block: calc(0.25rem * 2);
-    }
-
-  .menu-sm :where(li:not(.menu-title) > *:not(ul, details, .menu-title)),
-    .menu-sm :where(li:not(.menu-title) > details > summary:not(.menu-title)) {
-      border-radius: var(--radius-field);
-      padding-inline: calc(0.25rem * 2.5);
-      padding-block: calc(0.25rem * 1);
-      font-size: 0.75rem;
-    }
-
-  .menu-sm .menu-title {
-      padding-inline: calc(0.25rem * 3);
-      padding-block: calc(0.25rem * 2);
-    }
-
-  .menu-xl :where(li:not(.menu-title) > *:not(ul, details, .menu-title)),
-    .menu-xl :where(li:not(.menu-title) > details > summary:not(.menu-title)) {
-      border-radius: var(--radius-field);
-      padding-inline: calc(0.25rem * 5);
-      padding-block: calc(0.25rem * 1.5);
-      font-size: 1.375rem;
-    }
-
-  .menu-xl .menu-title {
-      padding-inline: calc(0.25rem * 6);
-      padding-block: calc(0.25rem * 3);
-    }
-
-  .menu-xs :where(li:not(.menu-title) > *:not(ul, details, .menu-title)),
-    .menu-xs :where(li:not(.menu-title) > details > summary:not(.menu-title)) {
-      border-radius: var(--radius-field);
-      padding-inline: calc(0.25rem * 2);
-      padding-block: calc(0.25rem * 1);
-      font-size: 0.6875rem;
-    }
-
-  .menu-xs .menu-title {
-      padding-inline: calc(0.25rem * 2);
-      padding-block: calc(0.25rem * 1);
-    }
-
-  .menu-title {
-      padding-inline: calc(0.25rem * 3);
-      padding-block: calc(0.25rem * 2);
-      color: var(--color-base-content);
-      font-size: 0.875rem;
-      font-weight: 600;
-    }
-
-  @supports (color: color-mix(in lab, red, red)) {
-    .menu-title {
-      color: color-mix(in oklab, var(--color-base-content) 40%, transparent);
-    }
-    }
-}

package/dist/components/textarea/textarea.css

@@ -1,191 +0,0 @@
-@layer components {
-  .textarea {
-      border: var(--border) solid #0000;
-      min-height: calc(0.25rem * 20);
-      flex-shrink: 1;
-      appearance: none;
-      border-radius: var(--radius-field);
-      background-color: var(--color-base-100);
-      padding-block: calc(0.25rem * 2);
-      vertical-align: middle;
-      width: clamp(3rem, 20rem, 100%);
-      padding-inline-start: 0.75rem;
-      padding-inline-end: 0.75rem;
-      font-size: max(var(--font-size, 0.875rem), 0.875rem);
-      touch-action: manipulation;
-      border-color: var(--input-color);
-      box-shadow: 0 1px var(--input-color) inset, 0 -1px oklch(100% 0 0 / calc(var(--depth) * 0.1)) inset;
-      --input-color: var(--color-base-content);
-    }
-
-  @supports (color: color-mix(in lab, red, red)) {
-    .textarea {
-      box-shadow: 0 1px color-mix(in oklab, var(--input-color) calc(var(--depth) * 10%), #0000) inset, 0 -1px oklch(100% 0 0 / calc(var(--depth) * 0.1)) inset;
-    }
-    }
-
-  @supports (color: color-mix(in lab, red, red)) {
-    .textarea {
-      --input-color: color-mix(in oklab, var(--color-base-content) 20%, #0000);
-    }
-    }
-
-  .textarea textarea {
-      appearance: none;
-      background-color: transparent;
-      border: none;
-    }
-
-  .textarea textarea:focus,
-    .textarea textarea:focus-within {
-      --tw-outline-style: none;
-      outline-style: none;
-    }
-
-  @media (forced-colors: active) {
-    .textarea textarea:focus,
-    .textarea textarea:focus-within {
-      outline: 2px solid transparent;
-      outline-offset: 2px;
-    }
-    }
-
-  .textarea:focus,
-    .textarea:focus-within {
-      --input-color: var(--color-base-content);
-      box-shadow: 0 1px var(--input-color);
-      outline: 2px solid var(--input-color);
-      outline-offset: 2px;
-      isolation: isolate;
-    }
-
-  @supports (color: color-mix(in lab, red, red)) {
-    .textarea:focus,
-    .textarea:focus-within {
-      box-shadow: 0 1px color-mix(in oklab, var(--input-color) calc(var(--depth) * 10%), #0000);
-    }
-    }
-
-  @media (pointer: coarse) {
-    @supports (-webkit-touch-callout: none) {
-    .textarea:focus,
-    .textarea:focus-within {
-      --font-size: 1rem;
-    }
-    }
-    }
-
-  .textarea:has(> textarea[disabled]),
-    .textarea:is(:disabled, [disabled]) {
-      cursor: not-allowed;
-      border-color: var(--color-base-200);
-      background-color: var(--color-base-200);
-      color: var(--color-base-content);
-      box-shadow: none;
-    }
-
-  @supports (color: color-mix(in lab, red, red)) {
-    .textarea:has(> textarea[disabled]),
-    .textarea:is(:disabled, [disabled]) {
-      color: color-mix(in oklab, var(--color-base-content) 40%, transparent);
-    }
-    }
-
-  .textarea:has(> textarea[disabled])::placeholder,
-    .textarea:is(:disabled, [disabled])::placeholder {
-      color: var(--color-base-content);
-    }
-
-  @supports (color: color-mix(in lab, red, red)) {
-    .textarea:has(> textarea[disabled])::placeholder,
-    .textarea:is(:disabled, [disabled])::placeholder {
-      color: color-mix(in oklab, var(--color-base-content) 20%, transparent);
-    }
-    }
-
-  .textarea:has(> textarea[disabled]) > textarea[disabled] {
-      cursor: not-allowed;
-    }
-
-  .textarea-ghost {
-      background-color: transparent;
-      box-shadow: none;
-      border-color: #0000;
-    }
-
-  .textarea-ghost:focus,
-    .textarea-ghost:focus-within {
-      background-color: var(--color-base-100);
-      color: var(--color-base-content);
-      border-color: #0000;
-      box-shadow: none;
-    }
-
-  .textarea-lg {
-      font-size: max(var(--font-size, 1.125rem), 1.125rem);
-    }
-
-  .textarea-md {
-      font-size: max(var(--font-size, 0.875rem), 0.875rem);
-    }
-
-  .textarea-sm {
-      font-size: max(var(--font-size, 0.75rem), 0.75rem);
-    }
-
-  .textarea-xl {
-      font-size: max(var(--font-size, 1.375rem), 1.375rem);
-    }
-
-  .textarea-xs {
-      font-size: max(var(--font-size, 0.6875rem), 0.6875rem);
-    }
-
-  .textarea-accent,
-    .textarea-accent:focus,
-    .textarea-accent:focus-within {
-      --input-color: var(--color-accent);
-    }
-
-  .textarea-error,
-    .textarea-error:focus,
-    .textarea-error:focus-within {
-      --input-color: var(--color-error);
-    }
-
-  .textarea-info,
-    .textarea-info:focus,
-    .textarea-info:focus-within {
-      --input-color: var(--color-info);
-    }
-
-  .textarea-neutral,
-    .textarea-neutral:focus,
-    .textarea-neutral:focus-within {
-      --input-color: var(--color-neutral);
-    }
-
-  .textarea-primary,
-    .textarea-primary:focus,
-    .textarea-primary:focus-within {
-      --input-color: var(--color-primary);
-    }
-
-  .textarea-secondary,
-    .textarea-secondary:focus,
-    .textarea-secondary:focus-within {
-      --input-color: var(--color-secondary);
-    }
-
-  .textarea-success,
-    .textarea-success:focus,
-    .textarea-success:focus-within {
-      --input-color: var(--color-success);
-    }
-
-  .textarea-warning,
-    .textarea-warning:focus,
-    .textarea-warning:focus-within {
-      --input-color: var(--color-warning);
-    }
-}