@ptbdynamic/plinth 0.0.0-stage → 0.2.0

package/packages/css/dist/dialog.css

@@ -0,0 +1,113 @@
+/*
+ * Dialog: a modal for a form, the details of something or its settings, centred on the screen at
+ * every width; with data-side-phone="bottom" it is a bottom sheet below 768px.
+ *
+ * <dialog id="settings" class="plinth-dialog" closedby="any"
+ *   aria-labelledby="settings-title" aria-describedby="settings-description">
+ *   <div class="plinth-dialog-panel">
+ *     <div class="plinth-dialog-handle" aria-hidden="true"></div>
+ *     <div class="plinth-dialog-header">
+ *       <h2 id="settings-title" class="plinth-dialog-title">Settings</h2>
+ *       <p id="settings-description" class="plinth-dialog-description">Changes apply at once.</p>
+ *       <button type="button" class="plinth-button plinth-icon-button plinth-dialog-close"
+ *         data-variant="ghost" data-size="md" aria-label="Close" commandfor="settings"
+ *         command="close">
+ *         <span class="plinth-icon" data-size="md" aria-hidden="true"><svg>…</svg></span>
+ *       </button>
+ *     </div>
+ *     <div class="plinth-dialog-body">…</div>
+ *     <div class="plinth-dialog-footer">…</div>
+ *   </div>
+ * </dialog>
+ *
+ * The root is the <dialog>, and it needs an id: commandfor and aria-labelledby point at it, and
+ * the title's and description's ids are the root's id with -title and -description. The panel is
+ * the root's only child and holds the parts. The handle is there only on a dismissible dialog
+ * with data-side-phone="bottom": decorative (aria-hidden), shown below 768px, where the dialog is
+ * dragged down to close (modal.css). The title is
+ * required; the description (and its aria-describedby) and the footer are optional. The close
+ * button is an icon button (button.css and icon.css). It needs modal.css, the base it shares with
+ * the sheet: the surface, the backdrop, the scroll lock, the motion, the safe areas and the parts
+ * are there, and this file sets only where the dialog sits and how big it is.
+ *
+ * Open it with showModal() or a <button commandfor="settings" command="show-modal">. Open is the
+ * native state, [open]; the browser puts the dialog in the top layer, makes the page inert, traps
+ * focus, and returns focus to what opened it. The dialog fires close when it closes.
+ *
+ * Dismissible (the default): closedby="any" and the close button; the close button, Escape and a
+ * tap on the backdrop close it (closedby="any" is an enhancement Safari doesn't have yet, so the
+ * close button is always there). Not dismissible, for a choice the person must make:
+ * role="alertdialog", closedby="closerequest" and no close button, so a stray tap on the backdrop
+ * does nothing and it closes through its own buttons, with Escape acting as Cancel (the browser
+ * fires cancel, then close, with an empty returnValue). It needs an action that closes it,
+ * usually in the footer, the least destructive first: a touch screen has no Escape, and the
+ * browser focuses the first control. Give it a description: an alert dialog's message is its
+ * accessible description. A project may set its own closedby.
+ *
+ * Presentation: centred at every width, dialog.width wide (less the screen's margin on a phone),
+ * its height capped by the screen's, fading and rising into place. data-side-phone="bottom" (the
+ * only value; leave it out for centred) makes it a bottom sheet below 768px: the screen's width,
+ * on the bottom edge, sliding up, its last part clearing the home indicator; from 768px up it is
+ * centred like any dialog.
+ *
+ * On a phone the dialog's height is capped by 100dvh, which doesn't, on its own, clear the
+ * on-screen keyboard: a page with a form in a dialog sets interactive-widget=resizes-content in
+ * its viewport meta where the browser supports it, as for the sheet.
+ *
+ * In Livewire, a re-render would morph the open dialog back to the server's markup and drop its
+ * open attribute: put wire:ignore.self on the dialog (or keep it outside the component that
+ * re-renders), and always pass an id, since a generated one changes on every render.
+ */
+
+@layer plinth {
+  .plinth-dialog {
+    --plinth-modal-offset: 0 var(--plinth-space-4);
+    --plinth-modal-closed-opacity: 0;
+
+    inset: 0;
+    inline-size: min(100% - 2 * var(--plinth-space-4), var(--plinth-dialog-width));
+    max-block-size: calc(100dvh - 2 * var(--plinth-space-4));
+    margin: auto;
+  }
+
+  .plinth-dialog[data-side-phone='bottom'] {
+    --plinth-modal-offset: 0 100%;
+    --plinth-modal-closed-opacity: 1;
+    --plinth-modal-safe-area-end: env(safe-area-inset-bottom);
+
+    inset-block: auto 0;
+    inline-size: 100%;
+    max-block-size: calc(100dvh - var(--plinth-space-12));
+    margin: 0;
+    border-block-end-width: 0;
+    border-end-start-radius: 0;
+    border-end-end-radius: 0;
+  }
+
+  /* One that can be dismissed is dragged down to close (modal.css): the root fills the screen. */
+  .plinth-dialog[data-side-phone='bottom']:has(> * > .plinth-dialog-handle) {
+    inset: 0;
+    block-size: auto;
+    max-block-size: none;
+    border-width: 0;
+    border-radius: 0;
+  }
+
+  @media (min-width: 768px) {
+    .plinth-dialog,
+    .plinth-dialog[data-side-phone='bottom'],
+    .plinth-dialog[data-side-phone='bottom']:has(> * > .plinth-dialog-handle) {
+      --plinth-modal-offset: 0 var(--plinth-space-4);
+      --plinth-modal-closed-opacity: 0;
+      --plinth-modal-safe-area-end: initial;
+
+      inset: 0;
+      inline-size: min(100% - 2 * var(--plinth-space-8), var(--plinth-dialog-width));
+      block-size: fit-content;
+      max-block-size: calc(100dvh - 2 * var(--plinth-space-8));
+      margin: auto;
+      border-width: var(--plinth-border-width-thin);
+      border-radius: var(--plinth-radius-container);
+    }
+  }
+}

package/packages/css/dist/drawer.css

@@ -0,0 +1,156 @@
+/*
+ * Drawer: a phone-first panel on the bottom edge that the person drags, like a maps app's panel,
+ * with optional snap points (a peek, half and full height). From 768px up it is a dialog or a
+ * sheet.
+ *
+ * <dialog id="route" class="plinth-drawer" data-desktop="dialog"
+ *   data-snap-points="peek half full" data-snap="peek" closedby="any"
+ *   aria-labelledby="route-title" aria-describedby="route-description">
+ *   <div class="plinth-drawer-panel">
+ *     <div class="plinth-drawer-handle" aria-hidden="true"></div>
+ *     <div class="plinth-drawer-header">
+ *       <h2 id="route-title" class="plinth-drawer-title">Route</h2>
+ *       <p id="route-description" class="plinth-drawer-description">12 min by bike.</p>
+ *       <button type="button" class="plinth-button plinth-icon-button plinth-drawer-close"
+ *         data-variant="ghost" data-size="md" aria-label="Close" commandfor="route"
+ *         command="close">
+ *         <span class="plinth-icon" data-size="md" aria-hidden="true"><svg>…</svg></span>
+ *       </button>
+ *     </div>
+ *     <div class="plinth-drawer-body">…</div>
+ *     <div class="plinth-drawer-footer">…</div>
+ *   </div>
+ * </dialog>
+ *
+ * The root is the <dialog>, and it needs an id: commandfor and aria-labelledby point at it, and
+ * the title's and description's ids are the root's id with -title and -description. The panel is
+ * the root's only child and holds the parts; the handle is always there, first, and decorative
+ * (aria-hidden): Escape and the close button, which is always there too, are the ways to close it
+ * without dragging. The title is required; the description (and its aria-describedby) and the
+ * footer are optional. The close button is an icon button (button.css and icon.css). It needs
+ * modal.css, the base it shares with the dialog and the sheet, where the dragging is described:
+ * this file sets where the drawer sits, how big it is and its snap points.
+ *
+ * Open it with showModal() or a <button commandfor="route" command="show-modal">. Open is the
+ * native state, [open]; the browser puts the drawer in the top layer, makes the page inert, traps
+ * focus, closes on Escape and returns focus. The dialog fires close when it closes, whichever way
+ * it closed.
+ *
+ * On a phone (below 768px) it is the screen's width on the bottom edge and slides up. Dragged
+ * down past its lowest snap point it closes; the layers do that part (modal.css). With no snap
+ * points it is as tall as its content, up to the screen's height less a gap.
+ *
+ * Snap points (data-snap-points, optional): any of peek, half and full, separated by spaces.
+ * With them the panel is the screen's height less a gap, and it rests where it is let go at the
+ * nearest one: peek shows drawer.peek-height of it (the handle, the header and the top of the
+ * body), half the screen's height, full all of it. The body scrolls inside the panel at any of
+ * them, so a drawer with a long body is dragged by its handle and header. data-snap is the snap
+ * point it opens at, one of those listed (the layers print the largest listed when it is missing
+ * or unknown); the browser opens it at full, or the largest listed, and the layers then scroll it
+ * to data-snap. The drawer remembers nothing: where it rests is the person's.
+ *
+ * Desktop (data-desktop): its presentation from 768px up. dialog (the default, also when missing
+ * or unknown) centres it like the dialog, at dialog.width; sheet makes it a full-height panel on
+ * the inline-end edge, sheet.side-width wide, like the sheet. From 768px up there is no handle
+ * and no dragging, the snap points don't apply, and a tap on the backdrop closes it
+ * (closedby="any"; Safari doesn't have it yet, so the close button is always there).
+ *
+ * The motion runs on the motion tokens, which drop to 0ms under prefers-reduced-motion; the
+ * snapping is the browser's scrolling.
+ *
+ * In Livewire, a re-render would morph the open dialog back to the server's markup and drop its
+ * open attribute: put wire:ignore.self on the drawer (or keep it outside the component that
+ * re-renders), and always pass an id, since a generated one changes on every render.
+ */
+
+@layer plinth {
+  .plinth-drawer {
+    --plinth-modal-offset: 0 100%;
+    --plinth-modal-safe-area-end: env(safe-area-inset-bottom);
+
+    /* Translate isn't logical: -1 (under :dir(rtl), below) turns the sheet's slide around. */
+    --plinth-drawer-direction: 1;
+
+    inset: 0;
+    inline-size: 100%;
+    block-size: auto;
+    max-block-size: none;
+    margin: 0;
+    border-width: 0;
+    border-radius: 0;
+  }
+
+  /* With snap points the panel is its full height, and the snap points are where it rests. */
+  .plinth-drawer[data-snap-points] > .plinth-drawer-panel {
+    block-size: calc(
+      100% - max(var(--plinth-space-12), env(safe-area-inset-top) + var(--plinth-space-4))
+    );
+  }
+
+  /* Full is the panel's end on the screen's bottom edge, the base's open position. */
+  .plinth-drawer[data-snap-points]:not([data-snap-points~='full']) > .plinth-drawer-panel {
+    scroll-snap-align: none;
+  }
+
+  /*
+   * Peek and half are the panel's top that far from the screen's bottom edge. The snap areas are
+   * the handle (peek) and the header (half), the first parts of the panel, so their margins add
+   * what lies above them: the handle's margin, then the handle (modal.css; change them together).
+   */
+  .plinth-drawer[data-snap-points~='peek'] .plinth-drawer-handle {
+    scroll-snap-align: start;
+    scroll-margin-block-start: calc(
+      100dvh - var(--plinth-drawer-peek-height) + var(--plinth-space-2)
+    );
+  }
+
+  .plinth-drawer[data-snap-points~='half'] .plinth-drawer-header {
+    scroll-snap-align: start;
+    scroll-margin-block-start: calc(50dvh + var(--plinth-space-2) + var(--plinth-space-1));
+  }
+
+  .plinth-drawer:dir(rtl) {
+    --plinth-drawer-direction: -1;
+  }
+
+  @media (min-width: 768px) {
+    .plinth-drawer {
+      --plinth-modal-offset: 0 var(--plinth-space-4);
+      --plinth-modal-closed-opacity: 0;
+      --plinth-modal-safe-area-end: initial;
+
+      inset: 0;
+      inline-size: min(100% - 2 * var(--plinth-space-8), var(--plinth-dialog-width));
+      block-size: fit-content;
+      max-block-size: calc(100dvh - 2 * var(--plinth-space-8));
+      margin: auto;
+      border-width: var(--plinth-border-width-thin);
+      border-radius: var(--plinth-radius-container);
+    }
+
+    .plinth-drawer[data-desktop='sheet'] {
+      --plinth-modal-offset: calc(100% * var(--plinth-drawer-direction)) 0;
+      --plinth-modal-closed-opacity: 1;
+      --plinth-modal-safe-area-end: env(safe-area-inset-bottom);
+
+      inset-block: 0;
+      inset-inline: auto 0;
+      inline-size: min(100% - var(--plinth-space-12), var(--plinth-sheet-side-width));
+      block-size: auto;
+      max-block-size: none;
+      padding-block: env(safe-area-inset-top) 0;
+      margin: 0;
+      border-width: 0;
+      border-inline-start-width: var(--plinth-border-width-thin);
+      border-radius: 0;
+    }
+
+    .plinth-drawer[data-snap-points] > .plinth-drawer-panel {
+      block-size: auto;
+    }
+
+    .plinth-drawer[data-snap-points] :is(.plinth-drawer-handle, .plinth-drawer-header) {
+      scroll-snap-align: none;
+    }
+  }
+}

package/packages/css/dist/fonts/geist/LICENSE

@@ -0,0 +1,93 @@
+Copyright 2024 The Geist Project Authors (https://github.com/vercel/geist-font) Geist-Italic[wght].ttf: Copyright 2024 The Geist Project Authors (https://github.com/vercel/geist-font)
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded,
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.

package/packages/css/dist/fonts/geist-mono/LICENSE

@@ -0,0 +1,93 @@
+Copyright 2024 The Geist Project Authors (https://github.com/vercel/geist-font.git) GeistMono-Italic[wght].ttf: Copyright 2024 The Geist Project Authors (https://github.com/vercel/geist-font.git)
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded,
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.

package/packages/css/dist/fonts/index.css

@@ -0,0 +1,109 @@
+/* Geist and Geist Mono, from @fontsource-variable (SIL Open Font Licence). */
+/* geist-cyrillic-ext-wght-normal */
+@font-face {
+  font-family: 'Geist Variable';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 100 900;
+  src: url(./geist/geist-cyrillic-ext-wght-normal.woff2) format('woff2-variations');
+  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
+}
+
+/* geist-cyrillic-wght-normal */
+@font-face {
+  font-family: 'Geist Variable';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 100 900;
+  src: url(./geist/geist-cyrillic-wght-normal.woff2) format('woff2-variations');
+  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
+}
+
+/* geist-vietnamese-wght-normal */
+@font-face {
+  font-family: 'Geist Variable';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 100 900;
+  src: url(./geist/geist-vietnamese-wght-normal.woff2) format('woff2-variations');
+  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
+}
+
+/* geist-latin-ext-wght-normal */
+@font-face {
+  font-family: 'Geist Variable';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 100 900;
+  src: url(./geist/geist-latin-ext-wght-normal.woff2) format('woff2-variations');
+  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
+}
+
+/* geist-latin-wght-normal */
+@font-face {
+  font-family: 'Geist Variable';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 100 900;
+  src: url(./geist/geist-latin-wght-normal.woff2) format('woff2-variations');
+  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
+}
+/* geist-mono-cyrillic-ext-wght-normal */
+@font-face {
+  font-family: 'Geist Mono Variable';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 100 900;
+  src: url(./geist-mono/geist-mono-cyrillic-ext-wght-normal.woff2) format('woff2-variations');
+  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
+}
+
+/* geist-mono-cyrillic-wght-normal */
+@font-face {
+  font-family: 'Geist Mono Variable';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 100 900;
+  src: url(./geist-mono/geist-mono-cyrillic-wght-normal.woff2) format('woff2-variations');
+  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
+}
+
+/* geist-mono-symbols2-wght-normal */
+@font-face {
+  font-family: 'Geist Mono Variable';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 100 900;
+  src: url(./geist-mono/geist-mono-symbols2-wght-normal.woff2) format('woff2-variations');
+  unicode-range: U+2000-2001,U+2004-2008,U+200A,U+23B8-23BD,U+2500-259F;
+}
+
+/* geist-mono-vietnamese-wght-normal */
+@font-face {
+  font-family: 'Geist Mono Variable';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 100 900;
+  src: url(./geist-mono/geist-mono-vietnamese-wght-normal.woff2) format('woff2-variations');
+  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
+}
+
+/* geist-mono-latin-ext-wght-normal */
+@font-face {
+  font-family: 'Geist Mono Variable';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 100 900;
+  src: url(./geist-mono/geist-mono-latin-ext-wght-normal.woff2) format('woff2-variations');
+  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
+}
+
+/* geist-mono-latin-wght-normal */
+@font-face {
+  font-family: 'Geist Mono Variable';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 100 900;
+  src: url(./geist-mono/geist-mono-latin-wght-normal.woff2) format('woff2-variations');
+  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
+}