elbe-ui 0.2.34 → 0.2.41

package/README.md

@@ -28,3 +28,9 @@ so far, it has been optimized for React. It provides a variety of Widgets and th
 # contribute
 
 as of now, this is mainly a personal project for different stuff I built. So things might be a little rough around the edges. If you find any issues or want to help make elbe better, I'd love to hear from you :)
+
+## publish
+
+1. increment `version` number in `package.json`
+2. run `bun run build`
+3. run `npm publish`

package/dist/bit/bit.d.ts

@@ -4,7 +4,10 @@ export interface BitUseInterface<C, T> {
     signal: Signal<BitState<T>>;
     ctrl: C;
     map: <D>(m: TriMap<T, D>) => D | preact.JSX.Element;
-    onData: (f: (d: T) => any) => any;
+    onData: <D>(f: (d: T) => any, { onLoading, onError, }?: {
+        onLoading?: () => any;
+        onError?: (e: string) => any;
+    }) => any;
 }
 interface BitData<C, T> {
     ctrl: C;

package/dist/bit/bit.js

@@ -8,6 +8,7 @@ const signals_1 = require("@preact/signals");
 const preact_1 = require("preact");
 const hooks_1 = require("preact/hooks");
 const error_view_1 = require("../ui/components/error_view");
+const flex_1 = require("../ui/components/layout/flex");
 const spinner_1 = require("../ui/components/spinner");
 function makeBit(name) {
     const c = (0, preact_1.createContext)(null);
@@ -48,7 +49,8 @@ function useBit(context) {
         const v = state.value;
         function map(m) {
             if (v.loading)
-                return (m.onLoading || (() => (0, jsx_runtime_1.jsx)(spinner_1.Spinner, {})))();
+                return (m.onLoading ||
+                    (() => ((0, jsx_runtime_1.jsx)(flex_1.Column, { cross: "center", children: (0, jsx_runtime_1.jsx)(spinner_1.Spinner, {}) }))))();
             if (v.error)
                 return (m.onError ||
                     ((e) => (0, jsx_runtime_1.jsx)(error_view_1.ErrorView, { error: e, retry: ctrl.reload ?? null })))(v.error);
@@ -64,7 +66,7 @@ function useBit(context) {
              * @param f the builder function
              * @returns the built component
              */
-            onData: (f) => map({ onData: f }),
+            onData: (f, { onLoading, onError, } = {}) => map({ onData: f, onLoading: onLoading, onError: onError }),
         };
     }
     catch (e) {
@@ -78,6 +80,3 @@ function useBit(context) {
         };
     }
 }
-function BitSpinner({ name }) {
-    return (0, jsx_runtime_1.jsx)(spinner_1.Spinner, {});
-}

package/dist/elbe.css

@@ -3,183 +3,200 @@
 - sass style/elbe.scss dist/elbe.css
 */
 @import url("https://fonts.googleapis.com/css2?display=swap&family=Space+Mono:ital,wght@0,400;0,700;1,400;1,700&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Calistoga&family=Noto+Color+Emoji");
-/* ========= SPACING ========= */
-.padded,
-.card,
-button,
-.toast,
-select,
-input[type=text],
-input[type=number],
-input[type=password],
-input[type=email],
-input[type=date],
-input[type=time],
-textarea {
-  padding: var(--g-padding);
+:root {
+  --g-size: 1rem;
+  --g-radius: 0.75rem;
+  --g-padding: 1rem;
+  --g-border-width: 0.125rem;
+  --c-context-back: #ffffff;
+  --c-context-front: #000;
+  --c-context-border: #000;
+  line-height: 1.3;
+  color: #222;
+  background-color: #ffffff;
+  font-synthesis: none;
+  text-rendering: optimizeLegibility;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-text-size-adjust: 100%;
+  box-sizing: border-box;
+  font-size: 1rem;
+  border-collapse: separate;
+  font-family: "Inter", sans-serif;
 }
 
-.padding-none {
-  padding: 0rem;
+*,
+*:before,
+*:after {
+  box-sizing: inherit;
+  font-size: inherit;
+  font-family: inherit;
+  font-weight: inherit;
+  border-color: inherit;
 }
 
-.margined {
-  margin: var(--g-padding);
+body,
+#app {
+  margin: 0;
+  display: block;
+  min-height: 100vh;
+  background-color: white;
 }
 
-.margined-none {
+.elbe {
+  /* ========= SPACING ========= */
+  /* ========= ELEMENT_STYLE ========= */
+  /* ========= CARD ========= */
+  /* ========= UTIL ========= */
+  /* ========= MARKUP ========= */
+  /* ========= ANIMATIONS ========= */
+  /* ========== GAP =========== */
+  /* ========== EXPAND =========== */
+  /* ========== ALIGN =========== */
+  /* ========== JUSTIFY =========== */
+  /* ========== RESPONSIVE =========== */
+}
+.elbe .padded,
+.elbe .card,
+.elbe .toast,
+.elbe input[type=text],
+.elbe input[type=number],
+.elbe input[type=password],
+.elbe input[type=email],
+.elbe input[type=date],
+.elbe input[type=time],
+.elbe textarea,
+.elbe select,
+.elbe button {
+  padding: var(--g-padding);
+}
+.elbe .padding-none {
+  padding: 0rem;
+}
+.elbe .margined {
+  margin: var(--g-padding);
+}
+.elbe .margined-none {
   margin: 0rem;
 }
-
-/* ========= ELEMENT_STYLE ========= */
-.sharp {
+.elbe .sharp {
   border-radius: 0;
 }
-
-.rounded,
-.card,
-button,
-.toast,
-select,
-input[type=text],
-input[type=number],
-input[type=password],
-input[type=email],
-input[type=date],
-input[type=time],
-textarea {
+.elbe .rounded,
+.elbe .card,
+.elbe .toast,
+.elbe input[type=text],
+.elbe input[type=number],
+.elbe input[type=password],
+.elbe input[type=email],
+.elbe input[type=date],
+.elbe input[type=time],
+.elbe textarea,
+.elbe select,
+.elbe button {
   border-radius: var(--g-radius);
   border-color: inherit;
   overflow: hidden;
 }
-
-.round {
+.elbe .round {
   border-radius: 50%;
 }
-
-img.round,
-img.rounded {
+.elbe img.round,
+.elbe img.rounded {
   object-fit: cover;
 }
-
-.borderless {
+.elbe .borderless {
   border: none;
 }
-
-.raised, .toast {
+.elbe .raised, .elbe .toast {
   box-shadow: 0 0.1rem 1rem rgba(0, 0, 0, 0.2);
 }
-
-.scrollbars-none {
+.elbe .scrollbars-none {
   scrollbar-width: none;
   -ms-overflow-style: none;
 }
-.scrollbars-none::-webkit-scrollbar {
+.elbe .scrollbars-none::-webkit-scrollbar {
   display: none;
 }
-
-.pointer {
+.elbe .pointer {
   cursor: pointer;
 }
-
-.text-centered {
+.elbe .text-centered {
   text-align: center;
 }
-
-.text-start {
+.elbe .text-start {
   text-align: start;
 }
-
-.text-end {
+.elbe .text-end {
   text-align: end;
 }
-
-body:has(dialog[open=""]) {
+.elbe body:has(dialog[open=""]) {
   overflow: hidden;
 }
-
-.transparent {
+.elbe .transparent {
   background-color: transparent;
 }
-
-.disabled {
+.elbe .disabled {
   cursor: not-allowed;
 }
-
-/* ========= CARD ========= */
-.box, .header, .base-limited,
-.card,
-button,
-.toast,
-select,
-input[type=text],
-input[type=number],
-input[type=password],
-input[type=email],
-input[type=date],
-input[type=time],
-textarea {
+.elbe .box, .elbe .header, .elbe .base-limited,
+.elbe .card,
+.elbe .toast,
+.elbe input[type=text],
+.elbe input[type=number],
+.elbe input[type=password],
+.elbe input[type=email],
+.elbe input[type=date],
+.elbe input[type=time],
+.elbe textarea,
+.elbe select,
+.elbe button {
   border-style: solid;
   border-width: var(--g-border-width);
 }
-
-/* ========= UTIL ========= */
-.action {
+.elbe .action {
   cursor: pointer;
 }
-
-.base-limited {
+.elbe .base-limited {
   max-width: 700px;
   width: 100%;
   margin: 0 auto;
 }
-
-/* ========= MARKUP ========= */
-i,
-.i {
+.elbe i,
+.elbe .i {
   font-style: italic;
 }
-
-b,
-.b,
-button,
-.toast {
+.elbe b,
+.elbe .b,
+.elbe .toast,
+.elbe button {
   font-weight: bold;
 }
-
-.u {
+.elbe .u {
   text-decoration: underline;
 }
-
-.ni {
+.elbe .ni {
   font-style: normal;
 }
-
-.nb {
+.elbe .nb {
   font-weight: normal;
 }
-
-.nu {
+.elbe .nu {
   text-decoration: none;
 }
-
-.striked {
+.elbe .striked {
   text-decoration: line-through;
 }
-
-.code {
+.elbe .code {
   font-family: monospace;
   white-space: pre-wrap;
 }
-
-/* ========= ANIMATIONS ========= */
-.rotate {
+.elbe .rotate {
   display: flex;
   align-items: center;
   justify-content: center;
   animation: rotation 1.5s infinite linear;
 }
-
 @keyframes rotation {
   from {
     transform: rotate(0deg);
@@ -188,195 +205,152 @@ button,
     transform: rotate(359deg);
   }
 }
-.column, dialog,
-.row,
-button,
-.header,
-.row-resp {
+.elbe .column, .elbe dialog,
+.elbe .row,
+.elbe .header,
+.elbe button,
+.elbe .row-resp {
   display: flex;
   justify-content: start;
   align-items: stretch;
   gap: 1rem;
 }
-
-.column, dialog {
+.elbe .column, .elbe dialog {
   flex-direction: column;
 }
-
-.row, button, .header {
+.elbe .row, .elbe .header, .elbe button {
   flex-direction: row;
   align-items: center;
 }
-
-.centered {
+.elbe .centered {
   display: flex;
   align-items: center;
   justify-content: center;
 }
-
-/* ========== GAP =========== */
-.gap-none {
+.elbe .gap-none {
   gap: 0;
 }
-
-.gap-quarter {
+.elbe .gap-quarter {
   gap: 0.25rem;
 }
-
-.gap-half {
+.elbe .gap-half {
   gap: 0.5rem;
 }
-
-.gap-one {
+.elbe .gap-one {
   gap: 1rem;
 }
-
-.gap-double {
+.elbe .gap-double {
   gap: 2rem;
 }
-
-.gap-triple {
+.elbe .gap-triple {
   gap: 3rem;
 }
-
-/* ========== EXPAND =========== */
-.flex-none {
+.elbe .flex-none {
   flex: 0 0 auto;
 }
-
-.flex-1 {
+.elbe .flex-1 {
   flex: 1 1 0%;
 }
-
-.flex-2 {
+.elbe .flex-2 {
   flex: 2 2 0%;
 }
-
-.flex-3 {
+.elbe .flex-3 {
   flex: 3 3 0%;
 }
-
-.flex-4 {
+.elbe .flex-4 {
   flex: 4 4 0%;
 }
-
-.flex-5 {
+.elbe .flex-5 {
   flex: 5 5 0%;
 }
-
-.flex-6 {
+.elbe .flex-6 {
   flex: 6 6 0%;
 }
-
-.flex-7 {
+.elbe .flex-7 {
   flex: 7 7 0%;
 }
-
-.flex-8 {
+.elbe .flex-8 {
   flex: 8 8 0%;
 }
-
-.flex-9 {
+.elbe .flex-9 {
   flex: 9 9 0%;
 }
-
-.flex-10 {
+.elbe .flex-10 {
   flex: 10 10 0%;
 }
-
-.flex-11 {
+.elbe .flex-11 {
   flex: 11 11 0%;
 }
-
-.flex-12 {
+.elbe .flex-12 {
   flex: 12 12 0%;
 }
-
-/* ========== ALIGN =========== */
-.cross-start {
+.elbe .cross-start {
   align-items: flex-start;
 }
-
-.cross-center, dialog {
+.elbe .cross-center, .elbe dialog {
   align-items: center;
 }
-
-.cross-end {
+.elbe .cross-end {
   align-items: flex-end;
 }
-
-.cross-stretch {
+.elbe .cross-stretch {
   align-items: stretch;
 }
-
-.cross-baseline {
+.elbe .cross-baseline {
   align-items: baseline;
 }
-
-/* ========== JUSTIFY =========== */
-.main-start {
+.elbe .main-start {
   justify-content: flex-start;
 }
-
-.main-center, dialog {
+.elbe .main-center, .elbe dialog {
   justify-content: center;
 }
-
-.main-end {
+.elbe .main-end {
   justify-content: flex-end;
 }
-
-.main-between {
+.elbe .main-between {
   justify-content: space-between;
 }
-
-.main-around {
+.elbe .main-around {
   justify-content: space-around;
 }
-
-.main-evenly {
+.elbe .main-evenly {
   justify-content: space-evenly;
 }
-
-/* ========== RESPONSIVE =========== */
 @media (max-width: 700px) {
-  .row-resp {
+  .elbe .row-resp {
     flex-direction: column;
   }
-  .if-wide {
+  .elbe .if-wide {
     display: none;
   }
 }
 @media (min-width: 700px) {
-  .if-narrow {
+  .elbe .if-narrow {
     display: none;
   }
 }
-.wrap {
+.elbe .wrap {
   flex-wrap: wrap;
 }
-
-.c_from_context, input[type=text],
-input[type=number],
-input[type=password],
-input[type=email],
-input[type=date],
-input[type=time],
-textarea, select {
+.elbe .c_from_context, .elbe input[type=text],
+.elbe input[type=number],
+.elbe input[type=password],
+.elbe input[type=email],
+.elbe input[type=date],
+.elbe input[type=time],
+.elbe textarea, .elbe select {
   background-color: var(--c-context-back);
   color: var(--c-context-front);
   border: var(--g-border-width) solid var(--c-context-border);
 }
-
-.borderless {
+.elbe .borderless {
   border: none;
 }
-
-.bordered {
+.elbe .bordered {
   border: var(--g-border-width) solid var(--c-context-border);
 }
-
-button {
+.elbe button {
   justify-content: center;
   padding: 0.25rem 0.75rem;
   gap: 0.5rem;
@@ -400,34 +374,21 @@ button {
     }
   }*/
 }
-button:not(.dummy_class_001) {
+.elbe button:not(.dummy_class_001) {
   border: none;
 }
-
-.icon {
+.elbe .icon {
   aspect-ratio: 1;
   border-radius: 25%;
   object-fit: cover;
 }
-
-.toast {
-  position: fixed;
-  bottom: 1rem;
-  right: 1rem;
-  z-index: 200;
-  left: 50%;
-  width: min(40rem, 90%);
-  transform: translateX(-50%);
-}
-
-select {
+.elbe select {
   padding: 0 0.75rem;
   height: 3rem;
   min-width: 12rem;
   width: 100%;
 }
-
-dialog {
+.elbe dialog {
   z-index: 100;
   position: fixed;
   top: 0;
@@ -440,30 +401,27 @@ dialog {
   transition: background-color 0.3s ease-in-out;
   transition: backdrop-filter 0.3s ease-in-out;
 }
-dialog > * {
+.elbe dialog > * {
   display: none;
 }
-dialog[open=""] {
+.elbe dialog[open=""] {
   background-color: rgba(0, 0, 0, 0.2);
   backdrop-filter: blur(5px);
   pointer-events: all;
 }
-dialog[open=""] > * {
+.elbe dialog[open=""] > * {
   display: unset;
 }
-
-.expandable {
+.elbe .expandable {
   max-height: 0px;
   transition: max-height 0.25s ease-out;
   overflow: hidden;
 }
-
-.expandable:has(*) {
+.elbe .expandable:has(*) {
   max-height: 500px;
   transition: max-height 0.25s ease-in;
 }
-
-.header {
+.elbe .header {
   width: 100%;
   position: fixed;
   left: 0;
@@ -484,46 +442,43 @@ dialog[open=""] > * {
   justify-content: space-between;
   align-items: center;
 }
-
-input[type=text],
-input[type=number],
-input[type=password],
-input[type=email],
-input[type=date],
-input[type=time],
-textarea {
+.elbe input[type=text],
+.elbe input[type=number],
+.elbe input[type=password],
+.elbe input[type=email],
+.elbe input[type=date],
+.elbe input[type=time],
+.elbe textarea {
   padding: 0 0.75rem;
   height: 3rem;
   min-width: 12rem;
   width: 100%;
 }
-
-textarea {
+.elbe textarea {
   height: 6rem;
   padding: 0.6rem 0.75rem;
   resize: vertical;
   min-height: 3rem;
 }
-
-input[type=range] {
+.elbe input[type=range] {
   -webkit-appearance: none;
   appearance: none;
   background: transparent;
   cursor: pointer;
   width: 15rem;
 }
-input[type=range]::-moz-range-track {
+.elbe input[type=range]::-moz-range-track {
   background-color: var(--c-context-border);
   border-radius: 100px;
   border: none;
   height: 0.5rem;
 }
-input[type=range]::-webkit-slider-runnable-track {
+.elbe input[type=range]::-webkit-slider-runnable-track {
   border-radius: 100px;
   border: none;
   height: 0.5rem;
 }
-input[type=range]::-webkit-slider-thumb {
+.elbe input[type=range]::-webkit-slider-thumb {
   border: none;
   -webkit-appearance: none;
   appearance: none;
@@ -532,8 +487,7 @@ input[type=range]::-webkit-slider-thumb {
   height: 1.2rem;
   width: 1.2rem;
 }
-
-input[type=checkbox] {
+.elbe input[type=checkbox] {
   -webkit-appearance: none;
   appearance: none;
   margin: 0;
@@ -548,8 +502,7 @@ input[type=checkbox] {
   place-content: center;
   outline: none;
 }
-
-input[type=checkbox]::before {
+.elbe input[type=checkbox]::before {
   content: "";
   width: 0.95rem;
   height: 0.75rem;
@@ -558,64 +511,31 @@ input[type=checkbox]::before {
   transform-origin: center;
   transition: 0.2s all ease-in-out;
 }
-
-input[type=checkbox]:checked {
+.elbe input[type=checkbox]:checked {
   border-color: var(--c-accent);
   background: color-mix(in srgb, var(--c-accent) 20%, transparent);
 }
-input[type=checkbox]:checked::before {
+.elbe input[type=checkbox]:checked::before {
   transform: scale(1);
   background-color: var(--c-accent);
 }
-
-input[type=checkbox]:focus {
+.elbe input[type=checkbox]:focus {
   outline: max(2px, 0.15em) solid var(--c-accent);
   outline-offset: 0;
 }
-
-input[type=checkbox]:not(:checked):disabled {
+.elbe input[type=checkbox]:not(:checked):disabled {
   cursor: not-allowed;
   border: 0.16em solid var(--c-context-border);
 }
 
-:root {
-  --g-size: 1rem;
-  --g-radius: 0.75rem;
-  --g-padding: 1rem;
-  --g-border-width: 0.125rem;
-  --c-context-back: #ffffff;
-  --c-context-front: #000;
-  --c-context-border: #000;
-  line-height: 1.3;
-  color: #222;
-  background-color: #ffffff;
-  font-synthesis: none;
-  text-rendering: optimizeLegibility;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  -webkit-text-size-adjust: 100%;
-  box-sizing: border-box;
-  font-size: 1rem;
-  border-collapse: separate;
-  font-family: "Inter", sans-serif;
-}
-
-*,
-*:before,
-*:after {
-  box-sizing: inherit;
-  font-size: inherit;
-  font-family: inherit;
-  font-weight: inherit;
-  border-color: inherit;
-}
-
-body,
-#app {
-  margin: 0;
-  display: block;
-  min-height: 100vh;
-  background-color: white;
+.toast {
+  position: fixed;
+  bottom: 1rem;
+  right: 1rem;
+  z-index: 200;
+  left: 50%;
+  width: min(40rem, 90%);
+  transform: translateX(-50%);
 }
 
 /*# sourceMappingURL=elbe.css.map */

package/dist/elbe.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../style/elbe.scss","../style/_base.scss","../style/_flex.scss","../style/_components.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;AAAA;AAOQ;ACPR;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAEE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAIF;AAEA;EACE;;;AAEF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAEE;EACA;EACA;;;AAEF;EACE;;;AAGF;AAAA;EAEE;;;AAGF;EACE;;;AAEF;EACE;;;AAGF;EACE;EACA;;AACA;EACE;;;AAIJ;EACE;;;AAGF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAEE;EACA;;;AAKF;AAEA;EACE;;;AAGF;EAEE;EACA;EACA;;;AAGF;AAEA;AAAA;EAEE;;;AAEF;AAAA;AAAA;AAAA;EAEE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;EACA;;;AAGF;AAEA;EACE;EACA;EACA;EACA;;;AAGF;EACE;IACE;;EAEF;IACE;;;ACpJJ;AAAA;AAAA;AAAA;AAAA;EAGE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;AAEA;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAGF;AAEA;EACE;;;AAIA;EACE;;;AADF;EACE;;;AADF;EACE;;;AADF;EACE;;;AADF;EACE;;;AADF;EACE;;;AADF;EACE;;;AADF;EACE;;;AADF;EACE;;;AADF;EACE;;;AADF;EACE;;;AADF;EACE;;;AAIJ;AAEA;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAGF;AAEA;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAGF;AAEA;EACE;IACE;;EAEF;IACE;;;AAIJ;EACE;IACE;;;AAIJ;EACE;;;AC/GF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACE;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAIF;EAIE;EACA;EACA;EACA;EACA;EACA;EACA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAJA;EACE;;;AAoBJ;EACE;EACA;EACA;;;AAGF;EAIE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EAGE;EACA;EACA;EACA;;;AAGF;EAKE;EAEA;EACA;EACA;EACA;EACA;EAEA;EAEA;EAEA;EAEA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;;AACA;EACE;;;AAKN;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EAGC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACC;EAGD;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;;;AAKD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAWE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAGF;EAEE;EACA;EACA;;AAGF;EAGE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAOJ;EACE;EACA;EACA;EAEA;EACA;EAEA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EAEA;EACA;EACA;;;AAIF;EACE;EACA;;AACA;EACE;EACA;;;AAMJ;EACE;EACA;;;AAGF;EACE;EACA;;;AH5PF;EACE;EACA;EACA;EACA;EAEA;EACA;EACA;EAGA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;;;AAGF;AAAA;AAAA;EAGE;EACA;EACA;EACA;EACA;;;AAGF;AAAA;EAEE;EACA;EACA;EACA","file":"elbe.css"}
+{"version":3,"sourceRoot":"","sources":["../style/elbe.scss","../style/_base.scss","../style/_flex.scss","../style/_components.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;AAAA;AAOQ;AAMR;EACE;EACA;EACA;EACA;EAEA;EACA;EACA;EAGA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;;;AAGF;AAAA;AAAA;EAGE;EACA;EACA;EACA;EACA;;;AAGF;AAAA;EAEE;EACA;EACA;EACA;;;AAIF;AC3DA;AAoBA;AA6DA;AAUA;AAaA;AA8BA;AC9GA;AAqBA;AAYA;AAkBA;AAqBA;;AD9FA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAEE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAMF;EACE;;AAEF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAEE;EACA;EACA;;AAEF;EACE;;AAGF;AAAA;EAEE;;AAGF;EACE;;AAEF;EACE;;AAGF;EACE;EACA;;AACA;EACE;;AAIJ;EACE;;AAGF;EACE;;AAEF;EACE;;AAEF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAKF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAEE;EACA;;AAOF;EACE;;AAGF;EAEE;EACA;EACA;;AAKF;AAAA;EAEE;;AAEF;AAAA;AAAA;AAAA;EAEE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;EACA;;AAKF;EACE;EACA;EACA;EACA;;AAGF;EACE;IACE;;EAEF;IACE;;;ACpJJ;AAAA;AAAA;AAAA;AAAA;EAGE;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;EACA;;AAKF;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;AAKF;EACE;;AAIA;EACE;;AADF;EACE;;AADF;EACE;;AADF;EACE;;AADF;EACE;;AADF;EACE;;AADF;EACE;;AADF;EACE;;AADF;EACE;;AADF;EACE;;AADF;EACE;;AADF;EACE;;AAMJ;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;AAKF;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;AAKF;EACE;IACE;;EAEF;IACE;;;AAIJ;EACE;IACE;;;AAIJ;EACE;;AClHF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACE;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAIF;EAIE;EACA;EACA;EACA;EACA;EACA;EACA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAJA;EACE;;AAoBJ;EACE;EACA;EACA;;AAGF;EAGE;EACA;EACA;EACA;;AAGF;EAKE;EAEA;EACA;EACA;EACA;EACA;EAEA;EAEA;EAEA;EAEA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;;AACA;EACE;;AAKN;EACE;EACA;EACA;;AAGF;EACE;EACA;;AAGF;EAGC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACC;EAGD;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;;AAKD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAWE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAGF;EAEE;EACA;EACA;;AAGF;EAGE;EACA;EACA;EACA;EACA;EACA;EACA;;AAOJ;EACE;EACA;EACA;EAEA;EACA;EAEA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EAEA;EACA;EACA;;AAIF;EACE;EACA;;AACA;EACE;EACA;;AAMJ;EACE;EACA;;AAGF;EACE;EACA;;;AHxLF;EAIE;EACA;EACA;EACA;EACA;EACA;EACA","file":"elbe.css"}

package/dist/ui/theme/colors.d.ts

@@ -42,7 +42,7 @@ export type ColorThemeSeed = ColorSeedColors & {
         flat: SeedFlatSelector;
     };
 };
-declare class RGBAColor {
+export declare class RGBAColor {
     r: number;
     g: number;
     b: number;
@@ -52,7 +52,7 @@ declare class RGBAColor {
     get isDark(): boolean;
     get luminance(): number;
     get hex(): string;
-    static _fromHex(hex: string | null): RGBAColor;
+    static fromHex(hex: string | null): RGBAColor;
     desaturated(f?: number): RGBAColor;
     withAlpha(a: number): RGBAColor;
     inter(other: RGBAColor, factor: number): RGBAColor;
@@ -139,4 +139,3 @@ export declare class ColorTheme {
     asCss(): string;
     static generate(seed?: Partial<ColorThemeSeed>): ColorTheme;
 }
-export {};

package/dist/ui/theme/colors.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ColorTheme = exports.ModeColor = exports.SchemeColor = exports.KindColor = exports.MannerColor = exports.StateColor = exports.LayerColor = exports.colors = exports.cLayers = exports.cStates = exports.cManners = exports.cKinds = exports.cSchemes = exports.cModes = void 0;
+exports.ColorTheme = exports.ModeColor = exports.SchemeColor = exports.KindColor = exports.MannerColor = exports.StateColor = exports.LayerColor = exports.colors = exports.RGBAColor = exports.cLayers = exports.cStates = exports.cManners = exports.cKinds = exports.cSchemes = exports.cModes = void 0;
 const colors_convert_1 = require("colors-convert");
 const util_1 = require("../util/util");
 const color_theme_1 = require("./color_theme");
@@ -48,7 +48,7 @@ class RGBAColor {
             .padStart(2, "0");
         return `#${c.join("")}${a}`;
     }
-    static _fromHex(hex) {
+    static fromHex(hex) {
         if (!hex)
             return new RGBAColor(0, 0, 0, 0);
         const c = hex.replace("#", "").padEnd(6, "0").padEnd(8, "f").toLowerCase();
@@ -88,6 +88,7 @@ class RGBAColor {
         return (Math.max(l1, l2) + 0.05) / (Math.min(l1, l2) + 0.05);
     }
 }
+exports.RGBAColor = RGBAColor;
 exports.colors = {
     transparent: new RGBAColor(0, 0, 0, 0),
     white: new RGBAColor(255, 255, 255, 1),
@@ -128,9 +129,9 @@ class LayerColor extends RGBAColor {
     }
     static fromHex(back, front, border) {
         if (front === undefined && border === undefined) {
-            return LayerColor.fromBack(RGBAColor._fromHex(back));
+            return LayerColor.fromBack(RGBAColor.fromHex(back));
         }
-        return new LayerColor(RGBAColor._fromHex(back), RGBAColor._fromHex(front ?? null), RGBAColor._fromHex(border ?? null));
+        return new LayerColor(RGBAColor.fromHex(back), RGBAColor.fromHex(front ?? null), RGBAColor.fromHex(border ?? null));
     }
     static fromBack(back, c) {
         const front = back.isDark ? exports.colors.white : exports.colors.black;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "elbe-ui",
-  "version": "0.2.34",
+  "version": "0.2.41",
   "author": "Robin Naumann",
   "license": "MIT",
   "repository": {
@@ -20,7 +20,7 @@
   "scripts": {
     "build:ts": "tsc",
     "build:dts": "tsc --declaration",
-    "build:css": "sass --quiet-deps style/elbe.scss dist/elbe.css",
+    "build:css": "sass -q style/elbe.scss dist/elbe.css",
     "build": "rm -rf ./dist && bun run build:ts && bun run build:dts && bun run build:css"
   },
   "devDependencies": {