welcome-ui 8.4.0 → 8.5.0

package/dist/WuiProvider.mjs

@@ -1,5 +1,5 @@
 "use client";
-import { j as r } from "./jsx-runtime-Bqq1Hxg9.mjs";
+import { j as a } from "./jsx-runtime-Bqq1Hxg9.mjs";
 import { createGlobalStyle as p, css as i, th as d, ThemeProvider as m } from "@xstyled/styled-components";
 import { useState as f, useEffect as g } from "react";
 const u = "data-wui-hidefocusrings", h = p(
@@ -14,14 +14,14 @@ const u = "data-wui-hidefocusrings", h = p(
 }) => {
   const [n, t] = f(!1);
   return g(() => {
-    const a = n ? "keydown" : "mousemove", s = () => t((c) => !c);
-    window.addEventListener(a, s);
+    const r = n ? "keydown" : "mousemove", s = () => t((c) => !c);
+    window.addEventListener(r, s);
     const l = document.getElementById(o);
     return l && (n ? l.setAttribute(u, "true") : l.removeAttribute(u)), () => {
-      window.removeEventListener(a, s);
+      window.removeEventListener(r, s);
     };
-  }, [n, o]), /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
-    /* @__PURE__ */ r.jsx(h, {}),
+  }, [n, o]), /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
+    /* @__PURE__ */ a.jsx(h, {}),
     e
   ] });
 };
@@ -34,7 +34,7 @@ function w({
     display: o = "swap",
     extensions: n = ["woff2", "woff"],
     isVariable: t,
-    style: a,
+    style: r,
     unicodeRange: s,
     url: l,
     weight: c
@@ -48,8 +48,8 @@ function w({
       ${c && i`
         font-weight: ${c};
       `}
-      ${a && i`
-        font-style: ${a};
+      ${r && i`
+        font-style: ${r};
       `}
       ${s && i`
         unicode-range: ${s};
@@ -60,340 +60,344 @@ function w({
 const k = () => ({ theme: e }) => !e || !e.fontFaces ? null : Object.entries(e.fontFaces).map(
   ([o, n]) => n.map((t) => w({ name: o, variation: t }))
 ), v = i`
-  html,
-  body,
-  div,
-  span,
-  applet,
-  object,
-  iframe,
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  h6,
-  p,
-  blockquote,
-  pre,
-  a,
-  abbr,
-  acronym,
-  address,
-  big,
-  cite,
-  code,
-  del,
-  dfn,
-  em,
-  img,
-  ins,
-  kbd,
-  q,
-  s,
-  samp,
-  small,
-  strike,
-  strong,
-  sub,
-  sup,
-  tt,
-  var,
-  b,
-  u,
-  i,
-  center,
-  dl,
-  dt,
-  dd,
-  ol,
-  ul,
-  li,
-  fieldset,
-  form,
-  label,
-  legend,
-  table,
-  caption,
-  tbody,
-  tfoot,
-  thead,
-  tr,
-  th,
-  td,
-  article,
-  aside,
-  canvas,
-  details,
-  embed,
-  figure,
-  figcaption,
-  footer,
-  header,
-  hgroup,
-  menu,
-  nav,
-  output,
-  ruby,
-  section,
-  summary,
-  time,
-  mark,
-  audio,
-  video {
-    min-width: 0;
-    min-height: 0;
-    margin: 0;
-    padding: 0;
-    border: 0;
-    font-size: 100%;
-    vertical-align: baseline;
-  }
-  article,
-  aside,
-  details,
-  figcaption,
-  figure,
-  footer,
-  header,
-  hgroup,
-  menu,
-  nav,
-  section {
-    display: block;
-  }
-  ol,
-  ul {
-    list-style: none;
-  }
-  blockquote,
-  q {
-    quotes: none;
-  }
-  blockquote::before,
-  blockquote::after,
-  q::before,
-  q::after {
-    content: '';
-    content: none;
-  }
-  table {
-    border-collapse: collapse;
-    border-spacing: 0;
-  }
-  a {
-    text-decoration: none;
-  }
-  img {
-    overflow: hidden;
-  }
-  input {
-    -webkit-appearance: none;
-    -moz-appearance: none;
-    appearance: none;
-  }
-  input::-webkit-search-cancel-button {
-    display: none;
-  }
-  :focus {
-    outline: none !important; /* important for firefox */
-  }
-  *,
-  *::after,
-  *::before {
-    box-sizing: border-box;
-    -webkit-font-smoothing: antialiased;
-    -moz-osx-font-smoothing: grayscale;
-  }
-  html {
-    height: 100%;
-  }
-  body {
-    min-height: 100%;
-    padding-top: 1px;
-    margin-top: -1px;
+  @layer base {
+    html,
+    body,
+    div,
+    span,
+    applet,
+    object,
+    iframe,
+    h1,
+    h2,
+    h3,
+    h4,
+    h5,
+    h6,
+    p,
+    blockquote,
+    pre,
+    a,
+    abbr,
+    acronym,
+    address,
+    big,
+    cite,
+    code,
+    del,
+    dfn,
+    em,
+    img,
+    ins,
+    kbd,
+    q,
+    s,
+    samp,
+    small,
+    strike,
+    strong,
+    sub,
+    sup,
+    tt,
+    var,
+    b,
+    u,
+    i,
+    center,
+    dl,
+    dt,
+    dd,
+    ol,
+    ul,
+    li,
+    fieldset,
+    form,
+    label,
+    legend,
+    table,
+    caption,
+    tbody,
+    tfoot,
+    thead,
+    tr,
+    th,
+    td,
+    article,
+    aside,
+    canvas,
+    details,
+    embed,
+    figure,
+    figcaption,
+    footer,
+    header,
+    hgroup,
+    menu,
+    nav,
+    output,
+    ruby,
+    section,
+    summary,
+    time,
+    mark,
+    audio,
+    video {
+      min-width: 0;
+      min-height: 0;
+      margin: 0;
+      padding: 0;
+      border: 0;
+      font-size: 100%;
+      vertical-align: baseline;
+    }
+    article,
+    aside,
+    details,
+    figcaption,
+    figure,
+    footer,
+    header,
+    hgroup,
+    menu,
+    nav,
+    section {
+      display: block;
+    }
+    ol,
+    ul {
+      list-style: none;
+    }
+    blockquote,
+    q {
+      quotes: none;
+    }
+    blockquote::before,
+    blockquote::after,
+    q::before,
+    q::after {
+      content: '';
+      content: none;
+    }
+    table {
+      border-collapse: collapse;
+      border-spacing: 0;
+    }
+    a {
+      text-decoration: none;
+    }
+    img {
+      overflow: hidden;
+    }
+    input {
+      -webkit-appearance: none;
+      -moz-appearance: none;
+      appearance: none;
+    }
+    input::-webkit-search-cancel-button {
+      display: none;
+    }
+    :focus {
+      outline: none !important; /* important for firefox */
+    }
+    *,
+    *::after,
+    *::before {
+      box-sizing: border-box;
+      -webkit-font-smoothing: antialiased;
+      -moz-osx-font-smoothing: grayscale;
+    }
+    html {
+      height: 100%;
+    }
+    body {
+      min-height: 100%;
+      padding-top: 1px;
+      margin-top: -1px;
+    }
   }
 `, z = i`
-  html {
-    line-height: 1.15;
-    -webkit-text-size-adjust: 100%;
-  }
+  @layer base {
+    html {
+      line-height: 1.15;
+      -webkit-text-size-adjust: 100%;
+    }
 
-  body {
-    margin: 0;
-  }
+    body {
+      margin: 0;
+    }
 
-  main {
-    display: block;
-  }
+    main {
+      display: block;
+    }
 
-  h1 {
-    font-size: 2em;
-    margin: 0.67em 0;
-  }
+    h1 {
+      font-size: 2em;
+      margin: 0.67em 0;
+    }
 
-  hr {
-    box-sizing: content-box;
-    height: 0;
-    overflow: visible;
-  }
+    hr {
+      box-sizing: content-box;
+      height: 0;
+      overflow: visible;
+    }
 
-  pre {
-    font-family: monospace;
-    font-size: 1em;
-  }
+    pre {
+      font-family: monospace;
+      font-size: 1em;
+    }
 
-  a {
-    background-color: transparent;
-  }
+    a {
+      background-color: transparent;
+    }
 
-  abbr[title] {
-    border-bottom: none;
-    text-decoration: underline;
-    text-decoration: underline dotted;
-  }
+    abbr[title] {
+      border-bottom: none;
+      text-decoration: underline;
+      text-decoration: underline dotted;
+    }
 
-  b,
-  strong {
-    font-weight: bolder;
-  }
+    b,
+    strong {
+      font-weight: bolder;
+    }
 
-  code,
-  kbd,
-  samp {
-    font-family: monospace;
-    font-size: 1em;
-  }
+    code,
+    kbd,
+    samp {
+      font-family: monospace;
+      font-size: 1em;
+    }
 
-  small {
-    font-size: 80%;
-  }
+    small {
+      font-size: 80%;
+    }
 
-  sub,
-  sup {
-    font-size: 75%;
-    line-height: 0;
-    position: relative;
-    vertical-align: baseline;
-  }
+    sub,
+    sup {
+      font-size: 75%;
+      line-height: 0;
+      position: relative;
+      vertical-align: baseline;
+    }
 
-  sub {
-    bottom: -0.25em;
-  }
+    sub {
+      bottom: -0.25em;
+    }
 
-  sup {
-    top: -0.5em;
-  }
+    sup {
+      top: -0.5em;
+    }
 
-  img {
-    border-style: none;
-  }
+    img {
+      border-style: none;
+    }
 
-  button,
-  input,
-  optgroup,
-  select,
-  textarea {
-    font-family: inherit;
-    font-size: 100%;
-    line-height: 1.15;
-    margin: 0;
-  }
+    button,
+    input,
+    optgroup,
+    select,
+    textarea {
+      font-family: inherit;
+      font-size: 100%;
+      line-height: 1.15;
+      margin: 0;
+    }
 
-  button,
-  input {
-    overflow: visible;
-  }
+    button,
+    input {
+      overflow: visible;
+    }
 
-  button,
-  select {
-    text-transform: none;
-  }
+    button,
+    select {
+      text-transform: none;
+    }
 
-  button,
-  [type='button'],
-  [type='reset'],
-  [type='submit'] {
-    appearance: auto;
-    -webkit-appearance: button;
-  }
+    button,
+    [type='button'],
+    [type='reset'],
+    [type='submit'] {
+      appearance: auto;
+      -webkit-appearance: button;
+    }
 
-  button::-moz-focus-inner,
-  [type='button']::-moz-focus-inner,
-  [type='reset']::-moz-focus-inner,
-  [type='submit']::-moz-focus-inner {
-    border-style: none;
-    padding: 0;
-  }
+    button::-moz-focus-inner,
+    [type='button']::-moz-focus-inner,
+    [type='reset']::-moz-focus-inner,
+    [type='submit']::-moz-focus-inner {
+      border-style: none;
+      padding: 0;
+    }
 
-  button:-moz-focusring,
-  [type='button']:-moz-focusring,
-  [type='reset']:-moz-focusring,
-  [type='submit']:-moz-focusring {
-    outline: 1px dotted ButtonText;
-  }
+    button:-moz-focusring,
+    [type='button']:-moz-focusring,
+    [type='reset']:-moz-focusring,
+    [type='submit']:-moz-focusring {
+      outline: 1px dotted ButtonText;
+    }
 
-  fieldset {
-    padding: 0.35em 0.75em 0.625em;
-  }
+    fieldset {
+      padding: 0.35em 0.75em 0.625em;
+    }
 
-  legend {
-    box-sizing: border-box;
-    color: inherit;
-    display: table;
-    max-width: 100%;
-    padding: 0;
-    white-space: normal;
-  }
+    legend {
+      box-sizing: border-box;
+      color: inherit;
+      display: table;
+      max-width: 100%;
+      padding: 0;
+      white-space: normal;
+    }
 
-  progress {
-    vertical-align: baseline;
-  }
+    progress {
+      vertical-align: baseline;
+    }
 
-  textarea {
-    overflow: auto;
-  }
+    textarea {
+      overflow: auto;
+    }
 
-  [type='checkbox'],
-  [type='radio'] {
-    box-sizing: border-box;
-    padding: 0;
-  }
+    [type='checkbox'],
+    [type='radio'] {
+      box-sizing: border-box;
+      padding: 0;
+    }
 
-  [type='number']::-webkit-inner-spin-button,
-  [type='number']::-webkit-outer-spin-button {
-    height: auto;
-  }
+    [type='number']::-webkit-inner-spin-button,
+    [type='number']::-webkit-outer-spin-button {
+      height: auto;
+    }
 
-  [type='search'] {
-    appearance: textfield;
-    -webkit-appearance: textfield;
-    outline-offset: -2px;
-  }
+    [type='search'] {
+      appearance: textfield;
+      -webkit-appearance: textfield;
+      outline-offset: -2px;
+    }
 
-  [type='search']::-webkit-search-decoration {
-    -webkit-appearance: none;
-  }
+    [type='search']::-webkit-search-decoration {
+      -webkit-appearance: none;
+    }
 
-  ::-webkit-file-upload-button {
-    -webkit-appearance: button;
-    font: inherit;
-  }
+    ::-webkit-file-upload-button {
+      -webkit-appearance: button;
+      font: inherit;
+    }
 
-  details {
-    display: block;
-  }
+    details {
+      display: block;
+    }
 
-  summary {
-    display: list-item;
-  }
+    summary {
+      display: list-item;
+    }
 
-  template {
-    display: none;
-  }
+    template {
+      display: none;
+    }
 
-  [hidden] {
-    display: none;
+    [hidden] {
+      display: none;
+    }
   }
 `, $ = i`
   * {
@@ -406,16 +410,18 @@ const k = () => ({ theme: e }) => !e || !e.fontFaces ? null : Object.entries(e.f
 `;
 function j() {
   return i`
-    body,
-    button,
-    input,
-    select,
-    textarea {
-      /* stylelint-disable-next-line */
-      font-family: texts;
-      -webkit-font-smoothing: antialiased;
-      line-height: html;
-      letter-spacing: html;
+    @layer base {
+      body,
+      button,
+      input,
+      select,
+      textarea {
+        /* stylelint-disable-next-line */
+        font-family: texts;
+        -webkit-font-smoothing: antialiased;
+        line-height: html;
+        letter-spacing: html;
+      }
     }
   `;
 }
@@ -457,11 +463,11 @@ const b = p(
   hasGlobalStyle: o = !0,
   reactRootId: n = "root",
   shouldHideFocusRingOnClick: t = !0,
-  theme: a,
+  theme: r,
   useReset: s
-}) => /* @__PURE__ */ r.jsx(m, { theme: a, children: /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
-  o ? /* @__PURE__ */ r.jsx(b, { useReset: s }) : null,
-  t ? /* @__PURE__ */ r.jsx(y, { reactRootId: n, children: e }) : e
+}) => /* @__PURE__ */ a.jsx(m, { theme: r, children: /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
+  o ? /* @__PURE__ */ a.jsx(b, { useReset: s }) : null,
+  t ? /* @__PURE__ */ a.jsx(y, { reactRootId: n, children: e }) : e
 ] }) }), E = b;
 F.displayName = "WuiProvider";
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "welcome-ui",
-  "version": "8.4.0",
+  "version": "8.5.0",
   "description": "Customizable design system with react • styled-components • styled-system and ariakit.",
   "files": [
     "dist"