@jordan-mace/chaser-design-system 1.2.2 → 1.2.4

package/dist/components/Pagination/styles.css.js

@@ -1,11 +1,44 @@
-import "src/styles/sprinkles.css.ts.vanilla.css!=!../../../../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.25_webpack@5.104.1/node_modules/@vanilla-extract/webpack-plugin/virtualFileLoader/dist/vanilla-extract-webpack-plugin-virtualFileLoader.cjs.js?{\"fileName\":\"src/styles/sprinkles.css.ts.vanilla.css\",\"source\":\"#H4sIAAAAAAAAA5Wc227jVhJF3_srBAwGyDw4EG-HpPMSSpR-Y0CRh6Rs3ZqS23YP-t8HaZItn127SDfylqyyVdIqWrsC1N-H4t12i_J8vJxP9nS7_vXlz_9678H1W3eMXxb_-7JYlOfDuXtc_GsbbbPt5q8vPz4Qrw6R55vNNneJd4dYbfPtdu0QydIhMpMHSPgOkSTrEInQIcxmFSNhHCIKsxUSiUMEYbqGbpPCIbwsXW63LlE6xNJLvG3qEtYlgjjM3XcsaVwiNOEKXsceiCjOQpd4dokozJLMJY7wM4LMwPtxBsLPo8AlvkIvXh5ELnF1Cd9betCtcEy86-jY1oBjCTq2QcdSdGyTIoGObdDCFB3LcyTQsTxBAh3Lfeg2RcfWOTiWomPrABxL0bFsA46l6FhqwLEUHUs8cCxFx0wOjqXoWBSBYyk6FvrgWIqO-Rk4lgrHYnAsFY6l-K6L59gKHEtdx9bLPIPPtgDH4vV6u3IJcCxdZUi4jsXLTPwMcMykORLgmEnW-ErBsXWcQ7cFOBaafGtcAhwzxs_hdYBjJopW8DrAMRNmme8S4JgJtkniEkckPAOvAxyLfBPBbxHPsRQcK9Cx5caDXsCxZCs-W9exTbJZb13XC9exPMxXG7fbnevYOljnuft02LmOZdtVnru97FzH0n9Edj_9netYkmfe2p39netYHKfLldvtznXMmMRfue_6znUsCmM_cx3buY6FaxOn8Dpcx0I_SpOlS7iOBVmYG3f2d65jgRd6ERCuY34chKH7xN25jnkbPwngk3Md80Iv86EXcGy13HhAgGPZP_-4BDiWb9Yb6AUcy_P1xn3HStexfLne5O7rKF3H1svVZu1-cqXr2CpYLVfuKy1dx7Io8zP3lZauY6lJ_QxeqetYkiYh-FG6jsVpHCbwSl3HTG6S2P3kStexaBNlBgjXscgLNxF06zoWRqEfus-P0nUsiIMocCeqdB3zMz_14R0Dx1Ze5gEBjm2XGw_e096xXVE-N9355VTxL_7lq8TIt__yXWIkAlRLiZEcUPkSI2GgCiVGEkFlJEZiQZVIjGSDqpAYCQhVKTGSEipLMBkVqoZgMi9Ue4aJ0FA9E0wmh-rIfpqID9WZYSJDVF9ZpyJIVFeCyTRRcXvFh0XtFbmiovaKcGGpvSJhWGqviBmW2iuyhqX2isBhqb0idVhqr4geltor8oel9ooQYqm9IolYaq-II5baKzKJpfaKYGKpvSKdWGqviCiW24s5xXJ7MaxY_uzFxGKJvSS21MxemV1qZq8MMDWxl6SYmtkro0zN7JV5pmb2ylBTM3tlsqmZvTLe1MxemXFqZq8MOjWzV6admtkrI0_N7JW5p-bPXgw_NbVXJKCa2StjUE3sJVmoJvaSQNQQe0kqaoi9JBo1xF6SjxpiLwlJDbGXJKWG2EviUkPsJZmpIfaS4NQQe0l6aoi9JEI1xF6SoxpiLwlTDbGXJKqG2EtiVcPsldmqYfbKgNUwe2XKapi9Mmq1xF6St1piLwldLbGXJK-W2EviV0vsJRmsJfaSINYSe0kaa4m9JJK1xF6Sy1piLwlnLbGXJLSW2EtiWkvsJVmtZfbKwNYye3-ltr_xf978hH8V93YtFtX-ejkU74-L0_lk__qyWPz4SAVI1Qf7JiiD1O5wLp8FliK2Px325JeWA_e6r27t46J4uZ0FU7uMt1z-WzB7l4kIcnARP5LIeUBau2_am_JyOoDo63kBiL2gN2DYK_LGz-6fD-Oh2ne2vO3Pp8dFd36VcKDA5fnwcjxJfvwwn16ut339_lCeTzd7uj0urrfO3spWVqRaxc9feb0V3U0WlVpRaU8328mCevK32FMlS_ZqK5eitA_Fz6GRZYfpsp29vVpL3rnRlOKwb04P-5s9XifetY7RU-_YCyvQ3q039aezd8ofjboUVbU_NQ-38-VxsZRcwLjwIh8JvmFkwsiUkZ5haMlQOpB-DejufLudj7SpvYLSvg4KTFs7KzDvrlNo3uAL0Adb32h7bxRkzQWoQY-y1gI0oUdpYwG60LO0rQBt6PrnoOwrQBkGkjaGNgws7Qx1GFjeGurQTfyRCEYdjkXX7E_qJxZ0jKN9vTCSdvXGSNpTuGQo7SgMXFT9sEJDQdZTmFKUNRWWFOVd1ZTlbe1dVnkahgeC0ZbOBKQNdQTk7bwQkjcDn7z-IIyWnGQtRQFnWVeR4SxtLEo5THuLRgF2566ynTpRUc042teekbSrAyN5T2eG8o46F1UnKnqhIO3pjaKsKbOkKO3KBJSlbRnjsspEmZRgrCVTEpA2VBOQt7MnJG8GPnl9osyZk7SljrO0qxfO8sbeOEx7i1GAotq_XFlvMX78A8l6iw1nWW9xylnaW1xymPc2utAU1L54__G_0z4OHwn66s8fCf6au4_Ix1f699FW-2JxLTtrT4viVC3-OO5PD0M4jU1yefvPUHv_pj_8C5Lk-x_68U-BZMc8L9hYsr9SvYALCd-zvaCrXzQkfEE2SI65WpBPSEYKeERwSNgCvPwCMfkL9CpQ9XV-E6j2Qt8Fqb1S7-6AshGQJaFact8LyKq7FFPbAVlX6HVu4pWllV56z76yrJn5jUMKloVPEy3C1kAWH-eKP-wOZPXdOG2DIGuuvGbuXf3Gy6be0feJ36S9m_7dTLlZkHTI6eFJLPmY84nGF5wfn9KyoOIF6oPAb0SB8-VAFjypBWrXR7VEbfyilui9X9Uavf1voubDN3KJvyu41nogdXK-n8sCaZT7NV1WSKfcb-uyQlr18Uu75KVU7nd3WSGtcr_CywqpFXyTlyVSq27mz15w10puNCR95bTa9TfOqz2_c17tOPR4gdpvGGLB5AcdxgqudRwWSoHWclgpBXrPjVKhN_2EFRNP8PBIYbVhIdDk8zsUBk0_vkNh0PTTOxQGTT-8IyHQ3LM7EgbNPbojIdHskzsSGs0-uKO7SHKTIumG02rXT5xXez5yXu_4wgv0fq9YMDnJ0TcFVzt-Vwq0lo2nFKg9m1CpUJs2MVZMTLIpKKw1bIRAk5NshEHTk2yEQdOTbIRB05NshEBzk2yEQXOTbIREs5NshEazkxxLkT5ucCQvNXL3OLJCaATbHFkhXMKdjiwRPuFmR5bcnbrvdyT15FJql0eXU3u7uJze0dUF3T7mtz_e0g_J-sf_jfVP9Bvrn-R31j-731r_2E-vf9pPr3-eP7v-OX12_fP18-uf2-fXP6-fXv98__z65-7Ap9c_kVoytf65S_F765-dXje3qLB66dSyop35jer653mixdn1z2mueHL9czfu8-ufG6-Ze1dfednUO_p94jep65-7mZ9Z_0ScVhchCefVLciO8_oKxPICff_RioKZ9c-zWqB2fVJL1Ma_qiV67ze1Rm__VdRMrn--K7i6EZA6zawEpFFz6x_p1Nz6R1o1vf6RUs2tf6RVc-sfqdXs-kdqNbv-uWv1mfXPjdNq16-cV3v-znl9O-DzAn09EGHB9PonUXB1G7JTCtR9iFUK9J5bpUJv-hkrptY_JwqrDQuBptc_wqCZ9Y8waGb9IwyaWf8IgWbXP8Kg2fWPkGh-_SM0ml__3EX6zPqn5bTa9TPn1Z5PnNc7_soL9H5vWDC9_nlVcLXj70qBuhvwlQJ9NRApFfpOJMGKqfXPjsLqNkQINL3-EQbNrH-EQTPrH2HQzPpHCDS7_hEGza5_hETz6x-h0fz6R4o0vf6RGs2tf4RGs-sf4dL8-kf4NL_-uTs1tf55dim1y5PLqb19dTm9o5sL4vrnx5dh_fPHpbO17a4PP-8wPFzL1h7t46Iquud--XP_keNCEW-w9T_zzr0BN95iQO47cOMxBuASD7jxGgNyAXDjOQbkIuDGewzIxcCNBxmQS4EbLzIgtwNuPMmAXAXceJMBuRq54SgDci1yw1UG5J4E159lQO6A3HCXAbmT-Hn9YQbkLoLrLzMg14l--9MMyN2QG24zIEd8pp-b9Lm_zoCc9HnDfE6lz_19BuSkzxvmfSp97i80ICd97k80ICd97m80ICd97o80ICd97q80ICd97s80ICd97u80ICd97g81ICd97i81ICd97k81ICd97m81ICd97o81IEd8jonPKfE5ZZ8beT6viM8p-jwebACuED4PFxuQEz4PJxuQQ5_Hmw3ICZ-How3ICZ-Hqw3ICZ-Hsw3ICZ-Huw3ICZ-Hww3ICZ-Hyw3ICZ-H0w3ICZ-H2w3ICZ-H4w3ICZ-H6w3IkedzSnwupM_9_QbkhM_DAQfk0OfxggNy6PN4wgG4Hfo83nBADn0ejzgghz6PVxyQQ5_HMw7Ioc_jHQfk0OfxkANy6PN4yQE59Hk85YAc-jzeckAOfR6POSCHPo_XHJBDn8dzDsihz-M9B-TQ5_GgA3LC5-GiA3LC5-GkA3LC5-GmA3LC5-GoA3Al-jxedUAOfR7POiCHPo93HZBDn8fDDsihz-NlB-TQ5_G0A3Lo83jbATn0eTzugBz6PF53QA59Hs87IIc-j_cdkEOfxwMPyKHP44UH5ITPw4kH5ITPw40H5Eaf6X0-hN8YrCTD8juDlXhYeQxWMmIVMFgJilXEYCUtVjGDlchYpQxWcmO1Y7ASHquKwUqCrGoK8xhZtRTmWbJ64jANlNWBwjxVVif-k2m0rC4cpvmy6vi7QUNmdaMwT5qVNin041YmhWbOSpkUGjytMik0fVplUmgEtcqk0BxqlUmhYdQqk0ITqVUmhcZSq0wKzaZWmRQaUK0yKTSlWmVSaFS1yqTQvGqVSaGh1SqTQpOrVSaFxlerTQrLsFabFBZkrfY3haVZSydFibQ1nxSea2s-KTzc1nRSlIRb80nhMbfmk8Kzbs0nhQfemk8KT701nxQefWs-KTz_1nxSeAiu-aTwJFzzSeFxuOaTwjNxrf1NYcG4ViaFpuOaTwqPyDWdFCUn13RSlLDc0ElREnNDJ0WJzQ2dFCU7N3RSlADd0ElRUnRDJ0WJ0g2dFCVPN3RSlFDd0ElRknVDJ0WJ1w2dFCVjN3RSlKDd0ElR0nZDJ0WJ3A2fFJ67Gz4pPHw3fFJ4Am_4pPAY3tJJUbJ4SydFCeQtnRQllbd0UpRo3tJJUfJ5SydFCektnRQlqbd0UpS43tJJUTJ7SydFCe4tnRQlvbd0UpQI39JJUXJ8yyeFh_mWT8qHRP_j__OspDh2awAA\"}!../../../../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.25_webpack@5.104.1/node_modules/@vanilla-extract/webpack-plugin/extracted.js";
-import "src/styles/theme.css.ts.vanilla.css!=!../../../../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.25_webpack@5.104.1/node_modules/@vanilla-extract/webpack-plugin/virtualFileLoader/dist/vanilla-extract-webpack-plugin-virtualFileLoader.cjs.js?{\"fileName\":\"src/styles/theme.css.ts.vanilla.css\",\"source\":\"QGxheWVyIHRoZW1lOwpib2R5IHsKICBmb250LWZhbWlseTogJ0ludGVyJywgc2Fucy1zZXJpZjsKfQpoMSwgaDIsIGgzLCBoNCwgaDUsIGg2IHsKICBmb250LWZhbWlseTogJ1BvcHBpbnMnLCBzYW5zLXNlcmlmOwp9CkBsYXllciB0aGVtZSB7CiAgOnJvb3QgewogICAgLS1fNGxzaGd6MDogIzJBMjkyRTsKICAgIC0tXzRsc2hnejE6ICM3OTc0ODY7CiAgICAtLV80bHNoZ3oyOiAjQTVBMkFFOwogICAgLS1fNGxzaGd6MzogI0Y1RkFGRTsKICAgIC0tXzRsc2hnejQ6ICMwMjEwMUQ7CiAgICAtLV80bHNoZ3o1OiAjMDQ2NEJFOwogICAgLS1fNGxzaGd6NjogIzAxODFGOTsKICAgIC0tXzRsc2hnejc6ICNEREVFRkQ7CiAgICAtLV80bHNoZ3o4OiAjQTZEM0ZDOwogICAgLS1fNGxzaGd6OTogI0MzQ0RERjsKICAgIC0tXzRsc2hnemE6ICNFOEVDRjM7CiAgICAtLV80bHNoZ3piOiAjRjhGQUZCOwogICAgLS1fNGxzaGd6YzogI0Y4RkFGQjsKICAgIC0tXzRsc2hnemQ6ICNGNUZDRkU7CiAgICAtLV80bHNoZ3plOiAjMDFDM0Y5OwogICAgLS1fNGxzaGd6ZjogIzA0NDI1MzsKICAgIC0tXzRsc2hnemc6ICNGNUY5RkU7CiAgICAtLV80bHNoZ3poOiAjMDQ2REY2OwogICAgLS1fNGxzaGd6aTogIzA1MjY1MjsKICAgIC0tXzRsc2hnemo6ICNGOEZBRkI7CiAgICAtLV80bHNoZ3prOiAjNTQ3MkE2OwogICAgLS1fNGxzaGd6bDogIzFFMjgzODsKICAgIC0tXzRsc2hnem06ICNGNUZBRkU7CiAgICAtLV80bHNoZ3puOiAjMDE4MUY5OwogICAgLS1fNGxzaGd6bzogIzA0MkQ1MzsKICAgIC0tXzRsc2hnenA6ICNGOEZBRkI7CiAgICAtLV80bHNoZ3pxOiAjQzNDRERGOwogICAgLS1fNGxzaGd6cjogIzAxODFGOTsKICAgIC0tXzRsc2hnenM6ICNBNUEyQUU7CiAgICAtLV80bHNoZ3p0OiAjRThFQ0YzOwogICAgLS1fNGxzaGd6dTogJ0ludGVyJywgc2Fucy1zZXJpZjsKICAgIC0tXzRsc2hnenY6ICdQb3BwaW5zJywgc2Fucy1zZXJpZjsKICB9Cn0\"}!../../../../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.25_webpack@5.104.1/node_modules/@vanilla-extract/webpack-plugin/extracted.js";
-import "src/components/Pagination/styles.css.ts.vanilla.css!=!../../../../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.25_webpack@5.104.1/node_modules/@vanilla-extract/webpack-plugin/virtualFileLoader/dist/vanilla-extract-webpack-plugin-virtualFileLoader.cjs.js?{\"fileName\":\"src/components/Pagination/styles.css.ts.vanilla.css\",\"source\":\"QGxheWVyIGNvbXBvbmVudHM7Ci5fMTB0ejQ3bjIgewogIGNvbG9yOiB2YXIoLS1fNGxzaGd6MCk7Cn0KLl8xMHR6NDduMjpob3ZlciB7CiAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tXzRsc2hnejgpOwp9Ci5fMTB0ejQ3bjMgewogIGJhY2tncm91bmQtY29sb3I6IHZhcigtLV80bHNoZ3o1KTsKICBjb2xvcjogdmFyKC0tXzRsc2hnejMpOwogIGJvcmRlci1jb2xvcjogdmFyKC0tXzRsc2hnejUpOwp9Ci5fMTB0ejQ3bjM6aG92ZXIgewogIGJhY2tncm91bmQtY29sb3I6IHZhcigtLV80bHNoZ3o2KTsKfQpAbGF5ZXIgY29tcG9uZW50cyB7CiAgLl8xMHR6NDduMCB7CiAgICBkaXNwbGF5OiBmbGV4OwogICAgYWxpZ24taXRlbXM6IGNlbnRlcjsKICAgIGdhcDogMC41cmVtOwogIH0KICAuXzEwdHo0N24xIHsKICAgIHBhZGRpbmc6IDAuNXJlbSAwLjc1cmVtOwogICAgYm9yZGVyLXJhZGl1czogMC41cmVtOwogICAgYm9yZGVyOiAxcHggc29saWQgdmFyKC0tXzRsc2hnejkpOwogICAgYmFja2dyb3VuZC1jb2xvcjogdHJhbnNwYXJlbnQ7CiAgICBjdXJzb3I6IHBvaW50ZXI7CiAgICBtaW4td2lkdGg6IDIuNXJlbTsKICAgIGRpc3BsYXk6IGZsZXg7CiAgICBhbGlnbi1pdGVtczogY2VudGVyOwogICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7CiAgfQogIC5fMTB0ejQ3bjE6ZGlzYWJsZWQgewogICAgY3Vyc29yOiBub3QtYWxsb3dlZDsKICAgIG9wYWNpdHk6IDAuNTsKICB9CiAgLl8xMHR6NDduNCB7CiAgICBwYWRkaW5nOiAwLjVyZW07CiAgICBjb2xvcjogdmFyKC0tXzRsc2hnejApOwogICAgdXNlci1zZWxlY3Q6IG5vbmU7CiAgfQp9\"}!../../../../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.25_webpack@5.104.1/node_modules/@vanilla-extract/webpack-plugin/extracted.js";
-var pageButtonVariants = {
-    default: '_10tz47n2',
-    active: '_10tz47n3'
-};
-var pageButton = '_10tz47n1';
-var paginationContainer = '_10tz47n0';
-var ellipsis = '_10tz47n4';
-export { ellipsis, pageButton, pageButtonVariants, paginationContainer };
+import { styleVariants } from '@vanilla-extract/css';
+import { vars } from '../../styles/theme.css';
+import { styleWithLayer } from '../../styles/utils';
+export const paginationContainer = styleWithLayer({
+    display: 'flex',
+    alignItems: 'center',
+    gap: '0.5rem',
+});
+export const pageButton = styleWithLayer({
+    padding: '0.5rem 0.75rem',
+    borderRadius: '0.5rem',
+    border: `1px solid ${vars.colors.borderDefault}`,
+    backgroundColor: 'transparent',
+    cursor: 'pointer',
+    minWidth: '2.5rem',
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    ':disabled': {
+        cursor: 'not-allowed',
+        opacity: 0.5,
+    },
+});
+export const pageButtonVariants = styleVariants({
+    default: {
+        color: vars.colors.textPrimary,
+        ':hover': {
+            backgroundColor: vars.colors.buttonBackgroundSecondary,
+        },
+    },
+    active: {
+        backgroundColor: vars.colors.buttonBackgroundPrimary,
+        color: vars.colors.buttonTextPrimary,
+        borderColor: vars.colors.buttonBackgroundPrimary,
+        ':hover': {
+            backgroundColor: vars.colors.buttonBackgroundFocusedPrimary,
+        },
+    },
+});
+export const ellipsis = styleWithLayer({
+    padding: '0.5rem',
+    color: vars.colors.textPrimary,
+    userSelect: 'none',
+});

package/dist/components/Popover/Popover.d.ts

@@ -14,5 +14,5 @@ export interface PopoverProps extends React.HTMLAttributes<HTMLDivElement> {
     defaultOpen?: boolean;
     onOpenChange?: (isOpen: boolean) => void;
 }
-declare const Popover: ({ trigger, children, position, title, footer, showArrow, triggerType, closeOnClickOutside, closeOnEscape, defaultOpen, onOpenChange, className, ...props }: PopoverProps) => React.JSX.Element;
+declare const Popover: ({ trigger, children, position, title, footer, showArrow, triggerType, closeOnClickOutside, closeOnEscape, defaultOpen, onOpenChange, className, ...props }: PopoverProps) => import("react/jsx-runtime").JSX.Element;
 export default Popover;

package/dist/components/Popover/Popover.js

@@ -1,105 +1,55 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import clsx from "clsx";
-import { useEffect, useRef, useState } from "react";
-import { popoverArrow, popoverArrowPositionVariants, popoverBody, popoverCloseButton, popoverContainer, popoverContent, popoverFooter, popoverHeader, popoverPositionVariants, popoverTitle, popoverTrigger } from "./styles.css.js";
-import Box from "../Box/index.js";
-const Popover = ({ trigger, children, position = 'bottom', title, footer, showArrow = true, triggerType = 'click', closeOnClickOutside = true, closeOnEscape = true, defaultOpen = false, onOpenChange, className, ...props })=>{
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import clsx from 'clsx';
+import { useState, useRef, useEffect } from 'react';
+import { popoverContainer, popoverTrigger, popoverContent, popoverPositionVariants, popoverArrow, popoverArrowPositionVariants, popoverHeader, popoverTitle, popoverCloseButton, popoverBody, popoverFooter, } from './styles.css';
+import Box from '../Box';
+const Popover = ({ trigger, children, position = 'bottom', title, footer, showArrow = true, triggerType = 'click', closeOnClickOutside = true, closeOnEscape = true, defaultOpen = false, onOpenChange, className, ...props }) => {
     const [isOpen, setIsOpen] = useState(defaultOpen);
     const containerRef = useRef(null);
-    useEffect(()=>{
+    useEffect(() => {
         onOpenChange?.(isOpen);
-    }, [
-        isOpen,
-        onOpenChange
-    ]);
-    useEffect(()=>{
-        if (!closeOnClickOutside) return;
-        const handleClickOutside = (event)=>{
-            if (containerRef.current && !containerRef.current.contains(event.target)) setIsOpen(false);
+    }, [isOpen, onOpenChange]);
+    useEffect(() => {
+        if (!closeOnClickOutside)
+            return;
+        const handleClickOutside = (event) => {
+            if (containerRef.current && !containerRef.current.contains(event.target)) {
+                setIsOpen(false);
+            }
         };
-        if (isOpen) document.addEventListener('mousedown', handleClickOutside);
-        return ()=>{
+        if (isOpen) {
+            document.addEventListener('mousedown', handleClickOutside);
+        }
+        return () => {
             document.removeEventListener('mousedown', handleClickOutside);
         };
-    }, [
-        isOpen,
-        closeOnClickOutside
-    ]);
-    useEffect(()=>{
-        if (!closeOnEscape) return;
-        const handleEscape = (e)=>{
-            if ('Escape' === e.key && isOpen) setIsOpen(false);
+    }, [isOpen, closeOnClickOutside]);
+    useEffect(() => {
+        if (!closeOnEscape)
+            return;
+        const handleEscape = (e) => {
+            if (e.key === 'Escape' && isOpen) {
+                setIsOpen(false);
+            }
         };
         document.addEventListener('keydown', handleEscape);
-        return ()=>document.removeEventListener('keydown', handleEscape);
-    }, [
-        isOpen,
-        closeOnEscape
-    ]);
-    const handleTriggerClick = ()=>{
-        if ('click' === triggerType) setIsOpen(!isOpen);
+        return () => document.removeEventListener('keydown', handleEscape);
+    }, [isOpen, closeOnEscape]);
+    const handleTriggerClick = () => {
+        if (triggerType === 'click') {
+            setIsOpen(!isOpen);
+        }
     };
-    const handleTriggerMouseEnter = ()=>{
-        if ('hover' === triggerType) setIsOpen(true);
+    const handleTriggerMouseEnter = () => {
+        if (triggerType === 'hover') {
+            setIsOpen(true);
+        }
     };
-    const handleTriggerMouseLeave = ()=>{
-        if ('hover' === triggerType) setIsOpen(false);
+    const handleTriggerMouseLeave = () => {
+        if (triggerType === 'hover') {
+            setIsOpen(false);
+        }
     };
-    return /*#__PURE__*/ jsxs(Box, {
-        ref: containerRef,
-        className: clsx(popoverContainer, className),
-        onMouseEnter: handleTriggerMouseEnter,
-        onMouseLeave: handleTriggerMouseLeave,
-        ...props,
-        children: [
-            /*#__PURE__*/ jsx(Box, {
-                className: popoverTrigger,
-                onClick: handleTriggerClick,
-                "aria-expanded": isOpen,
-                children: trigger
-            }),
-            isOpen && /*#__PURE__*/ jsxs(Box, {
-                className: clsx(popoverContent, popoverPositionVariants[position]),
-                role: "dialog",
-                "aria-modal": "false",
-                children: [
-                    showArrow && /*#__PURE__*/ jsx(Box, {
-                        as: "span",
-                        className: clsx(popoverArrow, popoverArrowPositionVariants[position])
-                    }),
-                    (title || 'click' === triggerType) && /*#__PURE__*/ jsxs(Box, {
-                        as: "div",
-                        className: popoverHeader,
-                        children: [
-                            title && /*#__PURE__*/ jsx(Box, {
-                                as: "h3",
-                                className: popoverTitle,
-                                children: title
-                            }),
-                            'click' === triggerType && /*#__PURE__*/ jsx(Box, {
-                                as: "button",
-                                className: popoverCloseButton,
-                                onClick: ()=>setIsOpen(false),
-                                "aria-label": "Close popover",
-                                type: "button",
-                                children: "\xd7"
-                            })
-                        ]
-                    }),
-                    /*#__PURE__*/ jsx(Box, {
-                        as: "div",
-                        className: popoverBody,
-                        children: children
-                    }),
-                    footer && /*#__PURE__*/ jsx(Box, {
-                        as: "div",
-                        className: popoverFooter,
-                        children: footer
-                    })
-                ]
-            })
-        ]
-    });
+    return (_jsxs(Box, { ref: containerRef, className: clsx(popoverContainer, className), onMouseEnter: handleTriggerMouseEnter, onMouseLeave: handleTriggerMouseLeave, ...props, children: [_jsx(Box, { className: popoverTrigger, onClick: handleTriggerClick, "aria-expanded": isOpen, children: trigger }), isOpen && (_jsxs(Box, { className: clsx(popoverContent, popoverPositionVariants[position]), role: "dialog", "aria-modal": "false", children: [showArrow && (_jsx(Box, { as: "span", className: clsx(popoverArrow, popoverArrowPositionVariants[position]) })), (title || triggerType === 'click') && (_jsxs(Box, { as: "div", className: popoverHeader, children: [title && (_jsx(Box, { as: "h3", className: popoverTitle, children: title })), triggerType === 'click' && (_jsx(Box, { as: "button", className: popoverCloseButton, onClick: () => setIsOpen(false), "aria-label": "Close popover", type: "button", children: "\u00D7" }))] })), _jsx(Box, { as: "div", className: popoverBody, children: children }), footer && (_jsx(Box, { as: "div", className: popoverFooter, children: footer }))] }))] }));
 };
-const Popover_Popover = Popover;
-export { Popover_Popover as default };
+export default Popover;

package/dist/components/Popover/index.js

@@ -1,2 +1 @@
-import Popover from "./Popover.js";
-export { Popover };
+export { default as Popover } from './Popover';

package/dist/components/Popover/styles.css.d.ts

@@ -1,9 +1,9 @@
 export declare const popoverContainer: string;
 export declare const popoverTrigger: string;
 export declare const popoverContent: string;
-export declare const popoverPositionVariants: Record<"bottom" | "left" | "right" | "top" | "bottomLeft" | "bottomRight" | "topLeft" | "topRight", string>;
+export declare const popoverPositionVariants: Record<"bottom" | "left" | "right" | "top" | "topLeft" | "topRight" | "bottomLeft" | "bottomRight", string>;
 export declare const popoverArrow: string;
-export declare const popoverArrowPositionVariants: Record<"bottom" | "left" | "right" | "top" | "bottomLeft" | "bottomRight" | "topLeft" | "topRight", string>;
+export declare const popoverArrowPositionVariants: Record<"bottom" | "left" | "right" | "top" | "topLeft" | "topRight" | "bottomLeft" | "bottomRight", string>;
 export declare const popoverHeader: string;
 export declare const popoverTitle: string;
 export declare const popoverCloseButton: string;

package/dist/components/Popover/styles.css.js

@@ -1,33 +1,185 @@
-import "src/styles/sprinkles.css.ts.vanilla.css!=!../../../../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.25_webpack@5.104.1/node_modules/@vanilla-extract/webpack-plugin/virtualFileLoader/dist/vanilla-extract-webpack-plugin-virtualFileLoader.cjs.js?{\"fileName\":\"src/styles/sprinkles.css.ts.vanilla.css\",\"source\":\"#H4sIAAAAAAAAA5Wc227jVhJF3_srBAwGyDw4EG-HpPMSSpR-Y0CRh6Rs3ZqS23YP-t8HaZItn127SDfylqyyVdIqWrsC1N-H4t12i_J8vJxP9nS7_vXlz_9678H1W3eMXxb_-7JYlOfDuXtc_GsbbbPt5q8vPz4Qrw6R55vNNneJd4dYbfPtdu0QydIhMpMHSPgOkSTrEInQIcxmFSNhHCIKsxUSiUMEYbqGbpPCIbwsXW63LlE6xNJLvG3qEtYlgjjM3XcsaVwiNOEKXsceiCjOQpd4dokozJLMJY7wM4LMwPtxBsLPo8AlvkIvXh5ELnF1Cd9betCtcEy86-jY1oBjCTq2QcdSdGyTIoGObdDCFB3LcyTQsTxBAh3Lfeg2RcfWOTiWomPrABxL0bFsA46l6FhqwLEUHUs8cCxFx0wOjqXoWBSBYyk6FvrgWIqO-Rk4lgrHYnAsFY6l-K6L59gKHEtdx9bLPIPPtgDH4vV6u3IJcCxdZUi4jsXLTPwMcMykORLgmEnW-ErBsXWcQ7cFOBaafGtcAhwzxs_hdYBjJopW8DrAMRNmme8S4JgJtkniEkckPAOvAxyLfBPBbxHPsRQcK9Cx5caDXsCxZCs-W9exTbJZb13XC9exPMxXG7fbnevYOljnuft02LmOZdtVnru97FzH0n9Edj_9netYkmfe2p39netYHKfLldvtznXMmMRfue_6znUsCmM_cx3buY6FaxOn8Dpcx0I_SpOlS7iOBVmYG3f2d65jgRd6ERCuY34chKH7xN25jnkbPwngk3Md80Iv86EXcGy13HhAgGPZP_-4BDiWb9Yb6AUcy_P1xn3HStexfLne5O7rKF3H1svVZu1-cqXr2CpYLVfuKy1dx7Io8zP3lZauY6lJ_QxeqetYkiYh-FG6jsVpHCbwSl3HTG6S2P3kStexaBNlBgjXscgLNxF06zoWRqEfus-P0nUsiIMocCeqdB3zMz_14R0Dx1Ze5gEBjm2XGw_e096xXVE-N9355VTxL_7lq8TIt__yXWIkAlRLiZEcUPkSI2GgCiVGEkFlJEZiQZVIjGSDqpAYCQhVKTGSEipLMBkVqoZgMi9Ue4aJ0FA9E0wmh-rIfpqID9WZYSJDVF9ZpyJIVFeCyTRRcXvFh0XtFbmiovaKcGGpvSJhWGqviBmW2iuyhqX2isBhqb0idVhqr4geltor8oel9ooQYqm9IolYaq-II5baKzKJpfaKYGKpvSKdWGqviCiW24s5xXJ7MaxY_uzFxGKJvSS21MxemV1qZq8MMDWxl6SYmtkro0zN7JV5pmb2ylBTM3tlsqmZvTLe1MxemXFqZq8MOjWzV6admtkrI0_N7JW5p-bPXgw_NbVXJKCa2StjUE3sJVmoJvaSQNQQe0kqaoi9JBo1xF6SjxpiLwlJDbGXJKWG2EviUkPsJZmpIfaS4NQQe0l6aoi9JEI1xF6SoxpiLwlTDbGXJKqG2EtiVcPsldmqYfbKgNUwe2XKapi9Mmq1xF6St1piLwldLbGXJK-W2EviV0vsJRmsJfaSINYSe0kaa4m9JJK1xF6Sy1piLwlnLbGXJLSW2EtiWkvsJVmtZfbKwNYye3-ltr_xf978hH8V93YtFtX-ejkU74-L0_lk__qyWPz4SAVI1Qf7JiiD1O5wLp8FliK2Px325JeWA_e6r27t46J4uZ0FU7uMt1z-WzB7l4kIcnARP5LIeUBau2_am_JyOoDo63kBiL2gN2DYK_LGz-6fD-Oh2ne2vO3Pp8dFd36VcKDA5fnwcjxJfvwwn16ut339_lCeTzd7uj0urrfO3spWVqRaxc9feb0V3U0WlVpRaU8328mCevK32FMlS_ZqK5eitA_Fz6GRZYfpsp29vVpL3rnRlOKwb04P-5s9XifetY7RU-_YCyvQ3q039aezd8ofjboUVbU_NQ-38-VxsZRcwLjwIh8JvmFkwsiUkZ5haMlQOpB-DejufLudj7SpvYLSvg4KTFs7KzDvrlNo3uAL0Adb32h7bxRkzQWoQY-y1gI0oUdpYwG60LO0rQBt6PrnoOwrQBkGkjaGNgws7Qx1GFjeGurQTfyRCEYdjkXX7E_qJxZ0jKN9vTCSdvXGSNpTuGQo7SgMXFT9sEJDQdZTmFKUNRWWFOVd1ZTlbe1dVnkahgeC0ZbOBKQNdQTk7bwQkjcDn7z-IIyWnGQtRQFnWVeR4SxtLEo5THuLRgF2566ynTpRUc042teekbSrAyN5T2eG8o46F1UnKnqhIO3pjaKsKbOkKO3KBJSlbRnjsspEmZRgrCVTEpA2VBOQt7MnJG8GPnl9osyZk7SljrO0qxfO8sbeOEx7i1GAotq_XFlvMX78A8l6iw1nWW9xylnaW1xymPc2utAU1L54__G_0z4OHwn66s8fCf6au4_Ix1f699FW-2JxLTtrT4viVC3-OO5PD0M4jU1yefvPUHv_pj_8C5Lk-x_68U-BZMc8L9hYsr9SvYALCd-zvaCrXzQkfEE2SI65WpBPSEYKeERwSNgCvPwCMfkL9CpQ9XV-E6j2Qt8Fqb1S7-6AshGQJaFact8LyKq7FFPbAVlX6HVu4pWllV56z76yrJn5jUMKloVPEy3C1kAWH-eKP-wOZPXdOG2DIGuuvGbuXf3Gy6be0feJ36S9m_7dTLlZkHTI6eFJLPmY84nGF5wfn9KyoOIF6oPAb0SB8-VAFjypBWrXR7VEbfyilui9X9Uavf1voubDN3KJvyu41nogdXK-n8sCaZT7NV1WSKfcb-uyQlr18Uu75KVU7nd3WSGtcr_CywqpFXyTlyVSq27mz15w10puNCR95bTa9TfOqz2_c17tOPR4gdpvGGLB5AcdxgqudRwWSoHWclgpBXrPjVKhN_2EFRNP8PBIYbVhIdDk8zsUBk0_vkNh0PTTOxQGTT-8IyHQ3LM7EgbNPbojIdHskzsSGs0-uKO7SHKTIumG02rXT5xXez5yXu_4wgv0fq9YMDnJ0TcFVzt-Vwq0lo2nFKg9m1CpUJs2MVZMTLIpKKw1bIRAk5NshEHTk2yEQdOTbIRB05NshEBzk2yEQXOTbIREs5NshEazkxxLkT5ucCQvNXL3OLJCaATbHFkhXMKdjiwRPuFmR5bcnbrvdyT15FJql0eXU3u7uJze0dUF3T7mtz_e0g_J-sf_jfVP9Bvrn-R31j-731r_2E-vf9pPr3-eP7v-OX12_fP18-uf2-fXP6-fXv98__z65-7Ap9c_kVoytf65S_F765-dXje3qLB66dSyop35jer653mixdn1z2mueHL9czfu8-ufG6-Ze1dfednUO_p94jep65-7mZ9Z_0ScVhchCefVLciO8_oKxPICff_RioKZ9c-zWqB2fVJL1Ma_qiV67ze1Rm__VdRMrn--K7i6EZA6zawEpFFz6x_p1Nz6R1o1vf6RUs2tf6RVc-sfqdXs-kdqNbv-uWv1mfXPjdNq16-cV3v-znl9O-DzAn09EGHB9PonUXB1G7JTCtR9iFUK9J5bpUJv-hkrptY_JwqrDQuBptc_wqCZ9Y8waGb9IwyaWf8IgWbXP8Kg2fWPkGh-_SM0ml__3EX6zPqn5bTa9TPn1Z5PnNc7_soL9H5vWDC9_nlVcLXj70qBuhvwlQJ9NRApFfpOJMGKqfXPjsLqNkQINL3-EQbNrH-EQTPrH2HQzPpHCDS7_hEGza5_hETz6x-h0fz6R4o0vf6RGs2tf4RGs-sf4dL8-kf4NL_-uTs1tf55dim1y5PLqb19dTm9o5sL4vrnx5dh_fPHpbO17a4PP-8wPFzL1h7t46Iquud--XP_keNCEW-w9T_zzr0BN95iQO47cOMxBuASD7jxGgNyAXDjOQbkIuDGewzIxcCNBxmQS4EbLzIgtwNuPMmAXAXceJMBuRq54SgDci1yw1UG5J4E159lQO6A3HCXAbmT-Hn9YQbkLoLrLzMg14l--9MMyN2QG24zIEd8pp-b9Lm_zoCc9HnDfE6lz_19BuSkzxvmfSp97i80ICd97k80ICd97m80ICd97o80ICd97q80ICd97s80ICd97u80ICd97g81ICd97i81ICd97k81ICd97m81ICd97o81IEd8jonPKfE5ZZ8beT6viM8p-jwebACuED4PFxuQEz4PJxuQQ5_Hmw3ICZ-How3ICZ-Hqw3ICZ-Hsw3ICZ-Huw3ICZ-Hww3ICZ-Hyw3ICZ-H0w3ICZ-H2w3ICZ-H4w3ICZ-H6w3IkedzSnwupM_9_QbkhM_DAQfk0OfxggNy6PN4wgG4Hfo83nBADn0ejzgghz6PVxyQQ5_HMw7Ioc_jHQfk0OfxkANy6PN4yQE59Hk85YAc-jzeckAOfR6POSCHPo_XHJBDn8dzDsihz-M9B-TQ5_GgA3LC5-GiA3LC5-GkA3LC5-GmA3LC5-GoA3Al-jxedUAOfR7POiCHPo93HZBDn8fDDsihz-NlB-TQ5_G0A3Lo83jbATn0eTzugBz6PF53QA59Hs87IIc-j_cdkEOfxwMPyKHP44UH5ITPw4kH5ITPw40H5Eaf6X0-hN8YrCTD8juDlXhYeQxWMmIVMFgJilXEYCUtVjGDlchYpQxWcmO1Y7ASHquKwUqCrGoK8xhZtRTmWbJ64jANlNWBwjxVVif-k2m0rC4cpvmy6vi7QUNmdaMwT5qVNin041YmhWbOSpkUGjytMik0fVplUmgEtcqk0BxqlUmhYdQqk0ITqVUmhcZSq0wKzaZWmRQaUK0yKTSlWmVSaFS1yqTQvGqVSaGh1SqTQpOrVSaFxlerTQrLsFabFBZkrfY3haVZSydFibQ1nxSea2s-KTzc1nRSlIRb80nhMbfmk8Kzbs0nhQfemk8KT701nxQefWs-KTz_1nxSeAiu-aTwJFzzSeFxuOaTwjNxrf1NYcG4ViaFpuOaTwqPyDWdFCUn13RSlLDc0ElREnNDJ0WJzQ2dFCU7N3RSlADd0ElRUnRDJ0WJ0g2dFCVPN3RSlFDd0ElRknVDJ0WJ1w2dFCVjN3RSlKDd0ElR0nZDJ0WJ3A2fFJ67Gz4pPHw3fFJ4Am_4pPAY3tJJUbJ4SydFCeQtnRQllbd0UpRo3tJJUfJ5SydFCektnRQlqbd0UpS43tJJUTJ7SydFCe4tnRQlvbd0UpQI39JJUXJ8yyeFh_mWT8qHRP_j__OspDh2awAA\"}!../../../../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.25_webpack@5.104.1/node_modules/@vanilla-extract/webpack-plugin/extracted.js";
-import "src/styles/theme.css.ts.vanilla.css!=!../../../../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.25_webpack@5.104.1/node_modules/@vanilla-extract/webpack-plugin/virtualFileLoader/dist/vanilla-extract-webpack-plugin-virtualFileLoader.cjs.js?{\"fileName\":\"src/styles/theme.css.ts.vanilla.css\",\"source\":\"QGxheWVyIHRoZW1lOwpib2R5IHsKICBmb250LWZhbWlseTogJ0ludGVyJywgc2Fucy1zZXJpZjsKfQpoMSwgaDIsIGgzLCBoNCwgaDUsIGg2IHsKICBmb250LWZhbWlseTogJ1BvcHBpbnMnLCBzYW5zLXNlcmlmOwp9CkBsYXllciB0aGVtZSB7CiAgOnJvb3QgewogICAgLS1fNGxzaGd6MDogIzJBMjkyRTsKICAgIC0tXzRsc2hnejE6ICM3OTc0ODY7CiAgICAtLV80bHNoZ3oyOiAjQTVBMkFFOwogICAgLS1fNGxzaGd6MzogI0Y1RkFGRTsKICAgIC0tXzRsc2hnejQ6ICMwMjEwMUQ7CiAgICAtLV80bHNoZ3o1OiAjMDQ2NEJFOwogICAgLS1fNGxzaGd6NjogIzAxODFGOTsKICAgIC0tXzRsc2hnejc6ICNEREVFRkQ7CiAgICAtLV80bHNoZ3o4OiAjQTZEM0ZDOwogICAgLS1fNGxzaGd6OTogI0MzQ0RERjsKICAgIC0tXzRsc2hnemE6ICNFOEVDRjM7CiAgICAtLV80bHNoZ3piOiAjRjhGQUZCOwogICAgLS1fNGxzaGd6YzogI0Y4RkFGQjsKICAgIC0tXzRsc2hnemQ6ICNGNUZDRkU7CiAgICAtLV80bHNoZ3plOiAjMDFDM0Y5OwogICAgLS1fNGxzaGd6ZjogIzA0NDI1MzsKICAgIC0tXzRsc2hnemc6ICNGNUY5RkU7CiAgICAtLV80bHNoZ3poOiAjMDQ2REY2OwogICAgLS1fNGxzaGd6aTogIzA1MjY1MjsKICAgIC0tXzRsc2hnemo6ICNGOEZBRkI7CiAgICAtLV80bHNoZ3prOiAjNTQ3MkE2OwogICAgLS1fNGxzaGd6bDogIzFFMjgzODsKICAgIC0tXzRsc2hnem06ICNGNUZBRkU7CiAgICAtLV80bHNoZ3puOiAjMDE4MUY5OwogICAgLS1fNGxzaGd6bzogIzA0MkQ1MzsKICAgIC0tXzRsc2hnenA6ICNGOEZBRkI7CiAgICAtLV80bHNoZ3pxOiAjQzNDRERGOwogICAgLS1fNGxzaGd6cjogIzAxODFGOTsKICAgIC0tXzRsc2hnenM6ICNBNUEyQUU7CiAgICAtLV80bHNoZ3p0OiAjRThFQ0YzOwogICAgLS1fNGxzaGd6dTogJ0ludGVyJywgc2Fucy1zZXJpZjsKICAgIC0tXzRsc2hnenY6ICdQb3BwaW5zJywgc2Fucy1zZXJpZjsKICB9Cn0\"}!../../../../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.25_webpack@5.104.1/node_modules/@vanilla-extract/webpack-plugin/extracted.js";
-import "src/components/Popover/styles.css.ts.vanilla.css!=!../../../../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.25_webpack@5.104.1/node_modules/@vanilla-extract/webpack-plugin/virtualFileLoader/dist/vanilla-extract-webpack-plugin-virtualFileLoader.cjs.js?{\"fileName\":\"src/components/Popover/styles.css.ts.vanilla.css\",\"source\":\"#H4sIAAAAAAAAA7VW227iMBB95yvmpRJINXIo6SV96WfsPlVO4gQXx45sc-uKf1_FcYhzgdItKyEEY_vMmTNn4ryt6SFTpKAa3p8eHg4xw_BnApApWdgfALIkCTOHCPCr_W8UETqTqohAJ4TTKZ6_hLNq7TgBMLJ_LDhzLHBnjpM3Tg5UQSKLUgoqjH6dzB2bpUWLpTGyiCDA-K46xGlmIgjrPx6w_cmJob-mKMR3NkFBVM4EaiDwPFS0eJ0cTylCm8LI8kf49vwQ_NGCK5avTAtv915A_z1AdwBD_CeLX_P9d_j6_BD9eVT9hsxV6r5caOB1CGTYnxEGZ_SPzzX3irNphzoKy_13vAFKGmLodBmmNLdix1KlVNXZhBTUi9WgdbAlQFvyN8velNMj4BTtM8h8-zYcrvTXWQp-sWd4tQxyz-C3ItApdqwvbfrVqAeaebaG6XD4edPZBdf9l4QfQ5d9v77v2Wp9ztg3zzi4Wmzmhkfg7qpSamaYFBEoyolhW1rfWSnTJSeHCJjgTFAUc5msm5uuAVk4kGSjtFQRlJIJQ1V_28MgF4m15BvjcsUkWedKbkSKEskroC1RU4Tel1yv8s945rbZMiMIyj1oyVna3fbS2YYUSdlGVw-3p9BJW63tkV6RVO4iwLDA5R4WYbm3rQCVx2SK78F95sHsHjAE1Sb7NboJL13aT8RESvfVdNaBkqQpE3nbWYCCCbRjqVlFsMC47n71KN430WUbJYIVpFbr9HqC50GogRJNkdyYvszJFzK7HM9NhhWtDXMK3LYPl4zs0-aO9slxGaeNBpzlAjFDCx1BQhtvAXxstGHZASVSGCpMBLokCUUxNTtKRSNr73b1fOB6M77Ym7IzZZJBIc1bYyaFQRkpGD_0FNw6aewOzT6pbw4b3LmePGLnorFG4JlfobvQfSbCMWkb2j4s2v61kZNV8XzR6jAy1SPT5R34UQf9xbGigxHt_OT2KdVYOuhYoPuOd_KmG5K-66ua3JAxUc3ZPYzHB6pHK7mlaqD96DCR2Vf99aGlby1X_LIZ20sW6aoyD_vA5fnhy0nZFW3QsmovoiLtiO3eKEeGbbjiX9hfjNnxL5YXP1avDQAA\"}!../../../../../node_modules/.pnpm/@vanilla-extract+webpack-plugin@2.3.25_webpack@5.104.1/node_modules/@vanilla-extract/webpack-plugin/extracted.js";
-var popoverTrigger = '_733ybi2';
-var popoverCloseButton = '_733ybin';
-var popoverContainer = '_733ybi1';
-var popoverTitle = '_733ybim';
-var popoverContent = '_733ybi3';
-var popoverBody = '_733ybio';
-var popoverArrowPositionVariants = {
-    top: '_733ybid',
-    bottom: '_733ybie',
-    left: '_733ybif',
-    right: '_733ybig',
-    topLeft: '_733ybih',
-    topRight: '_733ybii',
-    bottomLeft: '_733ybij',
-    bottomRight: '_733ybik'
-};
-var popoverHeader = '_733ybil';
-var popoverPositionVariants = {
-    top: '_733ybi4',
-    bottom: '_733ybi5',
-    left: '_733ybi6',
-    right: '_733ybi7',
-    topLeft: '_733ybi8',
-    topRight: '_733ybi9',
-    bottomLeft: '_733ybia',
-    bottomRight: '_733ybib'
-};
-var popoverArrow = '_733ybic';
-var popoverFooter = '_733ybip';
-export { popoverArrow, popoverArrowPositionVariants, popoverBody, popoverCloseButton, popoverContainer, popoverContent, popoverFooter, popoverHeader, popoverPositionVariants, popoverTitle, popoverTrigger };
+import { styleVariants, keyframes } from '@vanilla-extract/css';
+import { vars } from '../../styles/theme.css';
+import { styleWithLayer } from '../../styles/utils';
+const fadeIn = keyframes({
+    from: { opacity: 0, transform: 'scale(0.95)' },
+    to: { opacity: 1, transform: 'scale(1)' },
+});
+export const popoverContainer = styleWithLayer({
+    position: 'relative',
+    display: 'inline-block',
+});
+export const popoverTrigger = styleWithLayer({
+    cursor: 'pointer',
+});
+export const popoverContent = styleWithLayer({
+    position: 'absolute',
+    backgroundColor: vars.colors.backgroundDefault,
+    border: `1px solid ${vars.colors.borderDefault}`,
+    borderRadius: '0.75rem',
+    boxShadow: '0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)',
+    zIndex: 50,
+    padding: '1rem',
+    minWidth: '200px',
+    maxWidth: '400px',
+    animation: `${fadeIn} 0.15s ease-out`,
+});
+export const popoverPositionVariants = styleVariants({
+    top: {
+        bottom: '100%',
+        left: '50%',
+        transform: 'translateX(-50%)',
+        marginBottom: '0.5rem',
+    },
+    bottom: {
+        top: '100%',
+        left: '50%',
+        transform: 'translateX(-50%)',
+        marginTop: '0.5rem',
+    },
+    left: {
+        right: '100%',
+        top: '50%',
+        transform: 'translateY(-50%)',
+        marginRight: '0.5rem',
+    },
+    right: {
+        left: '100%',
+        top: '50%',
+        transform: 'translateY(-50%)',
+        marginLeft: '0.5rem',
+    },
+    topLeft: {
+        bottom: '100%',
+        right: 0,
+        marginBottom: '0.5rem',
+    },
+    topRight: {
+        bottom: '100%',
+        left: 0,
+        marginBottom: '0.5rem',
+    },
+    bottomLeft: {
+        top: '100%',
+        right: 0,
+        marginTop: '0.5rem',
+    },
+    bottomRight: {
+        top: '100%',
+        left: 0,
+        marginTop: '0.5rem',
+    },
+});
+export const popoverArrow = styleWithLayer({
+    position: 'absolute',
+    width: '8px',
+    height: '8px',
+    backgroundColor: vars.colors.backgroundDefault,
+    border: `1px solid ${vars.colors.borderDefault}`,
+    transform: 'rotate(45deg)',
+});
+export const popoverArrowPositionVariants = styleVariants({
+    top: {
+        bottom: '-5px',
+        left: '50%',
+        transform: 'translateX(-50%) rotate(45deg)',
+        borderTop: 'none',
+        borderLeft: 'none',
+    },
+    bottom: {
+        top: '-5px',
+        left: '50%',
+        transform: 'translateX(-50%) rotate(45deg)',
+        borderBottom: 'none',
+        borderRight: 'none',
+    },
+    left: {
+        right: '-5px',
+        top: '50%',
+        transform: 'translateY(-50%) rotate(45deg)',
+        borderLeft: 'none',
+        borderBottom: 'none',
+    },
+    right: {
+        left: '-5px',
+        top: '50%',
+        transform: 'translateY(-50%) rotate(45deg)',
+        borderRight: 'none',
+        borderTop: 'none',
+    },
+    topLeft: {
+        bottom: '-5px',
+        right: '1rem',
+        transform: 'rotate(45deg)',
+        borderTop: 'none',
+        borderLeft: 'none',
+    },
+    topRight: {
+        bottom: '-5px',
+        left: '1rem',
+        transform: 'rotate(45deg)',
+        borderTop: 'none',
+        borderLeft: 'none',
+    },
+    bottomLeft: {
+        top: '-5px',
+        right: '1rem',
+        transform: 'rotate(45deg)',
+        borderBottom: 'none',
+        borderRight: 'none',
+    },
+    bottomRight: {
+        top: '-5px',
+        left: '1rem',
+        transform: 'rotate(45deg)',
+        borderBottom: 'none',
+        borderRight: 'none',
+    },
+});
+export const popoverHeader = styleWithLayer({
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'space-between',
+    marginBottom: '0.75rem',
+    paddingBottom: '0.75rem',
+    borderBottom: `1px solid ${vars.colors.borderMuted}`,
+});
+export const popoverTitle = styleWithLayer({
+    fontFamily: vars.fontFamily.heading,
+    fontSize: '1rem',
+    fontWeight: '600',
+    color: vars.colors.textPrimary,
+    margin: 0,
+});
+export const popoverCloseButton = styleWithLayer({
+    background: 'none',
+    border: 'none',
+    padding: '0.25rem',
+    cursor: 'pointer',
+    borderRadius: '0.25rem',
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    color: vars.colors.textSecondary,
+    fontSize: '1.25rem',
+    lineHeight: '1',
+    marginLeft: '0.5rem',
+    transition: 'background-color 0.2s ease-in-out, color 0.2s ease-in-out',
+    ':hover': {
+        backgroundColor: vars.colors.borderMuted,
+        color: vars.colors.textPrimary,
+    },
+});
+export const popoverBody = styleWithLayer({
+    fontSize: '14px',
+    color: vars.colors.textPrimary,
+    lineHeight: '1.5',
+});
+export const popoverFooter = styleWithLayer({
+    display: 'flex',
+    gap: '0.5rem',
+    justifyContent: 'flex-end',
+    marginTop: '0.75rem',
+    paddingTop: '0.75rem',
+    borderTop: `1px solid ${vars.colors.borderMuted}`,
+});

package/dist/components/Progress/Progress.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 type ProgressProps = {
     value: number;
     max?: number;
@@ -7,5 +6,5 @@ type ProgressProps = {
     variant?: 'default' | 'success' | 'warning' | 'error';
     className?: string;
 };
-declare const Progress: ({ value, max, label, showPercentage, variant, className, }: ProgressProps) => React.JSX.Element;
+declare const Progress: ({ value, max, label, showPercentage, variant, className, }: ProgressProps) => import("react/jsx-runtime").JSX.Element;
 export default Progress;

package/dist/components/Progress/Progress.js

@@ -1,55 +1,9 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import clsx from "clsx";
-import "react";
-import { progress, progressBar, progressFill, progressLabel } from "./styles.css.js";
-import Box from "../Box/index.js";
-const Progress = ({ value, max = 100, label, showPercentage = false, variant = 'default', className })=>{
-    const percentage = Math.min(Math.max(value / max * 100, 0), 100);
-    return /*#__PURE__*/ jsxs(Box, {
-        className: clsx(progress, className),
-        width: "100%",
-        children: [
-            (label || showPercentage) && /*#__PURE__*/ jsxs(Box, {
-                className: progressLabel,
-                display: "flex",
-                justifyContent: "space-between",
-                fontSize: "12px",
-                fontWeight: "500",
-                color: "c5-600",
-                marginBottom: "small",
-                fontFamily: "body",
-                children: [
-                    label && /*#__PURE__*/ jsx(Box, {
-                        as: "span",
-                        children: label
-                    }),
-                    showPercentage && /*#__PURE__*/ jsxs(Box, {
-                        as: "span",
-                        children: [
-                            percentage,
-                            "%"
-                        ]
-                    })
-                ]
-            }),
-            /*#__PURE__*/ jsx(Box, {
-                as: "div",
-                className: progressBar[variant],
-                role: "progressbar",
-                "aria-valuenow": value,
-                "aria-valuemin": 0,
-                "aria-valuemax": max,
-                children: /*#__PURE__*/ jsx(Box, {
-                    as: "div",
-                    className: progressFill[variant],
-                    style: {
-                        width: `${percentage}%`
-                    },
-                    role: "presentation"
-                })
-            })
-        ]
-    });
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import clsx from 'clsx';
+import { progress, progressBar, progressFill, progressLabel, } from './styles.css';
+import Box from '../Box';
+const Progress = ({ value, max = 100, label, showPercentage = false, variant = 'default', className, }) => {
+    const percentage = Math.min(Math.max((value / max) * 100, 0), 100);
+    return (_jsxs(Box, { className: clsx(progress, className), width: "100%", children: [(label || showPercentage) && (_jsxs(Box, { className: progressLabel, display: "flex", justifyContent: "space-between", fontSize: "12px", fontWeight: "500", color: "c5-600", marginBottom: "small", fontFamily: "body", children: [label && _jsx(Box, { as: "span", children: label }), showPercentage && _jsxs(Box, { as: "span", children: [percentage, "%"] })] })), _jsx(Box, { as: "div", className: progressBar[variant], role: "progressbar", "aria-valuenow": value, "aria-valuemin": 0, "aria-valuemax": max, children: _jsx(Box, { as: "div", className: progressFill[variant], style: { width: `${percentage}%` }, role: "presentation" }) })] }));
 };
-const Progress_Progress = Progress;
-export { Progress_Progress as default };
+export default Progress;

package/dist/components/Progress/index.js

@@ -1,2 +1 @@
-import Progress from "./Progress.js";
-export { Progress };
+export { default as Progress } from './Progress';