@newlogic-digital/ui 3.3.0 → 3.5.0

package/src/styles/Libraries/NativeSlider.css

@@ -1,60 +0,0 @@
-[data-lib-ns] {
-  overflow-x: auto;
-  overflow-y: hidden;
-  -webkit-overflow-scrolling: touch;
-  user-select: none;
-  scrollbar-width: none !important;
-  -ms-overflow-style: none;
-
-  & > * {
-    flex: 0 0 auto;
-    scroll-snap-align: start;
-
-    @nest .is-fade& {
-      opacity: 0;
-      transition: var(--transition-opacity);
-
-      &[data-state="active"] {
-        opacity: 1;
-      }
-    }
-  }
-
-  &::-webkit-scrollbar {
-    display: none !important;
-  }
-
-  &:not(.is-fade, .is-grabbing) {
-    scroll-behavior: smooth;
-    scroll-snap-type: x mandatory;
-  }
-
-  &.is-grabbing {
-    &, & * {
-      cursor: grabbing;
-    }
-
-    & a {
-      pointer-events: none;
-    }
-  }
-}
-
-[data-lib-ns-nav-item] {
-  width: 0.75rem;
-  height: 0.75rem;
-  border: 0.125rem solid rgb(var(--color-current));
-  border-radius: 50%;
-  cursor: pointer;
-  position: relative;
-
-  &::after {
-    position: absolute;
-    inset: -0.5rem;
-    content: "";
-  }
-
-  &[data-state*="active"] {
-    background-color: rgb(var(--color-current));
-  }
-}

package/src/styles/Libraries/Tabs.css

@@ -1,19 +0,0 @@
-[data-controller="lib-tabs"] {
-  & [data-lib-tabs-nav] {
-    & [data-lib-tabs-item][data-state="active"] {
-      cursor: default;
-    }
-  }
-
-  & [data-lib-tabs-area] {
-    & > [data-lib-tabs-item] {
-      animation: 0.3s ease 0s backwards 1 fade-out;
-      display: none;
-
-      &:--state-active {
-        animation: 0.3s ease 0s backwards 1 fade-in;
-        display: block;
-      }
-    }
-  }
-}

package/src/styles/Ui/Checkbox.css

@@ -1,151 +0,0 @@
-.ui-checkbox, .ui-radio {
-  --ui-checkbox-width: 1.25rem;
-  --ui-checkbox-size: 0.875rem;
-  --ui-checkbox-bg-opacity: 0.1;
-  --ui-checkbox-bg-raw: var(--color-background);
-  --ui-checkbox-border-opacity: 0.3;
-  --ui-checkbox-border-color-raw: var(--color-current);
-  --ui-checkbox-checked-bg: rgb(var(--ui-checkbox-checked-bg-raw));
-  --ui-checkbox-checked-bg-raw: var(--color-accent);
-  --ui-checkbox-checked-fg: rgb(var(--color-light));
-  --ui-checkbox-color: currentColor;
-  --ui-checkbox-radius: 0.375rem;
-  --ui-checkbox-icon: var(--icon-check);
-  --ui-checkbox-icon-size: 1.125rem;
-  --ui-checkbox-validity-size: 0.875rem;
-  --ui-checkbox-validity-offset: 0.375rem;
-
-  transition: var(--transition-color);
-  display: inline-flex;
-  flex-wrap: wrap;
-  align-self: flex-start;
-  position: relative;
-  user-select: none;
-  font-size: var(--ui-checkbox-size);
-  z-index: 1;
-  color: var(--ui-checkbox-color);
-
-  &[disabled] {
-    pointer-events: none;
-    opacity: 0.5;
-  }
-
-  @nest .text-light & {
-    --ui-checkbox-border-color-raw: var(--color-light);
-  }
-
-  &:--theme-light {
-    --ui-checkbox-checked-fg: rgb(var(--color-light));
-  }
-
-  &:--theme-dark {
-    --ui-checkbox-checked-fg: rgb(var(--color-dark));
-  }
-
-  &:--state-invalid {
-    --ui-checkbox-border-color-raw: var(--color-error);
-    --ui-checkbox-color: rgb(var(--color-error));
-  }
-
-  & em {
-    display: block;
-    width: 100%;
-    font-size: var(--ui-checkbox-validity-size);
-    color: rgb(var(--color-error));
-    font-style: normal;
-    margin-top: var(--ui-checkbox-validity-offset);
-  }
-
-  & input {
-    position: relative;
-    display: inline-flex;
-    appearance: none;
-    height: var(--ui-checkbox-width);
-    width: var(--ui-checkbox-width);
-    background-color: rgb(var(--ui-checkbox-bg-raw) / var(--ui-checkbox-bg-opacity));
-    border: 1px solid rgb(var(--ui-checkbox-border-color-raw) / var(--ui-checkbox-border-opacity));
-    border-radius: var(--ui-checkbox-radius);
-    cursor: pointer;
-    outline: none;
-    justify-content: center;
-    align-items: center;
-    transition: var(--transition-border), var(--transition-background), var(--transition-shadow);
-
-    &::before {
-      line-height: var(--ui-checkbox-icon-size);
-      font-size: var(--ui-checkbox-icon-size);
-      text-indent: 0;
-      display: block;
-      transition: var(--transition-color), var(--transition-opacity), var(--transition-transform);
-      color: var(--ui-checkbox-checked-fg);
-      content: "";
-      background-color: currentColor;
-      mask: var(--ui-checkbox-icon);
-      opacity: 0;
-      transform: scale(0);
-      will-change: transform;
-      width: 1em;
-      height: 1em;
-    }
-
-    &:not(:only-child) {
-      margin-right: 0.75rem;
-
-      @nest .flex-row-reverse& {
-        margin-right: 0;
-        margin-left: 0.75rem;
-      }
-    }
-
-    &:is(:hover, :focus-visible) {
-      --ui-checkbox-bg-raw: var(--ui-checkbox-checked-bg-raw);
-      --ui-checkbox-border-color-raw: var(--ui-checkbox-checked-bg-raw);
-      --ui-checkbox-border-opacity: 0.75;
-      --ui-checkbox-bg-opacity: 0.1;
-    }
-
-    &:checked {
-      --ui-checkbox-border-opacity: 0;
-
-      background-color: var(--ui-checkbox-checked-bg);
-
-      &:focus {
-        box-shadow:
-          0 0 0 0 rgb(var(--color-current)),
-          0 0 0 3px rgb(var(--ui-checkbox-checked-bg-raw) / 0.15),
-          0 1px 2px 0 rgb(var(--color-current) / 0.05);
-
-        @nest .dark & {
-          box-shadow:
-            0 0 0 0 rgb(var(--color-current)),
-            0 0 0 3px rgb(var(--ui-checkbox-checked-bg-raw) / 0.3),
-            0 1px 2px 0 rgb(var(--color-current) / 0.05);
-        }
-      }
-
-      &::before {
-        opacity: 1;
-        transform: scale(1);
-      }
-    }
-
-    &[required] {
-      & + * {
-        &::after {
-          color: rgb(var(--color-error));
-          content: " *";
-        }
-      }
-    }
-  }
-
-  & a {
-    text-decoration: underline;
-    transition: var(--transition-opacity);
-    color: rgb(var(--color-accent));
-
-    @nest .no-touch &[href]:is(:hover, :focus-visible) {
-      opacity: 0.8;
-    }
-  }
-}

package/src/styles/Ui/Icon.css

@@ -1,33 +0,0 @@
-.ui-icon {
-  --ui-icon-hover-opacity: 0.7;
-  --ui-icon-size: 1.25rem;
-
-  display: inline-flex;
-  position: relative;
-  font-size: var(--ui-icon-size);
-
-  &, & svg {
-    width: 1em;
-    height: 1em;
-  }
-
-  & > * {
-    transition: var(--transition-opacity);
-
-    @nest .no-touch :is([href], button):is(:hover, :focus-visible)& {
-      opacity: var(--ui-icon-hover-opacity);
-    }
-  }
-}
-
-.ui-icon-text {
-  --ui-icon-hover-opacity: 0.7;
-
-  display: inline-flex;
-  align-items: center;
-  transition: var(--transition-opacity), var(--transition-color);
-
-  @nest .no-touch &:is([href], button):is(:hover, :focus-visible) {
-    opacity: var(--ui-icon-hover-opacity);
-  }
-}