@shlinkio/shlink-frontend-kit 0.9.13 → 1.0.1

package/dist/tailwind.preset.css

@@ -7,43 +7,43 @@
 @theme static inline {
     /* Light mode */
     --color-lm-brand: #2078CF;
-    --color-lm-brand-dark: color-mix(in srgb, black 20%, var(--tw-color-lm-brand) 80%);
+    --color-lm-brand-dark: color-mix(in srgb, black 20%, var(--color-lm-brand) 80%);
     --color-lm-primary: #ffffff;
-    --color-lm-primary-alfa: rgb(var(--tw-color-lm-primary) / .5);
+    --color-lm-primary-alfa: rgb(var(--color-lm-primary) / .5);
     --color-lm-secondary: #eeeff8;
     --color-lm-text: #232323;
     --color-lm-border: rgb(0 0 0 / .125);
     --color-lm-table-border: #dee2e6;
     --color-lm-active: #eeeeee;
-    --color-lm-main: var(--tw-color-lm-brand);
-    --color-lm-input: var(--tw-color-lm-primary);
-    --color-lm-disabled-input: var(--tw-color-lm-secondary);
+    --color-lm-main: var(--color-lm-brand);
+    --color-lm-input: var(--color-lm-primary);
+    --color-lm-disabled-input: var(--color-lm-secondary);
     --color-lm-input-text: #495057;
     --color-lm-input-border: rgb(0 0 0 / .19);
     --color-lm-table-highlight: rgb(0 0 0 / .075);
 
     /* Dark mode */
     --color-dm-brand: #4696e5;
-    --color-dm-brand-dark: color-mix(in srgb, black 25%, var(--tw-color-dm-brand) 75%);
+    --color-dm-brand-dark: color-mix(in srgb, black 25%, var(--color-dm-brand) 75%);
     --color-dm-primary: #161b22;
-    --color-dm-primary-alfa: rgb(var(--tw-color-dm-primary) / .8);
+    --color-dm-primary-alfa: rgb(var(--color-dm-primary) / .8);
     --color-dm-secondary: #0f131a;
     --color-dm-text: rgb(201 209 217);
     --color-dm-border: rgb(255 255 255 / .15);
     --color-dm-table-border: #393d43;
-    --color-dm-active: var(--tw-color-dm-secondary);
+    --color-dm-active: var(--color-dm-secondary);
     --color-dm-main: #0b2d4e;
     --color-dm-input: rgb(17.9928571429 22.0821428571 27.8071428571);
     --color-dm-disabled-input: rgb(26.0071428571 31.9178571429 40.1928571429);
-    --color-dm-input-text: var(--tw-color-dm-text);
-    --color-dm-input-border: var(--tw-color-dm-border);
-    --color-dm-table-highlight: var(--tw-color-dm-border);
+    --color-dm-input-text: var(--color-dm-text);
+    --color-dm-input-border: var(--color-dm-border);
+    --color-dm-table-highlight: var(--color-dm-border);
 
     /* General color palette */
     --color-danger: #dc3545;
-    --color-danger-dark: color-mix(in srgb, black 20%, var(--tw-color-danger) 80%);
+    --color-danger-dark: color-mix(in srgb, black 20%, var(--color-danger) 80%);
     --color-warning: #ffc107;
-    --color-warning-dark: color-mix(in srgb, black 20%, var(--tw-color-warning) 80%);
+    --color-warning-dark: color-mix(in srgb, black 20%, var(--color-warning) 80%);
     --color-placeholder: #6c757d;
 
     /* Override breakpoints with the values from bootstrap, to keep sizing until fully migrated */
@@ -54,46 +54,8 @@
     --breakpoint-2xl: 1320px; /* 1400px according to bootstrap docs, but then the container is bigger than before */
 }
 
-/* Deprecated. TODO Remove with bootstrap support */
-@layer base {
-    html:not([data-theme='dark']) {
-        --primary-color: var(--tw-color-lm-primary);
-        --primary-color-alfa: var(--tw-color-lm-primary-alfa);
-        --secondary-color: var(--tw-color-lm-secondary);
-        --text-color: var(--tw-color-lm-text);
-        --border-color: var(--tw-color-lm-border);
-        --active-color: var(--tw-color-lm-active);
-        --brand-color: var(--tw-color-lm-main);
-        --input-color: var(--tw-color-lm-input);
-        --input-disabled-color: var(--tw-color-lm-disabled-input);
-        --input-text-color: var(--tw-color-lm-input-text);
-        --input-border-color: var(--tw-color-lm-input-border);
-        --table-border-color: var(--tw-color-lm-table-border);
-        --table-highlight-color: var(--tw-color-lm-table-highlight);
-    }
-
-    html[data-theme='dark'] {
-        --primary-color: var(--tw-color-dm-primary);
-        --primary-color-alfa: var(--tw-color-dm-primary-alfa);
-        --secondary-color: var(--tw-color-dm-secondary);
-        --text-color: var(--tw-color-dm-text);
-        --border-color: var(--tw-color-dm-border);
-        --active-color: var(--tw-color-dm-active);
-        --brand-color: var(--tw-color-dm-main);
-        --input-color: var(--tw-color-dm-input);
-        --input-disabled-color: var(--tw-color-dm-disabled-input);
-        --input-text-color: var(--tw-color-dm-input-text);
-        --input-border-color: var(--tw-color-dm-input-border);
-        --table-border-color: var(--tw-color-dm-table-border);
-        --table-highlight-color: var(--tw-color-dm-table-highlight);
-    }
-}
-
 @layer base {
     :root {
-        --header-height: 56px;
-        --tw-header-height: 52px;
-
         /* Chevron image for selects */
         --chevron-down: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/></svg>");
         /* Tick image for checkboxes */
@@ -103,89 +65,82 @@
         --circle-grey-dark: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='rgba%280, 0, 0, 0.25%29'/></svg>");
         --circle-grey-light: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='rgba%28255, 255, 255, 0.25%29'/></svg>");
         --circle-white: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='%23fff'/></svg>");
-        --circle-light-blue: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='%2386b7fe'/></svg>");
+        --circle-blue-light: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='%2386b7fe'/></svg>");
 
-        @apply tw:scheme-normal tw:dark:scheme-dark tw:scroll-auto;
+        @apply scheme-normal dark:scheme-dark scroll-auto;
     }
 
     html, body {
-        @apply tw:h-full tw:bg-lm-secondary tw:dark:bg-dm-secondary tw:text-lm-text tw:dark:text-dm-text;
+        @apply h-full bg-lm-secondary dark:bg-dm-secondary text-lm-text dark:text-dm-text;
     }
 
     a {
-        /*
-         * FIXME Set these styles as plain CSS instead of @apply to avoid higher specificity.
-         *       This can be set via @apply as soon as we stop using important for tailwind classes, once bootstrap is
-         *       removed
-         */
-        color: var(--tw-color-lm-brand);
-        border-radius: var(--tw-radius-xs);
-
         @apply
-            tw:focus-visible:outline-3 tw:focus-visible:outline-offset-3
-            tw:focus-visible:outline-lm-brand/50 tw:dark:focus-visible:outline-dm-brand/50
-            tw:focus-visible:z-1;
-    }
-
-    [data-theme="dark"] a {
-        color: var(--tw-color-dm-brand);
+            text-lm-brand dark:text-dm-brand rounded-xs
+            focus-visible:outline-3 focus-visible:outline-offset-3
+            focus-visible:outline-lm-brand/50 dark:focus-visible:outline-dm-brand/50
+            focus-visible:z-1;
     }
 
     h1 {
-        @apply tw:text-[2.5rem]/[1.2] tw:m-0 tw:font-medium;
+        @apply text-[2.5rem]/[1.2] m-0 font-medium;
     }
     h2 {
-        @apply tw:text-[2rem]/[1.2] tw:m-0 tw:font-medium;
+        @apply text-[2rem]/[1.2] m-0 font-medium;
     }
     h3 {
-        @apply tw:text-[1.75rem]/[1.2] tw:m-0 tw:font-medium;
+        @apply text-[1.75rem]/[1.2] m-0 font-medium;
     }
     h4 {
-        @apply tw:text-2xl/[1.2] tw:m-0 tw:font-medium;
+        @apply text-2xl/[1.2] m-0 font-medium;
     }
     h5 {
-        @apply tw:text-xl/[1.2] tw:m-0 tw:font-medium;
+        @apply text-xl/[1.2] m-0 font-medium;
     }
     h6 {
-        @apply tw:text-base/[1.2] tw:m-0 tw:font-medium;
+        @apply text-base/[1.2] m-0 font-medium;
     }
 
     hr {
-        @apply tw:my-3;
-    }
-
-    p {
-        @apply tw:m-0;
+        @apply my-3 border-lm-border dark:border-dm-border;
     }
 
     code {
-        @apply tw:text-sm tw:text-pink-600 tw:dark:text-pink-500 tw:font-mono;
+        @apply text-sm text-pink-600 dark:text-pink-500 font-mono;
     }
 
     input[type="search"]::-webkit-search-cancel-button {
-        @apply tw:cursor-pointer;
+        @apply cursor-pointer;
+    }
+
+    summary {
+        @apply cursor-pointer;
+    }
+
+    dialog {
+        @apply outline-none
     }
 }
 
 @utility focus-ring-base {
-    @apply tw:outline-none tw:focus-visible:ring-3 tw:focus-visible:z-1 tw:transition-[box-shadow];
+    @apply outline-none focus-visible:ring-3 focus-visible:z-1 transition-[box-shadow];
 }
 
 @utility focus-ring {
-    @apply tw:focus-ring-base tw:focus-visible:ring-lm-brand/50 tw:dark:focus-visible:ring-dm-brand/50;
+    @apply focus-ring-base focus-visible:ring-lm-brand/50 dark:focus-visible:ring-dm-brand/50;
 }
 
 @utility focus-ring-danger {
-    @apply tw:focus-ring-base tw:focus-visible:ring-danger/50;
+    @apply focus-ring-base focus-visible:ring-danger/50;
 }
 
 @utility focus-ring-secondary {
-    @apply tw:focus-ring-base tw:focus-visible:ring-zinc-500/50;
+    @apply focus-ring-base focus-visible:ring-zinc-500/50;
 }
 
 @utility focus-within-ring {
-    @apply tw:outline-none tw:focus-within:ring-3 tw:focus-within:z-1 tw:transition-[box-shadow];
-    @apply tw:focus-within:ring-lm-brand/50 tw:dark:focus-within:ring-dm-brand/50;
+    @apply outline-none focus-within:ring-3 focus-within:z-1 transition-[box-shadow];
+    @apply focus-within:ring-lm-brand/50 dark:focus-within:ring-dm-brand/50;
 }
 
 @utility scroll-thin {
@@ -225,9 +180,9 @@
 
 /* For sticky-positioned cells with a background */
 @utility sticky-cell-base {
-    @apply tw:z-1 tw:relative tw:sticky;
-    @apply tw:before:absolute tw:before:bg-lm-table-border tw:dark:before:bg-dm-table-border tw:before:-z-2;
-    @apply tw:after:absolute tw:after:bg-lm-primary tw:dark:after:bg-dm-primary tw:after:-z-1;
+    @apply z-1 relative sticky;
+    @apply before:absolute before:bg-lm-table-border dark:before:bg-dm-table-border before:-z-2;
+    @apply after:absolute after:bg-lm-primary dark:after:bg-dm-primary after:-z-1;
 
     &:before, &:after {
         content: '';
@@ -238,7 +193,7 @@
 }
 
 @utility sticky-cell {
-    @apply tw:sticky-cell-base;
+    @apply sticky-cell-base;
 
     &:before {
         inset: -1px 0 -1px 0;
@@ -252,7 +207,7 @@
 }
 
 @utility sticky-cell-separated {
-    @apply tw:sticky-cell-base;
+    @apply sticky-cell-base;
 
     &:before {
         inset: -1px -1px -1px 0;

package/package.json

@@ -12,10 +12,6 @@
       "import": "./dist/index.js",
       "types": "./dist/index.d.ts"
     },
-    "./tailwind": {
-      "import": "./dist/tailwind.js",
-      "types": "./dist/tailwind.d.ts"
-    },
     "./tailwind.preset.css": {
       "style": "./dist/tailwind.preset.css",
       "default": "./dist/tailwind.preset.css"
@@ -26,7 +22,7 @@
     "dist"
   ],
   "scripts": {
-    "build": "vite build && cp ./src/base.scss ./dist/base.scss && cp ./src/tailwind/tailwind.preset.css ./dist/tailwind.preset.css",
+    "build": "vite build && cp ./src/tailwind.preset.css ./dist/tailwind.preset.css",
     "test": "vitest run",
     "test:ci": "npm run test -- --coverage",
     "lint": "eslint dev src test",
@@ -45,10 +41,9 @@
     "@fortawesome/free-regular-svg-icons": "^6.7.2",
     "@fortawesome/free-solid-svg-icons": "^6.7.2",
     "@fortawesome/react-fontawesome": "^0.2.2",
-    "react": "^18.3 || ^19.0",
-    "react-dom": "^18.3 || ^19.0",
+    "react": "^19.1",
+    "react-dom": "^19.1",
     "react-router": "^7.0.2",
-    "reactstrap": "^9.2.0",
     "tailwindcss": "^4.0.1"
   },
   "peerDependenciesMeta": {
@@ -67,22 +62,20 @@
     "@types/react": "^19.1.8",
     "@types/react-dom": "^19.1.6",
     "@vitejs/plugin-react": "^4.5.2",
-    "@vitest/browser": "^3.2.3",
-    "@vitest/coverage-v8": "^3.2.3",
+    "@vitest/browser": "^3.2.4",
+    "@vitest/coverage-v8": "^3.2.4",
     "axe-core": "^4.10.3",
-    "bootstrap": "5.2.3",
     "eslint": "^9.29.0",
-    "eslint-plugin-import": "^2.31.0",
+    "eslint-plugin-import": "^2.32.0",
     "eslint-plugin-jsx-a11y": "^6.10.2",
     "eslint-plugin-react": "^7.37.5",
     "eslint-plugin-react-compiler": "^19.0.0-beta-714736e-20250131",
     "eslint-plugin-react-hooks": "^5.2.0",
     "eslint-plugin-simple-import-sort": "^12.1.1",
     "history": "^5.3.0",
-    "playwright": "^1.53.0",
-    "sass": "^1.89.2",
+    "playwright": "^1.53.1",
     "typescript": "^5.8.3",
-    "typescript-eslint": "^8.34.0",
+    "typescript-eslint": "^8.34.1",
     "vite": "^6.3.5",
     "vite-plugin-dts": "^4.5.4",
     "vitest": "^3.0.2"
@@ -93,5 +86,5 @@
     "not ie <= 11",
     "not op_mini all"
   ],
-  "version": "0.9.13"
+  "version": "1.0.1"
 }

package/dist/base.scss

@@ -1,27 +0,0 @@
-// Breakpoints
-$xsMax: 575px;
-$smMin: 576px;
-$smMax: 767px;
-$mdMin: 768px;
-$mdMax: 991px;
-$lgMin: 992px;
-$lgMax: 1199px;
-$xlgMin: 1200px;
-$responsiveTableBreakpoint: $mdMax;
-
-// Colors
-$mainColor: #4696e5;
-$lightColor: #f5f6fe;
-$lightGrey: #eeeeee;
-$dangerColor: #dc3545;
-$mediumGrey: #dee2e6;
-$textPlaceholder: #6c757d;
-
-// Misc
-$headerHeight: 56px;
-$asideMenuWidth: 260px;
-$footer-height: 2.3rem;
-$footer-margin: .8rem;
-
-// Bootstrap overwrites
-$primary: $mainColor;

package/dist/index.css

@@ -1 +0,0 @@
-@media (max-width: 991px){.responsive-table__header{display:none}}@media (max-width: 991px){.responsive-table.table>:not(:first-child){border:none}}@media (max-width: 991px){.responsive-table__row{display:block;border-bottom:1px solid var(--border-color);border-top:2px solid var(--border-color);position:relative}.responsive-table__row:not(:last-child){margin-bottom:10px}}.responsive-table__cell.responsive-table__cell{vertical-align:middle!important}@media (max-width: 991px){.responsive-table__cell.responsive-table__cell{display:block;width:100%;position:relative;padding:.5rem;font-size:.9rem}.responsive-table__cell.responsive-table__cell[data-th]:before{content:attr(data-th) ": ";font-weight:700}.responsive-table__cell.responsive-table__cell:last-child{position:absolute;top:3.5px;right:.5rem;width:auto;padding:0;border:none}}@media (max-width: 991px){.responsive-table__cell.responsive-table__cell .btn-sm{padding:.1rem .4rem;margin-top:.16rem}}:root{scroll-behavior:auto;color-scheme:var(--color-scheme)}html,body,#root{height:100%;background:var(--secondary-color);color:var(--text-color)}a,.btn-link{text-decoration:none}a:not(.nav-link):not(.navbar-brand):not(.page-link):not(.highlight-card):not(.btn):not(.dropdown-item):hover,.btn-link:hover{text-decoration:underline}.bg-main{background-color:#4696e5!important}.bg-warning{color:var(--tw-color-lm-text)}.card-body,.card-header,.list-group-item{background-color:transparent}.card-footer{background-color:var(--primary-color-alfa)}.card.card{box-shadow:0 .125rem .25rem #00000013;background-color:var(--primary-color);border-color:var(--border-color)}.list-group,.modal-content,.page-link,.page-item.disabled .page-link,.dropdown-menu{background-color:var(--primary-color)}.modal-header.modal-header,.modal-footer.modal-footer,.card-header.card-header,.card-footer.card-footer,.table.table thead th,.table.table th,.table.table td,.page-link.page-link,.page-link.page-link:hover,.page-item.page-item.disabled .page-link.page-link,.dropdown-divider.dropdown-divider,.dropdown-menu.dropdown-menu,.list-group-item.list-group-item,.modal-content.modal-content,hr{border-color:var(--border-color)}.table-bordered,.table-bordered thead th,.table-bordered thead td{border-color:var(--table-border-color)}.page-link:hover,.page-link:focus{background-color:var(--secondary-color)}.page-item.active .page-link{background-color:var(--brand-color);border-color:var(--brand-color)}.pagination .page-link{cursor:pointer}@media (min-width: 1200px){.container-xl{max-width:1320px}}@media (max-width: 767px){.container-xl{padding-right:0;padding-left:0}}.btn-block{display:block;width:100%}.btn-primary,.btn-primary:hover,.btn-primary:disabled,.btn-primary:active,.btn-primary:focus-visible,.btn-primary.active,.btn-outline-primary:hover,.btn-outline-primary:active.btn-outline-primary:active,.btn-outline-primary:focus-visible.btn-outline-primary:focus-visible,.btn-outline-primary.active.btn-outline-primary.active{color:#fff}.dropdown-item,.dropdown-item-text{color:var(--text-color)}.dropdown-item:not(:disabled){cursor:pointer}.dropdown-item:focus:not(:disabled),.dropdown-item:hover:not(:disabled),.dropdown-item.active:not(:disabled),.dropdown-item:active:not(:disabled){background-color:var(--active-color)!important;color:var(--text-color)!important}.dropdown-item--danger.dropdown-item--danger{color:#dc3545}.dropdown-item--danger.dropdown-item--danger:hover,.dropdown-item--danger.dropdown-item--danger:active,.dropdown-item--danger.dropdown-item--danger.active{color:#dc3545!important}.badge-main{color:#fff;background-color:var(--brand-color)}.close,.close:hover,.table,.table-hover>tbody>tr:hover>*,.table-hover>tbody>tr>*{color:var(--text-color)}.btn-close{filter:var(--btn-close-filter)}.table-hover tbody tr:hover{background-color:var(--secondary-color)}.form-control.form-control,.form-control.form-control:focus,.form-select.form-select,.form-select.form-select:focus{background-color:var(--primary-color);border-color:var(--input-border-color);color:var(--input-text-color)}.form-control.disabled,.form-control:disabled,.form-select.disabled,.form-select:disabled{background-color:var(--input-disabled-color);cursor:not-allowed}.card .form-control:not(:disabled),.card .form-control:not(:disabled):hover,.card .form-select:not(:disabled),.card .form-select:not(:disabled):hover,.modal .form-control:not(:disabled),.modal .form-control:not(:disabled):hover,.modal .form-select:not(:disabled),.modal .form-select:not(:disabled):hover{background-color:var(--input-color)}.card input[type=text]:not(:disabled),.dropdown input[type=text]:not(:disabled){background-color:var(--input-color)!important}.card input[type=date]:not(:disabled),.dropdown input[type=date]:not(:disabled){background-color:var(--input-color)!important}.card input[type=datetime-local]:not(:disabled),.dropdown input[type=datetime-local]:not(:disabled){background-color:var(--input-color)!important}.card input[type=password]:not(:disabled),.dropdown input[type=password]:not(:disabled){background-color:var(--input-color)!important}.card input[type=number]:not(:disabled),.dropdown input[type=number]:not(:disabled){background-color:var(--input-color)!important}.card input[type=email]:not(:disabled),.dropdown input[type=email]:not(:disabled){background-color:var(--input-color)!important}.card input[type=search]:not(:disabled),.dropdown input[type=search]:not(:disabled){background-color:var(--input-color)!important}.card input[type=url]:not(:disabled),.dropdown input[type=url]:not(:disabled){background-color:var(--input-color)!important}.input-group-text.input-group-text{border-color:var(--input-border-color)}.dropdown label{color:var(--text-color)!important}.table-active,.table-active>th,.table-active>td{background-color:var(--table-highlight-color)!important}@media (max-width: 767px){.navbar-brand{margin:0 auto!important}}.indivisible{white-space:nowrap}.pointer{cursor:pointer}.progress-bar{background-color:#4696e5}@media (max-width: 575px){.btn-xs-block{width:100%;display:block}}@media (max-width: 991px){.btn-md-block{width:100%;display:block}}@media (max-width: 767px){.btn-sm-block{width:100%;display:block}}.search-field{position:relative}.search-field:focus-within{z-index:1}.search-field__input.search-field__input{padding-left:40px;padding-right:40px}.search-field__input--no-border.search-field__input--no-border{border:none;border-radius:0}.search-field__icon{position:absolute;top:50%;transform:translateY(-50%);left:15px;color:#6c757d}.search-field__close{position:absolute;top:50%;transform:translateY(-50%);right:10px;cursor:pointer}.dropdown-btn__toggle.dropdown-btn__toggle{text-align:left}.dropdown-btn__toggle.dropdown-btn__toggle--with-caret{padding-right:1.75rem}.dropdown-btn__toggle.dropdown-btn__toggle,.dropdown-btn__toggle.dropdown-btn__toggle:not(:disabled):not(.disabled).active,.dropdown-btn__toggle.dropdown-btn__toggle:not(:disabled):not(.disabled):active,.dropdown-btn__toggle.dropdown-btn__toggle:not(:disabled):not(.disabled):focus,.dropdown-btn__toggle.dropdown-btn__toggle:not(:disabled):not(.disabled):hover,.show>.dropdown-btn__toggle.dropdown-btn__toggle.dropdown-toggle{color:var(--input-text-color);background-color:var(--primary-color);border-color:var(--input-border-color)}.card .dropdown-btn__toggle.dropdown-btn__toggle,.card .dropdown-btn__toggle.dropdown-btn__toggle:not(:disabled):not(.disabled).active,.card .dropdown-btn__toggle.dropdown-btn__toggle:not(:disabled):not(.disabled):active,.card .dropdown-btn__toggle.dropdown-btn__toggle:not(:disabled):not(.disabled):focus,.card .dropdown-btn__toggle.dropdown-btn__toggle:not(:disabled):not(.disabled):hover,.show>.card .dropdown-btn__toggle.dropdown-btn__toggle.dropdown-toggle{background-color:var(--input-color)}.dropdown-btn__toggle.dropdown-btn__toggle.disabled,.dropdown-btn__toggle.dropdown-btn__toggle:disabled{background-color:var(--input-disabled-color)}.dropdown-btn__toggle.dropdown-btn__toggle:after{position:absolute;top:50%;transform:translateY(-50%);right:.75rem}.nav-pills__nav{position:sticky!important;top:55px;z-index:2}.nav-pills__nav-link.nav-pills__nav-link{border-radius:0!important;padding-bottom:calc(.5rem - 3px)!important;border-bottom:3px solid transparent!important;color:#5d6778;font-weight:700;cursor:pointer;text-decoration:none}@media (min-width: 576px) and (max-width: 991px){.nav-pills__nav-link.nav-pills__nav-link{font-size:89%}}.nav-pills__nav-link:hover{color:#4696e5!important}.nav-pills__nav-link.active{border-color:#4696e5!important;background-color:var(--primary-color)!important;color:#4696e5!important}

package/dist/ordering-pAYMfJPl.js

@@ -1,108 +0,0 @@
-import { useMemo as T, useEffect as y, useRef as E, useCallback as d, useState as m } from "react";
-function I(e, { elementsSelector: s, focusFirstItem: r = !1, vertical: n = !0, horizontal: t = !0 }) {
-  const o = T(() => {
-    const c = [];
-    return n && c.push("ArrowDown"), t && c.push("ArrowRight"), c;
-  }, [t, n]), u = T(() => {
-    const c = [];
-    return n && c.push("ArrowUp"), t && c.push("ArrowLeft"), c;
-  }, [t, n]), i = T(() => [...o, ...u], [o, u]);
-  y(() => {
-    const c = e.current;
-    if (!c)
-      return () => {
-      };
-    const f = new AbortController(), g = () => [...c.querySelectorAll(s)], b = g(), p = Math.max(b.findIndex((l) => l.dataset.selected === "true"), 0);
-    return b.forEach((l, a) => {
-      l.tabIndex = a === p ? 0 : -1, r && a === p && l.focus();
-    }), c.addEventListener("keydown", (l) => {
-      if (!i.includes(l.key))
-        return;
-      l.preventDefault();
-      const a = g(), w = a.findIndex((h) => h.tabIndex === 0), C = o.includes(l.key) ? a[w + 1] ?? a[0] : a[w - 1] ?? a[a.length - 1];
-      a.forEach((h) => {
-        h.tabIndex = -1;
-      }), C.tabIndex = 0, C.focus();
-    }, { signal: f.signal }), () => f.abort();
-  }, [i, e, s, r, o]);
-}
-const D = 128;
-function k(e) {
-  const [s, r, n] = (e.match(/../g) ?? []).map((o) => parseInt(o, 16) || 0);
-  return Math.round(Math.sqrt(0.299 * s ** 2 + 0.587 * r ** 2 + 0.114 * n ** 2)) >= D;
-}
-function F(e, s = globalThis.setTimeout, r = globalThis.clearTimeout) {
-  const n = E(null), t = d(() => {
-    n.current && r(n.current);
-  }, [r]), o = d((u, i) => {
-    t(), n.current = s(() => {
-      u(), n.current = null;
-    }, i ?? e);
-  }, [t, e, s]);
-  return y(() => t, [t]), T(
-    () => ({ setTimeout: o, clearCurrentTimeout: t }),
-    [t, o]
-  );
-}
-const S = 2e3, v = (e = {}, s, r = globalThis.setTimeout, n = globalThis.clearTimeout) => {
-  const { initialValue: t = !1, delay: o = S } = typeof e == "boolean" ? {
-    initialValue: e,
-    delay: s
-  } : e, { setTimeout: u } = F(o, r, n), [i, c] = m(t), f = E(t), g = d(() => {
-    c(!f.current), u(() => c(f.current));
-  }, [u]);
-  return [i, g];
-};
-function M(e = !1, s = !1) {
-  const [r, n] = m(e), t = d(() => n((i) => !i), []), o = d(() => n(!0), []), u = d(() => n(!1), []);
-  return s ? { flag: r, toggle: t, setToTrue: o, setToFalse: u } : [r, t, o, u];
-}
-function A(e, s, r) {
-  if (!e || typeof e == "string")
-    return A({ currentField: e, newField: s, currentOrderDir: r });
-  const n = e;
-  if (n.currentField !== n.newField)
-    return "ASC";
-  const t = {
-    ASC: "DESC",
-    DESC: void 0
-  };
-  return n.currentOrderDir ? t[n.currentOrderDir] : "ASC";
-}
-function L(e, s, r) {
-  if (!e || typeof e == "string")
-    return L({ currentField: e, newField: s, currentOrderDir: r });
-  const n = e, t = A(n);
-  return {
-    field: t ? n.newField : void 0,
-    dir: t
-  };
-}
-const R = (e, { field: s, dir: r }) => !s || !r ? e : e.sort((n, t) => {
-  const o = r === "ASC" ? 1 : -1, u = r === "ASC" ? -1 : 1;
-  return n[s] > t[s] ? o : u;
-}), N = (e) => e.dir ? `${e.field}-${e.dir}` : void 0, q = (e) => {
-  const [s, r] = e.split("-");
-  return { field: s, dir: r };
-}, K = (e) => {
-  const [s, r] = m(e), n = d(
-    (t, o) => r(
-      t && typeof t == "object" ? t : { field: t, dir: o }
-    ),
-    []
-  );
-  return [s, n];
-};
-export {
-  I as a,
-  F as b,
-  v as c,
-  A as d,
-  L as e,
-  q as f,
-  K as g,
-  k as i,
-  N as o,
-  R as s,
-  M as u
-};