@lostgradient/cinder 0.4.0 → 0.5.0

package/dist/server/components/grid-list/index.css

@@ -1,96 +0,0 @@
-/* src/components/grid-list/grid-list.css */
-@layer cinder.tokens, cinder.foundation, cinder.components, cinder.utilities;
-
-@layer cinder.components {
-  .cinder-grid-list {
-    --cinder-grid-list-min-width: 16rem;
-    list-style: none;
-    display: grid;
-    grid-template-columns: repeat(auto-fill, minmax(min(var(--cinder-grid-list-min-width), 100%), 1fr));
-    gap: var(--cinder-space-4);
-    inline-size: 100%;
-    margin: 0;
-    padding: 0;
-  }
-
-  .cinder-grid-list__item {
-    position: relative;
-    display: flex;
-    gap: var(--cinder-space-2);
-    padding: var(--cinder-space-4);
-    border-radius: var(--cinder-radius-lg);
-    background: var(--cinder-surface-raised);
-    border: 1px solid var(--cinder-border-muted);
-    color: var(--cinder-text);
-    box-shadow: var(--cinder-shadow-sm);
-    flex-direction: column;
-    transition: box-shadow .15s, border-color .15s;
-  }
-
-  @media (hover: hover) {
-    .cinder-grid-list__item:has(.cinder-grid-list__link:hover) {
-      box-shadow: var(--cinder-shadow-md);
-      border-color: var(--cinder-border);
-    }
-  }
-
-  .cinder-grid-list__image, .cinder-grid-list__title, .cinder-grid-list__subtitle, .cinder-grid-list__meta {
-    min-inline-size: 0;
-  }
-
-  .cinder-grid-list__title {
-    font-size: var(--cinder-text-base);
-    font-weight: var(--cinder-font-medium);
-    color: var(--cinder-text);
-  }
-
-  .cinder-grid-list__subtitle {
-    font-size: var(--cinder-text-sm);
-    color: var(--cinder-text-muted);
-  }
-
-  .cinder-grid-list__meta {
-    font-size: var(--cinder-text-sm);
-    color: var(--cinder-text-subtle);
-  }
-
-  .cinder-grid-list__link {
-    color: inherit;
-    text-decoration: none;
-  }
-
-  .cinder-grid-list__link:after {
-    content: "";
-    position: absolute;
-    border-radius: var(--cinder-radius-lg);
-    z-index: 0;
-    inset: 0;
-  }
-
-  .cinder-grid-list__link:focus-visible {
-    outline: var(--cinder-ring-width) solid transparent;
-    border-radius: var(--cinder-radius-lg);
-    box-shadow: var(--_cinder-focus-ring-shadow);
-  }
-
-  @media (forced-colors: active) {
-    .cinder-grid-list__link:focus-visible {
-      outline: var(--cinder-ring-width) solid ButtonText;
-      outline-offset: 3px;
-    }
-  }
-
-  .cinder-grid-list__actions {
-    position: relative;
-    z-index: 1;
-    display: flex;
-    gap: var(--cinder-space-2);
-    flex-wrap: wrap;
-    margin-block-start: auto;
-  }
-
-  .cinder-grid-list__item [data-cinder-stretched-link-escape] {
-    position: relative;
-    z-index: 1;
-  }
-}

package/dist/server/components/hover-card/index.css

@@ -1,53 +0,0 @@
-/* src/components/hover-card/hover-card.css */
-@layer cinder.tokens, cinder.foundation, cinder.components, cinder.utilities;
-
-@layer cinder.components {
-  .cinder-hover-card__trigger {
-    display: inline-flex;
-  }
-
-  .cinder-hover-card {
-    position: fixed;
-    z-index: var(--cinder-z-popover, 1000);
-    padding: var(--cinder-space-4);
-    border: 1px solid var(--cinder-border-muted);
-    border-radius: var(--cinder-radius-md);
-    background: var(--cinder-surface-raised);
-    color: var(--cinder-text);
-    box-shadow: var(--cinder-shadow-lg);
-    opacity: 0;
-    transition: opacity var(--cinder-duration-fast) var(--cinder-ease-standard), transform var(--cinder-duration-fast) var(--cinder-ease-standard);
-    max-width: min(20rem, 100vw - 2rem);
-    transform: translateY(2px)scale(.98);
-  }
-
-  .cinder-hover-card > :first-child {
-    margin-block-start: 0;
-  }
-
-  .cinder-hover-card > :last-child {
-    margin-block-end: 0;
-  }
-
-  .cinder-hover-card[data-cinder-position-ready="true"] {
-    opacity: 1;
-    transform: translateY(0)scale(1);
-  }
-
-  .cinder-hover-card__arrow {
-    position: absolute;
-    background: inherit;
-    border-inline-start: 1px solid var(--cinder-border-muted);
-    border-block-start: 1px solid var(--cinder-border-muted);
-    width: .625rem;
-    height: .625rem;
-    rotate: 45deg;
-  }
-
-  @media (prefers-reduced-motion: reduce) {
-    .cinder-hover-card {
-      transition: none;
-      transform: none;
-    }
-  }
-}

package/dist/server/components/image/index.css

@@ -1,37 +0,0 @@
-/* src/components/image/image.css */
-@layer cinder.tokens, cinder.foundation, cinder.components, cinder.utilities;
-
-@layer cinder.components {
-  .cinder-image {
-    display: block;
-    position: relative;
-    overflow: hidden;
-    background-color: var(--cinder-surface-inset);
-    background-position: center;
-    background-repeat: no-repeat;
-    background-size: cover;
-    max-width: 100%;
-  }
-
-  .cinder-image:not([data-cinder-loaded]):not([data-cinder-errored]) {
-    image-rendering: pixelated;
-  }
-
-  .cinder-image__img {
-    display: block;
-    object-fit: cover;
-    image-rendering: auto;
-    opacity: 0;
-    transition: opacity var(--cinder-duration) var(--cinder-ease-standard);
-    width: 100%;
-    height: 100%;
-  }
-
-  .cinder-image[data-cinder-loaded] .cinder-image__img, .cinder-image[data-cinder-errored]:not([data-cinder-fallback]) .cinder-image__img {
-    opacity: 1;
-  }
-
-  .cinder-image[data-cinder-loaded], .cinder-image[data-cinder-errored] {
-    background-image: none;
-  }
-}

package/dist/server/components/input/index.css

@@ -1,213 +0,0 @@
-/* src/components/input/input.css */
-@layer cinder.tokens, cinder.foundation, cinder.components, cinder.utilities;
-
-@layer cinder.components {
-  .cinder-input-field {
-    display: flex;
-    gap: var(--cinder-space-1-5);
-    flex-direction: column;
-    inline-size: 100%;
-  }
-
-  .cinder-input-field__label {
-    display: inline-flex;
-    align-items:  center;
-    gap: var(--cinder-space-1);
-    font-size: var(--cinder-text-xs);
-    font-weight: var(--cinder-font-medium);
-    color: var(--cinder-text);
-    line-height: 1;
-  }
-
-  .cinder-input-field__label[data-disabled] {
-    color: var(--cinder-text-disabled);
-    cursor: not-allowed;
-  }
-
-  .cinder-input {
-    display: block;
-    padding: var(--cinder-space-1-5) var(--cinder-space-3);
-    font-size: var(--cinder-text-sm);
-    font-family: inherit;
-    line-height: var(--cinder-leading-normal);
-    color: var(--cinder-text);
-    background: var(--cinder-surface-raised);
-    border: 1px solid var(--cinder-border);
-    border-radius: var(--cinder-radius-md);
-    appearance: none;
-    transition: border-color var(--cinder-duration-fast) var(--cinder-ease-standard), box-shadow var(--cinder-duration-fast) var(--cinder-ease-standard);
-    width: 100%;
-    min-height: 2.25rem;
-  }
-
-  .cinder-input::placeholder {
-    color: var(--cinder-text-subtle);
-  }
-
-  @media (hover: hover) {
-    .cinder-input:hover:not(:disabled) {
-      border-color: var(--cinder-border-strong);
-    }
-  }
-
-  .cinder-input[data-cinder-native-date] {
-    cursor: pointer;
-  }
-
-  .cinder-input[data-cinder-native-date]::-webkit-calendar-picker-indicator {
-    opacity: 0;
-  }
-
-  .cinder-input:focus-visible {
-    outline: var(--cinder-ring-width) solid transparent;
-    box-shadow: 0 0 0 var(--cinder-ring-offset) var(--cinder-ring-offset-color), 0 0 0 calc(var(--cinder-ring-offset)  + var(--cinder-ring-width)) var(--_cinder-input-ring, var(--cinder-ring-color));
-  }
-
-  @media (forced-colors: active) {
-    .cinder-input:focus-visible {
-      outline: var(--cinder-ring-width) solid Highlight;
-      outline-offset: 1px;
-    }
-  }
-
-  .cinder-input:disabled {
-    background: var(--cinder-surface-inset);
-    border-color: var(--cinder-border-muted);
-    color: var(--cinder-text-disabled);
-    cursor: not-allowed;
-  }
-
-  .cinder-input:disabled::placeholder {
-    color: var(--cinder-text-disabled);
-  }
-
-  .cinder-input[aria-invalid="true"] {
-    --_cinder-input-ring: var(--cinder-danger);
-    border-color: var(--cinder-danger);
-  }
-
-  @media (hover: hover) {
-    .cinder-input[aria-invalid="true"]:hover:not(:disabled) {
-      border-color: oklch(from var(--cinder-danger) calc(l - .06) c h);
-    }
-  }
-
-  .cinder-input-field__description {
-    font-size: var(--cinder-text-xs);
-    line-height: var(--cinder-leading-normal);
-    color: var(--cinder-text-muted);
-    margin: 0;
-  }
-
-  .cinder-input-field__error {
-    font-size: var(--cinder-text-xs);
-    line-height: var(--cinder-leading-normal);
-    color: var(--cinder-danger);
-    margin: 0;
-  }
-
-  .cinder-input-group {
-    display: flex;
-    position: relative;
-    background: var(--cinder-surface-raised);
-    border: 1px solid var(--cinder-border);
-    border-radius: var(--cinder-radius-md);
-    transition: border-color var(--cinder-duration-fast) var(--cinder-ease-standard), box-shadow var(--cinder-duration-fast) var(--cinder-ease-standard);
-    align-items: stretch;
-    inline-size: 100%;
-  }
-
-  .cinder-input-group > .cinder-input {
-    padding-inline: var(--cinder-space-3);
-    background: none;
-    border: none;
-    border-radius: 0;
-    flex: auto;
-    min-width: 0;
-  }
-
-  .cinder-input-group[data-leading] > .cinder-input {
-    padding-inline-start: var(--cinder-space-2);
-  }
-
-  .cinder-input-group[data-trailing] > .cinder-input {
-    padding-inline-end: var(--cinder-space-2);
-  }
-
-  .cinder-input-group[data-native-date] > .cinder-input {
-    padding-inline-end: var(--cinder-space-10);
-  }
-
-  .cinder-input-group > .cinder-input:focus-visible {
-    box-shadow: none;
-    outline: none;
-  }
-
-  @media (hover: hover) {
-    .cinder-input-group:hover:not([data-disabled]) {
-      border-color: var(--cinder-border-strong);
-    }
-  }
-
-  .cinder-input-group:focus-within {
-    outline: var(--cinder-ring-width) solid transparent;
-    box-shadow: 0 0 0 var(--cinder-ring-offset) var(--cinder-ring-offset-color), 0 0 0 calc(var(--cinder-ring-offset)  + var(--cinder-ring-width)) var(--_cinder-input-ring, var(--cinder-ring-color));
-  }
-
-  @media (forced-colors: active) {
-    .cinder-input-group:focus-within {
-      outline: var(--cinder-ring-width) solid Highlight;
-      outline-offset: 1px;
-    }
-  }
-
-  .cinder-input-group[data-invalid] {
-    --_cinder-input-ring: var(--cinder-danger);
-    border-color: var(--cinder-danger);
-  }
-
-  @media (hover: hover) {
-    .cinder-input-group[data-invalid]:hover:not([data-disabled]) {
-      border-color: oklch(from var(--cinder-danger) calc(l - .06) c h);
-    }
-  }
-
-  .cinder-input-group[data-disabled] {
-    background: var(--cinder-surface-inset);
-    border-color: var(--cinder-border-muted);
-    cursor: not-allowed;
-  }
-
-  .cinder-input-group[data-disabled] > .cinder-input {
-    color: var(--cinder-text-disabled);
-    background: none;
-  }
-
-  .cinder-input-group__leading, .cinder-input-group__trailing {
-    display: inline-flex;
-    box-sizing: border-box;
-    align-items:  center;
-    gap: var(--cinder-space-1);
-    padding-inline: var(--cinder-space-3);
-    color: var(--cinder-text-muted);
-    font-size: var(--cinder-text-sm);
-    line-height: var(--cinder-leading-normal);
-    flex: none;
-    max-inline-size: 40%;
-  }
-
-  .cinder-input-group__leading:not([aria-hidden]), .cinder-input-group__trailing:not([aria-hidden]) {
-    padding-inline: var(--cinder-space-1);
-    overflow: visible;
-  }
-
-  .cinder-input-group__date-icon {
-    position: absolute;
-    display: inline-flex;
-    pointer-events: none;
-    align-items:  center;
-    padding-inline: 0;
-    inset-block: 0;
-    inset-inline-end: var(--cinder-space-3);
-  }
-}

package/dist/server/components/invocation-rule-builder/index.css

@@ -1,307 +0,0 @@
-/* src/components/invocation-rule-builder/invocation-rule-builder.css */
-@layer cinder.tokens, cinder.foundation, cinder.components, cinder.utilities;
-
-@layer cinder.components {
-  .cinder-invocation-rule-builder {
-    display: flex;
-    gap: var(--cinder-space-4);
-    flex-direction: column;
-  }
-
-  .cinder-invocation-rule-builder__rule {
-    display: flex;
-    gap: var(--cinder-space-3);
-    padding: var(--cinder-space-4);
-    border: 1px solid var(--cinder-border-muted);
-    border-radius: var(--cinder-radius-md);
-    background: var(--cinder-surface-raised);
-    box-shadow: var(--cinder-shadow-sm);
-    flex-direction: column;
-  }
-
-  .cinder-invocation-rule-builder__rule-header {
-    display: flex;
-    align-items:  center;
-    gap: var(--cinder-space-2);
-  }
-
-  .cinder-invocation-rule-builder__rule-label {
-    font-size: var(--cinder-text-sm);
-    font-weight: var(--cinder-font-semibold);
-    color: var(--cinder-text);
-    overflow-wrap: anywhere;
-    flex: auto;
-    min-inline-size: 0;
-    margin: 0;
-  }
-
-  .cinder-invocation-rule-builder__rule-label-field {
-    flex: auto;
-    min-inline-size: 0;
-  }
-
-  .cinder-invocation-rule-builder__rule-label-input {
-    min-block-size: var(--cinder-control-height-sm, 2rem);
-    padding-inline: var(--cinder-space-2);
-    border: 1px solid var(--cinder-border);
-    border-radius: var(--cinder-radius-sm);
-    background: var(--cinder-surface);
-    color: var(--cinder-text);
-    font: inherit;
-    font-size: var(--cinder-text-sm);
-    font-weight: var(--cinder-font-semibold);
-    inline-size: 100%;
-  }
-
-  .cinder-invocation-rule-builder__rule-label-input:focus-visible {
-    outline: var(--cinder-ring-width) solid transparent;
-    box-shadow: var(--_cinder-focus-ring-shadow);
-  }
-
-  @media (forced-colors: active) {
-    .cinder-invocation-rule-builder__rule-label-input:focus-visible {
-      outline: var(--cinder-ring-width) solid ButtonText;
-    }
-  }
-
-  .cinder-invocation-rule-builder__rule-controls {
-    display: inline-flex;
-    gap: var(--cinder-space-1);
-    flex-shrink: 0;
-    align-items:  center;
-  }
-
-  .cinder-invocation-rule-builder__section-heading {
-    display: block;
-    font-size: var(--cinder-text-xs);
-    font-weight: var(--cinder-font-semibold);
-    text-transform: uppercase;
-    color: var(--cinder-text);
-    margin-block-end: var(--cinder-space-2);
-  }
-
-  .cinder-invocation-rule-builder__conditions {
-    display: flex;
-    gap: var(--cinder-space-2);
-    flex-direction: column;
-  }
-
-  .cinder-invocation-rule-builder__condition {
-    display: flex;
-    align-items:  center;
-    gap: var(--cinder-space-2);
-    flex-wrap: wrap;
-  }
-
-  .cinder-invocation-rule-builder__condition-select {
-    block-size: var(--cinder-control-height-sm, 2rem);
-    border: 1px solid var(--cinder-border);
-    border-radius: var(--cinder-radius-sm);
-    background: var(--cinder-surface);
-    color: var(--cinder-text);
-    font-size: var(--cinder-text-sm);
-    cursor: pointer;
-    appearance: none;
-    background-image: linear-gradient(45deg, #0000 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, #0000 50%);
-    background-position: calc(100% - .85rem), calc(100% - .55rem);
-    background-repeat: no-repeat;
-    background-size: .3rem .3rem, .3rem .3rem;
-    flex: 8rem;
-    min-inline-size: 6rem;
-    padding-inline-start: var(--cinder-space-2);
-    padding-inline-end: var(--cinder-space-7);
-    font-family: inherit;
-  }
-
-  .cinder-invocation-rule-builder__condition-select:focus-visible {
-    outline: var(--cinder-ring-width) solid transparent;
-    box-shadow: var(--_cinder-focus-ring-shadow);
-  }
-
-  @media (forced-colors: active) {
-    .cinder-invocation-rule-builder__condition-select:focus-visible {
-      outline: var(--cinder-ring-width) solid ButtonText;
-    }
-  }
-
-  .cinder-invocation-rule-builder__condition-value {
-    block-size: var(--cinder-control-height-sm, 2rem);
-    padding-inline: var(--cinder-space-2);
-    border: 1px solid var(--cinder-border);
-    border-radius: var(--cinder-radius-sm);
-    background: var(--cinder-surface);
-    color: var(--cinder-text);
-    font-size: var(--cinder-text-sm);
-    flex: 2 10rem;
-    min-inline-size: 6rem;
-    font-family: inherit;
-  }
-
-  .cinder-invocation-rule-builder__condition-value:focus-visible {
-    outline: var(--cinder-ring-width) solid transparent;
-    box-shadow: var(--_cinder-focus-ring-shadow);
-  }
-
-  @media (forced-colors: active) {
-    .cinder-invocation-rule-builder__condition-value:focus-visible {
-      outline: var(--cinder-ring-width) solid ButtonText;
-    }
-  }
-
-  .cinder-invocation-rule-builder__actions {
-    display: flex;
-    gap: var(--cinder-space-2);
-    flex-direction: column;
-  }
-
-  .cinder-invocation-rule-builder__action {
-    display: flex;
-    align-items:  center;
-    gap: var(--cinder-space-2);
-  }
-
-  .cinder-invocation-rule-builder__action-select {
-    block-size: var(--cinder-control-height-sm, 2rem);
-    border: 1px solid var(--cinder-border);
-    border-radius: var(--cinder-radius-sm);
-    background: var(--cinder-surface);
-    color: var(--cinder-text);
-    font-size: var(--cinder-text-sm);
-    cursor: pointer;
-    appearance: none;
-    background-image: linear-gradient(45deg, #0000 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, #0000 50%);
-    background-position: calc(100% - .85rem), calc(100% - .55rem);
-    background-repeat: no-repeat;
-    background-size: .3rem .3rem, .3rem .3rem;
-    flex: auto;
-    padding-inline-start: var(--cinder-space-2);
-    padding-inline-end: var(--cinder-space-7);
-    font-family: inherit;
-  }
-
-  .cinder-invocation-rule-builder__validation {
-    margin: 0 0 var(--cinder-space-2);
-    color: var(--cinder-color-warning-fg);
-    font-size: var(--cinder-text-xs);
-  }
-
-  .cinder-invocation-rule-builder__action-select:focus-visible {
-    outline: var(--cinder-ring-width) solid transparent;
-    box-shadow: var(--_cinder-focus-ring-shadow);
-  }
-
-  @media (forced-colors: active) {
-    .cinder-invocation-rule-builder__action-select:focus-visible {
-      outline: var(--cinder-ring-width) solid ButtonText;
-    }
-  }
-
-  .cinder-invocation-rule-builder__icon-btn {
-    display: inline-flex;
-    border: 1px solid var(--cinder-border-muted);
-    border-radius: var(--cinder-radius-sm);
-    background: var(--cinder-surface);
-    color: var(--cinder-text-muted);
-    cursor: pointer;
-    flex-shrink: 0;
-    justify-content: center;
-    align-items:  center;
-    block-size: 2rem;
-    inline-size: 2rem;
-    padding: 0;
-    font-family: inherit;
-  }
-
-  .cinder-invocation-rule-builder__icon-btn:focus-visible {
-    outline: var(--cinder-ring-width) solid transparent;
-    box-shadow: var(--_cinder-focus-ring-shadow);
-  }
-
-  @media (forced-colors: active) {
-    .cinder-invocation-rule-builder__icon-btn:focus-visible {
-      outline: var(--cinder-ring-width) solid ButtonText;
-    }
-  }
-
-  @media (hover: hover) {
-    .cinder-invocation-rule-builder__icon-btn:hover {
-      background: var(--cinder-surface-hover);
-      color: var(--cinder-text);
-      border-color: var(--cinder-border);
-    }
-  }
-
-  .cinder-invocation-rule-builder__icon-btn:disabled {
-    opacity: .4;
-    cursor: not-allowed;
-  }
-
-  .cinder-invocation-rule-builder__add-btn {
-    display: inline-flex;
-    align-items:  center;
-    gap: var(--cinder-space-1);
-    padding-block: var(--cinder-space-1);
-    padding-inline: var(--cinder-space-2);
-    border: 1px dashed var(--cinder-border-muted);
-    border-radius: var(--cinder-radius-sm);
-    color: var(--cinder-text-muted);
-    font-size: var(--cinder-text-sm);
-    cursor: pointer;
-    background: none;
-    align-self:  flex-start;
-    font-family: inherit;
-  }
-
-  .cinder-invocation-rule-builder__conditions + .cinder-invocation-rule-builder__add-btn, .cinder-invocation-rule-builder__actions + .cinder-invocation-rule-builder__add-btn {
-    margin-block-start: var(--cinder-space-2);
-  }
-
-  .cinder-invocation-rule-builder__add-btn:focus-visible {
-    outline: var(--cinder-ring-width) solid transparent;
-    box-shadow: var(--_cinder-focus-ring-shadow);
-  }
-
-  @media (forced-colors: active) {
-    .cinder-invocation-rule-builder__add-btn:focus-visible {
-      outline: var(--cinder-ring-width) solid ButtonText;
-    }
-  }
-
-  @media (hover: hover) {
-    .cinder-invocation-rule-builder__add-btn:hover {
-      background: var(--cinder-surface-hover);
-      color: var(--cinder-text);
-      border-color: var(--cinder-border);
-    }
-  }
-
-  .cinder-invocation-rule-builder__add-rule-btn {
-    align-self:  flex-start;
-  }
-
-  .cinder-invocation-rule-builder__summary {
-    display: flex;
-    gap: var(--cinder-space-1);
-    flex-direction: column;
-  }
-
-  .cinder-invocation-rule-builder__summary-row {
-    font-size: var(--cinder-text-sm);
-    color: var(--cinder-text);
-  }
-
-  .cinder-invocation-rule-builder__empty {
-    font-size: var(--cinder-text-sm);
-    color: var(--cinder-text-muted);
-    font-style: italic;
-  }
-
-  .cinder-invocation-rule-builder__announcer {
-    position: absolute;
-    overflow: hidden;
-    clip: rect(0 0 0 0);
-    white-space: nowrap;
-    block-size: 1px;
-    inline-size: 1px;
-  }
-}