vrembem 4.0.0-next.4 → 4.0.0-next.41

package/LICENSE

@@ -1,6 +1,6 @@
 The MIT License (MIT)
 
-Copyright (c) 2022 Sebastian Nitu
+Copyright (c) 2026 Sebastian Nitu
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

package/README.md

@@ -2,8 +2,6 @@
 
 A complete collection of all Vrembem components into a single comprehensive package for convenience.
 
-[![npm version](https://img.shields.io/npm/v/vrembem.svg)](https://www.npmjs.com/package/vrembem)
-
 [Documentation](https://vrembem.com/packages/vrembem)
 
 ## Installation
@@ -55,20 +53,20 @@ Customize core variables which all components inherit from. The example below wi
 
 ## JavaScript
 
-Import and initialize the components you'll need:
+Import and mount the components you'll need:
 
 ```js
 // Import all under the vb namespace
 import * as vb from 'vrembem';
-const drawer = new vb.Drawer({ autoInit: true });
+const drawer = new vb.Drawer();
+await drawer.mount();
 
 // Or import individual components
 import { Drawer } from 'vrembem';
-const drawer = new Drawer({ autoInit: true });
+const drawer = new Drawer();
+await drawer.mount();
 ```
 
-> Note that `core` modules do not need to be initialized since they're just a set of helpful utility and functional modules.
-
 ## Markup
 
 Include the component's markup into your project. Use the [online documentation](https://vrembem.com) for more information, customization options, code examples and available modifiers.

package/base.scss

@@ -0,0 +1 @@
+@forward "@vrembem/base";

package/components.scss

@@ -0,0 +1,17 @@
+@forward "@vrembem/flex" as flex-*;
+@forward "@vrembem/grid" as grid-*;
+@forward "@vrembem/button" as button-*;
+@forward "@vrembem/checkbox" as checkbox-*;
+@forward "@vrembem/input" as input-*;
+@forward "@vrembem/radio" as radio-*;
+@forward "@vrembem/switch" as switch-*;
+@forward "@vrembem/card" as card-*;
+@forward "@vrembem/dialog" as dialog-*;
+@forward "@vrembem/drawer" as drawer-*;
+@forward "@vrembem/icon" as icon-*;
+@forward "@vrembem/menu" as menu-*;
+@forward "@vrembem/modal" as modal-*;
+@forward "@vrembem/notice" as notice-*;
+@forward "@vrembem/popover" as popover-*;
+@forward "@vrembem/section" as section-*;
+@forward "@vrembem/table" as table-*;

package/dev/base.css

@@ -0,0 +1,261 @@
+@layer base {
+  *,
+  *::before,
+  *::after {
+    box-sizing: border-box;
+    margin: 0;
+    padding: 0;
+  }
+  html,
+  :host {
+    font-family: var(--vb-font-family, system-ui, sans-serif);
+    line-height: var(--vb-line-height, 1.5);
+    text-size-adjust: none;
+  }
+  html {
+    height: 100%;
+  }
+  body {
+    min-height: 100vh;
+  }
+  img,
+  svg,
+  video,
+  canvas,
+  audio,
+  iframe,
+  embed,
+  object {
+    display: block;
+  }
+  img,
+  video,
+  picture {
+    max-width: 100%;
+    height: auto;
+    vertical-align: middle;
+  }
+  button,
+  input,
+  textarea,
+  select {
+    font: inherit;
+    color: inherit;
+  }
+  button {
+    cursor: pointer;
+    border: 0;
+    background: none;
+  }
+  textarea {
+    resize: vertical;
+  }
+  label:has(:disabled) {
+    pointer-events: none;
+  }
+  a {
+    color: inherit;
+    text-decoration: inherit;
+  }
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    font-size: inherit;
+    color: var(--vb-foreground-strong);
+  }
+  b,
+  strong {
+    font-weight: bold;
+  }
+  small {
+    font-size: var(--vb-font-size-sm, 0.875rem);
+  }
+  code,
+  pre {
+    font-family: var(--vb-font-family-mono, ui-monospace, monospace);
+    font-size: 1em;
+  }
+  table {
+    border-collapse: collapse;
+    border-color: inherit;
+  }
+  body {
+    color: var(--vb-base-foreground, var(--vb-foreground));
+    background: var(--vb-base-background, var(--vb-background));
+  }
+  .h1, .type > h1, .h2, .type > h2, .h3, .type > h3, .h4, .type > h4, .h5, .type > h5, .h6, .type > h6 {
+    font-family: var(--vb-headings-font-family, inherit);
+    font-size: var(--vb-headings-font-size, 1em);
+    font-weight: var(--vb-headings-font-weight, var(--vb-font-weight-semi-bold));
+    line-height: var(--vb-headings-line-height, inherit);
+    color: var(--vb-headings-foreground, var(--vb-foreground-strong));
+  }
+  .h1, .type > h1 {
+    --vb-headings-font-size: 2.75em;
+  }
+  .h2, .type > h2 {
+    --vb-headings-font-size: 2em;
+  }
+  .h3, .type > h3 {
+    --vb-headings-font-size: 1.75em;
+  }
+  .h4, .type > h4 {
+    --vb-headings-font-size: 1.5em;
+  }
+  .h5, .type > h5 {
+    --vb-headings-font-size: 1.25em;
+  }
+  .h6, .type > h6 {
+    --vb-headings-font-size: 1em;
+  }
+  .link, .type :not(div) > a {
+    color: var(--vb-link-foreground, var(--vb-foreground-accent));
+    text-decoration: var(--vb-link-decoration, underline);
+    text-decoration-thickness: var(--vb-link-decoration-thickness, 1px);
+    text-underline-offset: var(--vb-link-underline-offset, 2px);
+  }
+  .link code, .type :not(div) > a code {
+    color: var(--vb-link-foreground, var(--vb-foreground-accent));
+    background-color: var(--vb-background-alt);
+  }
+  .link:hover, .link:focus, .type :not(div) > a:hover, .type :not(div) > a:focus {
+    color: var(--vb-link-foreground-hover, light-dark(oklch(from var(--vb-foreground-accent) calc(l - 0.1) c h), oklch(from var(--vb-foreground-accent) calc(l + 0.1) c h)));
+    text-decoration: var(--vb-link-decoration-hover, none);
+  }
+  .link:hover code, .link:focus code, .type :not(div) > a:hover code, .type :not(div) > a:focus code {
+    color: var(--vb-link-foreground-hover, light-dark(oklch(from var(--vb-foreground-accent) calc(l - 0.1) c h), oklch(from var(--vb-foreground-accent) calc(l + 0.1) c h)));
+  }
+  .link:focus, .type :not(div) > a:focus {
+    outline: var(--vb-link-focus-ring, currentcolor dotted 1px);
+    outline-offset: var(--vb-link-focus-ring-offset, 0.125rem);
+  }
+  .list, .type > ul, .type > ol {
+    margin-left: var(--vb-list-indent, var(--vb-spacing-lg));
+  }
+  .list ul,
+  .list ol, .type > ul ul,
+  .type > ul ol, .type > ol ul,
+  .type > ol ol {
+    margin-left: var(--vb-list-indent, var(--vb-spacing-lg));
+  }
+  .list li li,
+  .list li + li, .type > ul li li,
+  .type > ul li + li, .type > ol li li,
+  .type > ol li + li {
+    margin-top: var(--vb-list-spacing, var(--vb-spacing-sm));
+  }
+  .list-style-none {
+    list-style: none !important;
+  }
+  .code, .type :not(pre) > code {
+    padding: var(--vb-code-padding, 0.125rem 0.375rem);
+    border: var(--vb-code-border);
+    border-radius: var(--vb-code-border-radius, var(--vb-border-radius));
+    font-family: var(--vb-font-family-mono);
+    font-size: var(--vb-code-font-size, var(--vb-font-size-sm));
+    color: var(--vb-code-foreground, var(--vb-foreground-accent-alt));
+    overflow-wrap: break-word;
+    background: var(--vb-code-background, var(--vb-background-alt));
+  }
+  .pre, .type > pre {
+    overflow: auto;
+    padding: var(--vb-pre-padding, var(--vb-spacing-md));
+    border: var(--vb-pre-border, none);
+    border-radius: var(--vb-pre-border-radius, var(--vb-border-radius));
+    font-family: var(--vb-font-family-mono);
+    color: var(--vb-pre-foreground, var(--vb-foreground-strong));
+    background: var(--vb-pre-background, var(--vb-background-alt));
+  }
+  .pre code, .type > pre code {
+    padding: 0;
+    border: none;
+    font-size: var(--vb-pre-font-size, var(--vb-font-size-sm));
+    color: inherit;
+    background: none;
+  }
+  .blockquote, .type > blockquote {
+    position: relative;
+    padding: var(--vb-blockquote-padding, var(--vb-spacing-md));
+    border: var(--vb-blockquote-border, var(--vb-border));
+    border-radius: var(--vb-blockquote-border-radius, var(--vb-border-radius));
+    color: var(--vb-blockquote-foreground, currentcolor);
+    background: var(--vb-blockquote-background, transparent);
+  }
+  .blockquote > * + *, .type > blockquote > * + * {
+    margin-top: var(--vb-blockquote-spacing, var(--vb-spacing-md));
+  }
+  .sep, .type > hr {
+    display: block;
+    height: 0;
+    border: none;
+    border-top: var(--vb-separator-border-width, var(--vb-border-width)) var(--vb-separator-border-style, var(--vb-border-style)) var(--vb-separator-border-color, var(--vb-border-color));
+  }
+  .arrow,
+  .arrow-up,
+  .arrow-down,
+  .arrow-left,
+  .arrow-right {
+    pointer-events: none;
+    transform-origin: center;
+    display: inline-block;
+    flex-grow: 0;
+    flex-shrink: 0;
+    width: 0;
+    height: 0;
+    border-color: var(--vb-arrow-color, currentcolor) transparent transparent;
+    border-style: solid;
+    border-width: var(--vb-arrow-size, 6px 4px);
+    border-bottom-width: 0;
+    border-radius: var(--vb-arrow-radius, 2px);
+  }
+  .arrow-up {
+    transform: rotate(180deg);
+  }
+  .arrow-left {
+    transform: rotate(90deg);
+  }
+  .arrow-right {
+    transform: rotate(-90deg);
+  }
+  .loading-spinner {
+    width: var(--vb-loading-size, 1em);
+    height: var(--vb-loading-size, 1em);
+    position: relative;
+    display: inline-block;
+    border: var(--vb-loading-border, 2px solid);
+    border-color: var(--vb-loading-color, currentcolor) var(--vb-loading-color, currentcolor) transparent transparent;
+    border-radius: var(--vb-border-radius-circle);
+    animation: spin var(--vb-loading-duration, 0.6s) infinite linear;
+  }
+  @keyframes spin {
+    from {
+      transform: rotate(0deg);
+    }
+    to {
+      transform: rotate(360deg);
+    }
+  }
+  .sr-only {
+    position: absolute;
+    overflow: hidden;
+    width: 1px;
+    height: 1px;
+    margin: -1px;
+    padding: 0;
+    clip-path: inset(50%);
+  }
+  .type {
+    font-family: var(--vb-type-font-family, inherit);
+    font-size: var(--vb-type-font-size, inherit);
+    line-height: var(--vb-type-line-height, inherit);
+    color: var(--vb-type-foreground, var(--vb-foreground));
+  }
+  .type > * + * {
+    margin-top: var(--vb-type-spacing);
+  }
+}
+
+/*# sourceMappingURL=base.css.map */

package/dev/base.css.map

@@ -0,0 +1 @@
+{"version":3,"sourceRoot":"","sources":["../../../node_modules/@vrembem/base/index.scss","../../../node_modules/@vrembem/core/src/scss/library/_reset.scss","../../../node_modules/@vrembem/base/src/modules/_global.scss","../../../node_modules/@vrembem/base/src/modules/_headings.scss","../../../node_modules/@vrembem/core/src/scss/modules/_css.scss","../../../node_modules/@vrembem/base/src/modules/_link.scss","../../../node_modules/@vrembem/base/src/modules/_list.scss","../../../node_modules/@vrembem/base/src/modules/_code.scss","../../../node_modules/@vrembem/base/src/modules/_pre.scss","../../../node_modules/@vrembem/base/src/modules/_blockquote.scss","../../../node_modules/@vrembem/base/src/modules/_separator.scss","../../../node_modules/@vrembem/base/src/modules/_arrow.scss","../../../node_modules/@vrembem/core/src/scss/library/_arrow.scss","../../../node_modules/@vrembem/base/src/modules/_loading-spinner.scss","../../../node_modules/@vrembem/core/src/scss/library/_size.scss","../../../node_modules/@vrembem/core/src/scss/library/_loading-spinner.scss","../../../node_modules/@vrembem/base/src/modules/_sr-only.scss","../../../node_modules/@vrembem/core/src/scss/library/_sr-only.scss","../../../node_modules/@vrembem/base/src/modules/_type.scss"],"names":[],"mappings":"AAIA;ECSE;AAAA;AAAA;IAGE;IACA;IACA;;EAQF;AAAA;IAEE;IACA;IACA;;EAIF;IACE;;EAIF;IACE;;EAKF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;IAQE;;EAIF;AAAA;AAAA;IAGE;IACA;IACA;;EAIF;AAAA;AAAA;AAAA;IAIE;IACA;;EAIF;IACE;IACA;IACA;;EAIF;IACE;;EAIF;IACE;;EAIF;IACE;IACA;;EAIF;AAAA;AAAA;AAAA;AAAA;AAAA;IAME;IACA;;EAIF;AAAA;IAEE;;EAIF;IACE;;EAIF;AAAA;IAEE;IACA;;EAKF;IACE;IACA;;EC1HF;IACE;IACA;;ECDF;IACE;IACA;IACA;IACA;IACA;;EAYA;IC0JE;;ED1JF;IC0JE;;ED1JF;IC0JE;;ED1JF;IC0JE;;ED1JF;IC0JE;;ED1JF;IC0JE;;EC7KJ;IACE;IACA;IACA;IACA;;EAEA;IACE;IACA;;EAIF;IAEE;IAIA;;EAEA;IACE;;EAOJ;IACE;IACA;;EC/BJ;IACE;;EAEA;AAAA;AAAA;AAAA;IAEE;;EAGF;AAAA;AAAA;AAAA;IAEE;;EAIJ;IACE;;ECfF;IACE;IACA;IACA;IACA;IACA;IACA;IACA;IACA;;ECRF;IACE;IACA;IACA;IACA;IACA;IACA;IACA;;EAEA;IACE;IACA;IACA;IACA;IACA;;ECdJ;IACE;IACA;IACA;IACA;IACA;IACA;;EAEA;IACE;;ECTJ;IACE;IACA;IACA;IACA;;ECNF;AAAA;AAAA;AAAA;AAAA;ICMA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;;EDTA;IACE;;EAGF;IACE;;EAGF;IACE;;EEjBF;ICUE,OCCY;IDAZ;ICOF,UFjBgC;IEkBhC;IACA;IACA;IACA;IACA;;EAME;IACE;MACE;;IAGF;MACE;;;ECnCN;ICFA;IACA;IACA;IACA;IACA;IACA;IACA;;ECDA;IACE;IACA;IACA;IACA;;EAEA;IACE","file":"base.css"}