@shlinkio/shlink-frontend-kit 0.5.2 → 0.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.css CHANGED
@@ -1 +1 @@
1
- @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}}html:not([data-theme=dark]){--color-scheme: initial;--primary-color: #ffffff;--primary-color-alfa: rgba(255, 255, 255, .5);--secondary-color: #f5f6fe;--text-color: #232323;--border-color: rgba(0, 0, 0, .125);--active-color: #eeeeee;--brand-color: #4696e5;--input-color: #ffffff;--input-disabled-color: #f5f6fe;--input-border-color: rgba(0, 0, 0, .19);--input-text-color: #495057;--table-border-color: #dee2e6;--table-highlight-color: rgba(0, 0, 0, .075);--btn-close-filter: initial}html[data-theme=dark]{--color-scheme: dark;--primary-color: #161b22;--primary-color-alfa: rgba(22, 27, 34, .8);--secondary-color: #0f131a;--text-color: rgb(201, 209, 217);--border-color: rgba(255, 255, 255, .15);--active-color: #0f131a;--brand-color: #0b2d4e;--input-color: #12161c;--input-disabled-color: #1a2028;--input-border-color: rgba(255, 255, 255, .15);--input-text-color: rgb(201, 209, 217);--table-border-color: #393d43;--table-highlight-color: rgba(255, 255, 255, .15);--btn-close-filter: invert(1)}: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:#232323}.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}.ordering-dropdown__menu--link.ordering-dropdown__menu--link{min-width:11rem}.ordering-dropdown__sort-icon{margin:3.5px 0 0;float:right}
1
+ @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}}html:not([data-theme=dark]){--color-scheme: initial;--primary-color: #ffffff;--primary-color-alfa: rgba(255, 255, 255, .5);--secondary-color: #f5f6fe;--text-color: #232323;--border-color: rgba(0, 0, 0, .125);--active-color: #eeeeee;--brand-color: #4696e5;--input-color: #ffffff;--input-disabled-color: #f5f6fe;--input-border-color: rgba(0, 0, 0, .19);--input-text-color: #495057;--table-border-color: #dee2e6;--table-highlight-color: rgba(0, 0, 0, .075);--btn-close-filter: initial}html[data-theme=dark]{--color-scheme: dark;--primary-color: #161b22;--primary-color-alfa: rgba(22, 27, 34, .8);--secondary-color: #0f131a;--text-color: rgb(201, 209, 217);--border-color: rgba(255, 255, 255, .15);--active-color: #0f131a;--brand-color: #0b2d4e;--input-color: rgb(17.9928571429, 22.0821428571, 27.8071428571);--input-disabled-color: rgb(26.0071428571, 31.9178571429, 40.1928571429);--input-border-color: rgba(255, 255, 255, .15);--input-text-color: rgb(201, 209, 217);--table-border-color: #393d43;--table-highlight-color: rgba(255, 255, 255, .15);--btn-close-filter: invert(1)}: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:#232323}.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}.ordering-dropdown__menu--link.ordering-dropdown__menu--link{min-width:11rem}.ordering-dropdown__sort-icon{margin:3.5px 0 0;float:right}
package/dist/index.d.ts CHANGED
@@ -118,9 +118,6 @@ export declare type OrderingDropdownProps<T extends string = string> = {
118
118
 
119
119
  export declare const orderToString: <T>(order: Order<T>) => string | undefined;
120
120
 
121
- /** @deprecated Use parseQueryString instead */
122
- export declare const parseQuery: <T>(search: string) => T;
123
-
124
121
  /**
125
122
  * Parses provided query string into an object.
126
123
  * Parameters ending with "[]" will be considered arrays and returned as a single prop with all values.
@@ -163,9 +160,6 @@ export declare type SimpleCardProps = Omit<CardProps, 'title'> & {
163
160
 
164
161
  export declare const sortList: <List>(list: List[], { field, dir }: Order<keyof List>) => List[];
165
162
 
166
- /** @deprecated Use stringifyQueryParams instead */
167
- export declare const stringifyQuery: (params: Record<string, unknown | unknown[] | undefined>) => string;
168
-
169
163
  /**
170
164
  * Stringify an object of query parameters.
171
165
  * Keys explicitly defined with undefined value will be skipped.
@@ -184,8 +178,6 @@ declare type ToggleResult = [boolean, () => void, () => void, () => void];
184
178
 
185
179
  export declare const ToggleSwitch: FC<BooleanControlProps>;
186
180
 
187
- export declare const useDomId: () => string;
188
-
189
181
  export declare const useElementRef: <T>() => MutableRefObject<T | null>;
190
182
 
191
183
  export declare const useOrder: <T>(initialOrder: Order<T>) => [Order<T>, (orderField?: T, orderDir?: OrderDir) => void];
package/dist/index.js CHANGED
@@ -1,32 +1,31 @@
1
- import { jsx as s, jsxs as d, Fragment as C } from "react/jsx-runtime";
2
- import { faCircleNotch as I, faSearch as E, faEllipsisV as P, faSortAmountUp as F, faSortAmountDown as $ } from "@fortawesome/free-solid-svg-icons";
3
- import { FontAwesomeIcon as b } from "@fortawesome/react-fontawesome";
1
+ import { jsx as s, jsxs as d, Fragment as N } from "react/jsx-runtime";
2
+ import { faCircleNotch as I, faSearch as D, faEllipsisV as E, faSortAmountUp as P, faSortAmountDown as F } from "@fortawesome/free-solid-svg-icons";
3
+ import { FontAwesomeIcon as g } from "@fortawesome/react-fontawesome";
4
4
  import { clsx as m } from "clsx";
5
- import { Row as k, Card as _, CardHeader as H, CardBody as M, Dropdown as G, DropdownToggle as T, DropdownMenu as O, NavItem as Q, NavLink as U, Nav as j, UncontrolledDropdown as q, DropdownItem as N } from "reactstrap";
6
- import { useState as w, useCallback as f, useRef as g, useMemo as V, Children as Y, isValidElement as z } from "react";
7
- import { useLocation as J, NavLink as W } from "react-router-dom";
8
- import { v4 as X } from "uuid";
9
- const Z = (e) => ({
5
+ import { Row as v, Card as _, CardHeader as H, CardBody as M, Dropdown as $, DropdownToggle as T, DropdownMenu as O, NavItem as G, NavLink as U, Nav as j, UncontrolledDropdown as q, DropdownItem as w } from "reactstrap";
6
+ import { useId as S, useState as b, useCallback as f, useRef as C, useMemo as Q, Children as V, isValidElement as Y } from "react";
7
+ import { useLocation as z, NavLink as J } from "react-router-dom";
8
+ const W = (e) => ({
10
9
  error: "border-danger",
11
10
  default: ""
12
- })[e], B = (e) => ({
11
+ })[e], X = (e) => ({
13
12
  error: "text-danger",
14
13
  default: "text-muted"
15
- })[e], pe = ({ className: e, children: r, loading: t = !1, type: n = "default", fullWidth: o = !1 }) => {
14
+ })[e], he = ({ className: e, children: r, loading: t = !1, type: n = "default", fullWidth: o = !1 }) => {
16
15
  const c = m({
17
16
  "col-md-12": o,
18
17
  "col-md-10 offset-md-1": !o
19
18
  });
20
- return /* @__PURE__ */ s(k, { className: m("g-0", e), children: /* @__PURE__ */ s("div", { className: c, children: /* @__PURE__ */ s(_, { className: Z(n), body: !0, children: /* @__PURE__ */ d("h3", { className: m("text-center mb-0", B(n)), children: [
21
- t && /* @__PURE__ */ s(b, { icon: I, spin: !0 }),
19
+ return /* @__PURE__ */ s(v, { className: m("g-0", e), children: /* @__PURE__ */ s("div", { className: c, children: /* @__PURE__ */ s(_, { className: W(n), body: !0, children: /* @__PURE__ */ d("h3", { className: m("text-center mb-0", X(n)), children: [
20
+ t && /* @__PURE__ */ s(g, { icon: I, spin: !0 }),
22
21
  t && /* @__PURE__ */ s("span", { className: "ms-2", children: r ?? "Loading..." }),
23
22
  !t && r
24
23
  ] }) }) }) });
25
- }, K = ({ title: e, children: r, bodyClassName: t, ...n }) => /* @__PURE__ */ d(_, { ...n, children: [
24
+ }, Z = ({ title: e, children: r, bodyClassName: t, ...n }) => /* @__PURE__ */ d(_, { ...n, children: [
26
25
  e && /* @__PURE__ */ s(H, { role: "heading", "aria-level": 4, children: e }),
27
26
  /* @__PURE__ */ s(M, { className: t, children: r })
28
- ] }), ge = ({ children: e, type: r, className: t, small: n = !1 }) => /* @__PURE__ */ s(k, { className: t, children: /* @__PURE__ */ s("div", { className: m({ "col-md-10 offset-md-1": !n, "col-12": n }), children: /* @__PURE__ */ s(
29
- K,
27
+ ] }), ue = ({ children: e, type: r, className: t, small: n = !1 }) => /* @__PURE__ */ s(v, { className: t, children: /* @__PURE__ */ s("div", { className: m({ "col-md-10 offset-md-1": !n, "col-12": n }), children: /* @__PURE__ */ s(
28
+ Z,
30
29
  {
31
30
  role: "document",
32
31
  className: m("text-center", {
@@ -38,49 +37,21 @@ const Z = (e) => ({
38
37
  bodyClassName: m({ "p-2": n }),
39
38
  children: e
40
39
  }
41
- ) }) }), S = (e) => {
42
- const r = new URLSearchParams(e), t = {};
43
- return r.forEach((n, o) => {
44
- if (o.endsWith("[]")) {
45
- const c = o.slice(0, -2);
46
- t[c] ?? (t[c] = []), t[c].push(n);
47
- } else
48
- t[o] = n;
49
- }), t;
50
- }, ee = (e) => {
51
- const r = new URLSearchParams();
52
- for (const [t, n] of Object.entries(e))
53
- n !== void 0 && (Array.isArray(n) ? n.forEach((o) => r.append(`${t}[]`, `${o}`)) : r.append(t, `${n}`));
54
- return r.toString();
55
- }, be = S, we = ee, re = (e = !1) => {
56
- const [r, t] = w(e), n = f(() => t((l) => !l), []), o = f(() => t(!0), []), c = f(() => t(!1), []);
57
- return [r, n, o, c];
58
- }, Ne = (e = !1, r = 2e3, t = window.setTimeout, n = window.clearTimeout) => {
59
- const [o, c] = w(e), l = g(e), a = g(), i = f(() => {
60
- c(!l.current), a.current && n(a.current), a.current = t(() => c(l.current), r);
61
- }, [n, r, t]);
62
- return [o, i];
63
- }, A = () => {
64
- const { current: e } = g(`dom-${X()}`);
65
- return e;
66
- }, Ce = () => g(null), _e = () => {
67
- const { search: e } = J();
68
- return V(() => S(e), [e]);
69
- }, y = ({ checked: e = !1, onChange: r, className: t, children: n, type: o, inline: c = !1 }) => {
70
- const l = A(), a = (h) => r == null ? void 0 : r(h.target.checked, h), i = {
40
+ ) }) }), A = ({ checked: e = !1, onChange: r, className: t, children: n, type: o, inline: c = !1 }) => {
41
+ const l = S(), a = (u) => r == null ? void 0 : r(u.target.checked, u), i = {
71
42
  "form-switch": o === "switch",
72
43
  "form-checkbox": o === "checkbox"
73
- }, u = c ? { display: "inline-block" } : {};
74
- return /* @__PURE__ */ d("span", { className: m("form-check", i, t), style: u, children: [
44
+ }, h = c ? { display: "inline-block" } : {};
45
+ return /* @__PURE__ */ d("span", { className: m("form-check", i, t), style: h, children: [
75
46
  /* @__PURE__ */ s("input", { type: "checkbox", className: "form-check-input", id: l, checked: e, onChange: a }),
76
47
  /* @__PURE__ */ s("label", { className: "form-check-label", htmlFor: l, children: n })
77
48
  ] });
78
- }, ve = (e) => /* @__PURE__ */ s(y, { type: "checkbox", ...e }), ke = (e) => /* @__PURE__ */ s(y, { type: "switch", ...e }), te = ({ children: e, label: r, className: t = "", labelClassName: n = "", noMargin: o = !1, id: c }) => /* @__PURE__ */ d("div", { className: `${t} ${o ? "" : "mb-3"}`, children: [
49
+ }, fe = (e) => /* @__PURE__ */ s(A, { type: "checkbox", ...e }), pe = (e) => /* @__PURE__ */ s(A, { type: "switch", ...e }), B = ({ children: e, label: r, className: t = "", labelClassName: n = "", noMargin: o = !1, id: c }) => /* @__PURE__ */ d("div", { className: `${t} ${o ? "" : "mb-3"}`, children: [
79
50
  /* @__PURE__ */ s("label", { className: `form-label ${n}`, htmlFor: c, children: r }),
80
51
  e
81
- ] }), Te = ({ children: e, value: r, onChange: t, type: n, required: o, placeholder: c, className: l, labelClassName: a }) => {
82
- const i = A();
83
- return /* @__PURE__ */ s(te, { label: /* @__PURE__ */ d(C, { children: [
52
+ ] }), ge = ({ children: e, value: r, onChange: t, type: n, required: o, placeholder: c, className: l, labelClassName: a }) => {
53
+ const i = S();
54
+ return /* @__PURE__ */ s(B, { label: /* @__PURE__ */ d(N, { children: [
84
55
  e,
85
56
  ":"
86
57
  ] }), className: l, labelClassName: a, id: i, children: /* @__PURE__ */ s(
@@ -92,18 +63,18 @@ const Z = (e) => ({
92
63
  value: r,
93
64
  required: o ?? !0,
94
65
  placeholder: c,
95
- onChange: (u) => t(u.target.value)
66
+ onChange: (h) => t(h.target.value)
96
67
  }
97
68
  ) });
98
- }, ne = 500;
69
+ }, K = 500;
99
70
  let p;
100
- const v = () => {
101
- p && clearTimeout(p), p = null;
102
- }, Oe = ({ onChange: e, className: r, large: t = !0, noBorder: n = !1, initialValue: o = "", setTimeout_: c = setTimeout }) => {
103
- const [l, a] = w(o), i = (u, h = ne) => {
104
- a(u), v(), p = c(() => {
105
- e(u), v();
106
- }, h);
71
+ const k = () => {
72
+ p !== null && clearTimeout(p), p = null;
73
+ }, be = ({ onChange: e, className: r, large: t = !0, noBorder: n = !1, initialValue: o = "", setTimeout_: c = setTimeout }) => {
74
+ const [l, a] = b(o), i = (h, u = K) => {
75
+ a(h), k(), p = c(() => {
76
+ e(h), k();
77
+ }, u);
107
78
  };
108
79
  return /* @__PURE__ */ d("div", { className: m("search-field", r), children: [
109
80
  /* @__PURE__ */ s(
@@ -116,10 +87,10 @@ const v = () => {
116
87
  }),
117
88
  placeholder: "Search...",
118
89
  value: l,
119
- onChange: (u) => i(u.target.value)
90
+ onChange: (h) => i(h.target.value)
120
91
  }
121
92
  ),
122
- /* @__PURE__ */ s(b, { icon: E, className: "search-field__icon" }),
93
+ /* @__PURE__ */ s(g, { icon: D, className: "search-field__icon" }),
123
94
  /* @__PURE__ */ s(
124
95
  "button",
125
96
  {
@@ -132,7 +103,32 @@ const v = () => {
132
103
  }
133
104
  )
134
105
  ] });
135
- }, se = ({
106
+ }, ee = (e) => {
107
+ const r = new URLSearchParams(e), t = {};
108
+ return r.forEach((n, o) => {
109
+ if (o.endsWith("[]")) {
110
+ const c = o.slice(0, -2);
111
+ t[c] ?? (t[c] = []), t[c].push(n);
112
+ } else
113
+ t[o] = n;
114
+ }), t;
115
+ }, we = (e) => {
116
+ const r = new URLSearchParams();
117
+ for (const [t, n] of Object.entries(e))
118
+ n !== void 0 && (Array.isArray(n) ? n.forEach((o) => r.append(`${t}[]`, `${o}`)) : r.append(t, `${n}`));
119
+ return r.toString();
120
+ }, re = (e = !1) => {
121
+ const [r, t] = b(e), n = f(() => t((l) => !l), []), o = f(() => t(!0), []), c = f(() => t(!1), []);
122
+ return [r, n, o, c];
123
+ }, Ne = (e = !1, r = 2e3, t = window.setTimeout, n = window.clearTimeout) => {
124
+ const [o, c] = b(e), l = C(e), a = C(), i = f(() => {
125
+ c(!l.current), a.current && n(a.current), a.current = t(() => c(l.current), r);
126
+ }, [n, r, t]);
127
+ return [o, i];
128
+ }, Ce = () => C(null), _e = () => {
129
+ const { search: e } = z();
130
+ return Q(() => ee(e), [e]);
131
+ }, te = ({
136
132
  text: e,
137
133
  disabled: r = !1,
138
134
  className: t,
@@ -142,21 +138,21 @@ const v = () => {
142
138
  end: l = !1,
143
139
  minWidth: a,
144
140
  inline: i,
145
- size: u,
146
- ...h
141
+ size: h,
142
+ ...u
147
143
  }) => {
148
- const [L, R] = re(), x = m("dropdown-btn__toggle", t, {
144
+ const [L, y] = re(), R = m("dropdown-btn__toggle", t, {
149
145
  "btn-block": !i,
150
146
  "dropdown-btn__toggle--with-caret": !c
151
- }), D = { minWidth: a && `${a}px` };
152
- return /* @__PURE__ */ d(G, { isOpen: L, toggle: R, disabled: r, className: o, children: [
153
- /* @__PURE__ */ s(T, { size: u, caret: !c, className: x, color: "primary", ...h, children: e }),
154
- /* @__PURE__ */ s(O, { className: "w-100", end: l, style: D, children: n })
147
+ }), x = { minWidth: a && `${a}px` };
148
+ return /* @__PURE__ */ d($, { isOpen: L, toggle: y, disabled: r, className: o, children: [
149
+ /* @__PURE__ */ s(T, { size: h, caret: !c, className: R, color: "primary", ...u, children: e }),
150
+ /* @__PURE__ */ s(O, { className: "w-100", end: l, style: x, children: n })
155
151
  ] });
156
- }, Se = ({ children: e, minWidth: r, label: t = "Options" }) => /* @__PURE__ */ s(
157
- se,
152
+ }, ke = ({ children: e, minWidth: r, label: t = "Options" }) => /* @__PURE__ */ s(
153
+ te,
158
154
  {
159
- text: /* @__PURE__ */ s(b, { className: "px-1", icon: P }),
155
+ text: /* @__PURE__ */ s(g, { className: "px-1", icon: E }),
160
156
  "aria-label": t,
161
157
  size: "sm",
162
158
  minWidth: r,
@@ -165,26 +161,26 @@ const v = () => {
165
161
  inline: !0,
166
162
  children: e
167
163
  }
168
- ), oe = ({ children: e, ...r }) => /* @__PURE__ */ s(Q, { children: /* @__PURE__ */ s(U, { className: "nav-pills__nav-link", tag: W, ...r, children: e }) }), Ae = ({ children: e, fill: r = !1, className: t = "" }) => /* @__PURE__ */ s(_, { className: `nav-pills__nav p-0 overflow-hidden ${t}`, body: !0, children: /* @__PURE__ */ s(j, { pills: !0, fill: r, children: Y.map(e, (n) => {
169
- if (!z(n) || n.type !== oe)
164
+ ), ne = ({ children: e, ...r }) => /* @__PURE__ */ s(G, { children: /* @__PURE__ */ s(U, { className: "nav-pills__nav-link", tag: J, ...r, children: e }) }), ve = ({ children: e, fill: r = !1, className: t = "" }) => /* @__PURE__ */ s(_, { className: `nav-pills__nav p-0 overflow-hidden ${t}`, body: !0, children: /* @__PURE__ */ s(j, { pills: !0, fill: r, children: V.map(e, (n) => {
165
+ if (!Y(n) || n.type !== ne)
170
166
  throw new Error("Only NavPillItem children are allowed inside NavPills.");
171
167
  return n;
172
- }) }) }), ce = (e, r, t) => e !== r ? "ASC" : t ? {
168
+ }) }) }), se = (e, r, t) => e !== r ? "ASC" : t ? {
173
169
  ASC: "DESC",
174
170
  DESC: void 0
175
- }[t] : "ASC", ye = (e, { field: r, dir: t }) => !r || !t ? e : e.sort((n, o) => {
171
+ }[t] : "ASC", Te = (e, { field: r, dir: t }) => !r || !t ? e : e.sort((n, o) => {
176
172
  const c = t === "ASC" ? 1 : -1, l = t === "ASC" ? -1 : 1;
177
173
  return n[r] > o[r] ? c : l;
178
- }), Le = (e) => e.dir ? `${e.field}-${e.dir}` : void 0, Re = (e) => {
174
+ }), Oe = (e) => e.dir ? `${e.field}-${e.dir}` : void 0, Se = (e) => {
179
175
  const [r, t] = e.split("-");
180
176
  return { field: r, dir: t };
181
- }, xe = (e) => {
182
- const [r, t] = w(e), n = f((o, c) => t({ field: o, dir: c }), []);
177
+ }, Ae = (e) => {
178
+ const [r, t] = b(e), n = f((o, c) => t({ field: o, dir: c }), []);
183
179
  return [r, n];
184
180
  };
185
- function De({ items: e, order: r, onChange: t, isButton: n = !0, right: o = !1, prefixed: c = !0 }) {
181
+ function Le({ items: e, order: r, onChange: t, isButton: n = !0, right: o = !1, prefixed: c = !0 }) {
186
182
  const l = (a) => () => {
187
- const i = ce(a, r.field, r.dir);
183
+ const i = se(a, r.field, r.dir);
188
184
  t(i ? a : void 0, i);
189
185
  };
190
186
  return /* @__PURE__ */ d(q, { children: [
@@ -198,9 +194,9 @@ function De({ items: e, order: r, onChange: t, isButton: n = !0, right: o = !1,
198
194
  "btn-sm p-0": !n
199
195
  }),
200
196
  children: [
201
- !n && /* @__PURE__ */ s(C, { children: "Order by" }),
197
+ !n && /* @__PURE__ */ s(N, { children: "Order by" }),
202
198
  n && !r.field && /* @__PURE__ */ s("i", { children: "Order by..." }),
203
- n && r.field && /* @__PURE__ */ d(C, { children: [
199
+ n && r.field && /* @__PURE__ */ d(N, { children: [
204
200
  c && "Order by: ",
205
201
  e[r.field],
206
202
  " - ",
@@ -215,64 +211,61 @@ function De({ items: e, order: r, onChange: t, isButton: n = !0, right: o = !1,
215
211
  end: o,
216
212
  className: m("w-100", { "ordering-dropdown__menu--link": !n }),
217
213
  children: [
218
- Object.entries(e).map(([a, i]) => /* @__PURE__ */ d(N, { active: r.field === a, onClick: l(a), children: [
214
+ Object.entries(e).map(([a, i]) => /* @__PURE__ */ d(w, { active: r.field === a, onClick: l(a), children: [
219
215
  i,
220
216
  r.field === a && /* @__PURE__ */ s(
221
- b,
217
+ g,
222
218
  {
223
- icon: r.dir === "ASC" ? F : $,
219
+ icon: r.dir === "ASC" ? P : F,
224
220
  className: "ordering-dropdown__sort-icon"
225
221
  }
226
222
  )
227
223
  ] }, a)),
228
- /* @__PURE__ */ s(N, { divider: !0 }),
229
- /* @__PURE__ */ s(N, { disabled: !r.field, onClick: () => t(), children: /* @__PURE__ */ s("i", { children: "Clear selection" }) })
224
+ /* @__PURE__ */ s(w, { divider: !0 }),
225
+ /* @__PURE__ */ s(w, { disabled: !r.field, onClick: () => t(), children: /* @__PURE__ */ s("i", { children: "Clear selection" }) })
230
226
  ]
231
227
  }
232
228
  )
233
229
  ] });
234
230
  }
235
- const Ie = "#4696e5", Ee = "rgba(70, 150, 229, 0.4)", Pe = "#f77f28", Fe = "rgba(247, 127, 40, 0.4)", $e = "white", He = "#161b22", Me = (e) => {
231
+ const ye = "#4696e5", Re = "rgba(70, 150, 229, 0.4)", xe = "#f77f28", Ie = "rgba(247, 127, 40, 0.4)", De = "white", Ee = "#161b22", Pe = (e) => {
236
232
  var r;
237
233
  return (r = document.querySelector("html")) == null ? void 0 : r.setAttribute("data-theme", e);
238
- }, Ge = () => {
234
+ }, Fe = () => {
239
235
  var e;
240
236
  return ((e = document.querySelector("html")) == null ? void 0 : e.getAttribute("data-theme")) === "dark";
241
- }, Qe = (e = window.matchMedia.bind(window)) => e("(prefers-color-scheme: dark)").matches ? "dark" : "light";
237
+ }, He = (e = window.matchMedia.bind(window)) => e("(prefers-color-scheme: dark)").matches ? "dark" : "light";
242
238
  export {
243
- ve as Checkbox,
244
- se as DropdownBtn,
245
- Pe as HIGHLIGHTED_COLOR,
246
- Fe as HIGHLIGHTED_COLOR_ALPHA,
247
- Te as InputFormGroup,
248
- te as LabeledFormGroup,
249
- Ie as MAIN_COLOR,
250
- Ee as MAIN_COLOR_ALPHA,
251
- pe as Message,
252
- oe as NavPillItem,
253
- Ae as NavPills,
254
- De as OrderingDropdown,
255
- He as PRIMARY_DARK_COLOR,
256
- $e as PRIMARY_LIGHT_COLOR,
257
- ge as Result,
258
- Se as RowDropdownBtn,
259
- Oe as SearchField,
260
- K as SimpleCard,
261
- ke as ToggleSwitch,
262
- Me as changeThemeInMarkup,
263
- ce as determineOrderDir,
264
- Qe as getSystemPreferredTheme,
265
- Ge as isDarkThemeEnabled,
266
- Le as orderToString,
267
- be as parseQuery,
268
- S as parseQueryString,
269
- ye as sortList,
270
- Re as stringToOrder,
271
- we as stringifyQuery,
272
- ee as stringifyQueryParams,
273
- A as useDomId,
239
+ fe as Checkbox,
240
+ te as DropdownBtn,
241
+ xe as HIGHLIGHTED_COLOR,
242
+ Ie as HIGHLIGHTED_COLOR_ALPHA,
243
+ ge as InputFormGroup,
244
+ B as LabeledFormGroup,
245
+ ye as MAIN_COLOR,
246
+ Re as MAIN_COLOR_ALPHA,
247
+ he as Message,
248
+ ne as NavPillItem,
249
+ ve as NavPills,
250
+ Le as OrderingDropdown,
251
+ Ee as PRIMARY_DARK_COLOR,
252
+ De as PRIMARY_LIGHT_COLOR,
253
+ ue as Result,
254
+ ke as RowDropdownBtn,
255
+ be as SearchField,
256
+ Z as SimpleCard,
257
+ pe as ToggleSwitch,
258
+ Pe as changeThemeInMarkup,
259
+ se as determineOrderDir,
260
+ He as getSystemPreferredTheme,
261
+ Fe as isDarkThemeEnabled,
262
+ Oe as orderToString,
263
+ ee as parseQueryString,
264
+ Te as sortList,
265
+ Se as stringToOrder,
266
+ we as stringifyQueryParams,
274
267
  Ce as useElementRef,
275
- xe as useOrder,
268
+ Ae as useOrder,
276
269
  _e as useParsedQuery,
277
270
  Ne as useTimeoutToggle,
278
271
  re as useToggle
package/package.json CHANGED
@@ -5,15 +5,8 @@
5
5
  "repository": "https://github.com/shlinkio/shlink-frontend-kit",
6
6
  "license": "MIT",
7
7
  "type": "module",
8
- "main": "./dist/index.umd.cjs",
9
- "module": "./dist/index.js",
8
+ "main": "./dist/index.js",
10
9
  "types": "./dist/index.d.ts",
11
- "exports": {
12
- ".": {
13
- "import": "./dist/index.js",
14
- "require": "./dist/index.umd.cjs"
15
- }
16
- },
17
10
  "files": [
18
11
  "dist"
19
12
  ],
@@ -31,8 +24,7 @@
31
24
  "dev": "vite serve --host=0.0.0.0 --port 3001"
32
25
  },
33
26
  "dependencies": {
34
- "clsx": "^2.1.1",
35
- "uuid": "^10.0.0"
27
+ "clsx": "^2.1.1"
36
28
  },
37
29
  "peerDependencies": {
38
30
  "@fortawesome/fontawesome-free": "^6.4.2",
@@ -44,35 +36,35 @@
44
36
  "reactstrap": "^9.2.0"
45
37
  },
46
38
  "devDependencies": {
47
- "@shlinkio/eslint-config-js-coding-standard": "~3.0.0",
39
+ "@shlinkio/eslint-config-js-coding-standard": "~3.2.0",
48
40
  "@shlinkio/stylelint-config-css-coding-standard": "~1.1.1",
49
- "@stylistic/eslint-plugin": "^2.3.0",
50
- "@testing-library/jest-dom": "^6.4.6",
51
- "@testing-library/react": "^16.0.0",
41
+ "@stylistic/eslint-plugin": "^2.9.0",
42
+ "@testing-library/jest-dom": "^6.5.0",
43
+ "@testing-library/react": "^16.0.1",
52
44
  "@testing-library/user-event": "^14.5.2",
53
45
  "@total-typescript/shoehorn": "^0.1.2",
54
- "@types/qs": "^6.9.15",
55
- "@types/react": "^18.3.3",
56
- "@types/react-dom": "^18.3.0",
46
+ "@types/qs": "^6.9.16",
47
+ "@types/react": "^18.3.11",
48
+ "@types/react-dom": "^18.3.1",
57
49
  "@types/uuid": "^10.0.0",
58
- "@vitejs/plugin-react": "^4.3.1",
59
- "@vitest/coverage-v8": "^2.0.2",
60
- "axe-core": "^4.9.1",
50
+ "@vitejs/plugin-react": "^4.3.2",
51
+ "@vitest/coverage-v8": "^2.1.3",
52
+ "axe-core": "^4.10.1",
61
53
  "bootstrap": "5.2.3",
62
- "eslint": "^8.57.0",
63
- "eslint-plugin-jsx-a11y": "^6.9.0",
64
- "eslint-plugin-react": "^7.34.3",
65
- "eslint-plugin-react-hooks": "^4.6.2",
54
+ "eslint": "^9.13.0",
55
+ "eslint-plugin-jsx-a11y": "^6.10.0",
56
+ "eslint-plugin-react": "^7.37.1",
57
+ "eslint-plugin-react-hooks": "^5.0.0",
66
58
  "eslint-plugin-simple-import-sort": "^12.1.1",
67
59
  "history": "^5.3.0",
68
- "jsdom": "^24.1.0",
60
+ "jsdom": "^25.0.1",
69
61
  "resize-observer-polyfill": "^1.5.1",
70
- "sass": "^1.77.8",
62
+ "sass": "^1.80.3",
71
63
  "stylelint": "^15.11.0",
72
- "typescript": "^5.5.3",
73
- "typescript-eslint": "^7.16.0",
74
- "vite": "^5.3.3",
75
- "vite-plugin-dts": "^3.9.1",
64
+ "typescript": "^5.6.3",
65
+ "typescript-eslint": "^8.10.0",
66
+ "vite": "^5.4.9",
67
+ "vite-plugin-dts": "^4.2.4",
76
68
  "vitest": "^2.0.2"
77
69
  },
78
70
  "browserslist": [
@@ -81,5 +73,5 @@
81
73
  "not ie <= 11",
82
74
  "not op_mini all"
83
75
  ],
84
- "version": "0.5.2"
76
+ "version": "0.6.0"
85
77
  }
@@ -1 +0,0 @@
1
- (function(o,s){typeof exports=="object"&&typeof module<"u"?s(exports,require("react/jsx-runtime"),require("@fortawesome/free-solid-svg-icons"),require("@fortawesome/react-fontawesome"),require("clsx"),require("reactstrap"),require("react"),require("react-router-dom"),require("uuid")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","@fortawesome/free-solid-svg-icons","@fortawesome/react-fontawesome","clsx","reactstrap","react","react-router-dom","uuid"],s):(o=typeof globalThis<"u"?globalThis:o||self,s(o["shlink-frontend-kit"]={},o.jsxRuntime,o.freeSolidSvgIcons,o.reactFontawesome,o.clsx,o.reactstrap,o.react,o.reactRouterDom,o.uuid))})(this,function(o,s,w,b,f,d,h,O,v){"use strict";const P=e=>({error:"border-danger",default:""})[e],F=e=>({error:"text-danger",default:"text-muted"})[e],H=({className:e,children:r,loading:n=!1,type:c="default",fullWidth:l=!1})=>{const a=f.clsx({"col-md-12":l,"col-md-10 offset-md-1":!l});return s.jsx(d.Row,{className:f.clsx("g-0",e),children:s.jsx("div",{className:a,children:s.jsx(d.Card,{className:P(c),body:!0,children:s.jsxs("h3",{className:f.clsx("text-center mb-0",F(c)),children:[n&&s.jsx(b.FontAwesomeIcon,{icon:w.faCircleNotch,spin:!0}),n&&s.jsx("span",{className:"ms-2",children:r??"Loading..."}),!n&&r]})})})})},T=({title:e,children:r,bodyClassName:n,...c})=>s.jsxs(d.Card,{...c,children:[e&&s.jsx(d.CardHeader,{role:"heading","aria-level":4,children:e}),s.jsx(d.CardBody,{className:n,children:r})]}),E=({children:e,type:r,className:n,small:c=!1})=>s.jsx(d.Row,{className:n,children:s.jsx("div",{className:f.clsx({"col-md-10 offset-md-1":!c,"col-12":c}),children:s.jsx(T,{role:"document",className:f.clsx("text-center",{"bg-main":r==="success","bg-danger":r==="error","bg-warning":r==="warning","text-white":r!=="warning"}),bodyClassName:f.clsx({"p-2":c}),children:e})})}),_=e=>{const r=new URLSearchParams(e),n={};return r.forEach((c,l)=>{if(l.endsWith("[]")){const a=l.slice(0,-2);n[a]??(n[a]=[]),n[a].push(c)}else n[l]=c}),n},k=e=>{const r=new URLSearchParams;for(const[n,c]of Object.entries(e))c!==void 0&&(Array.isArray(c)?c.forEach(l=>r.append(`${n}[]`,`${l}`)):r.append(n,`${c}`));return r.toString()},M=_,G=k,A=(e=!1)=>{const[r,n]=h.useState(e),c=h.useCallback(()=>n(i=>!i),[]),l=h.useCallback(()=>n(!0),[]),a=h.useCallback(()=>n(!1),[]);return[r,c,l,a]},q=(e=!1,r=2e3,n=window.setTimeout,c=window.clearTimeout)=>{const[l,a]=h.useState(e),i=h.useRef(e),t=h.useRef(),u=h.useCallback(()=>{a(!i.current),t.current&&c(t.current),t.current=n(()=>a(i.current),r)},[c,r,n]);return[l,u]},N=()=>{const{current:e}=h.useRef(`dom-${v.v4()}`);return e},$=()=>h.useRef(null),Q=()=>{const{search:e}=O.useLocation();return h.useMemo(()=>_(e),[e])},p=({checked:e=!1,onChange:r,className:n,children:c,type:l,inline:a=!1})=>{const i=N(),t=g=>r==null?void 0:r(g.target.checked,g),u={"form-switch":l==="switch","form-checkbox":l==="checkbox"},m=a?{display:"inline-block"}:{};return s.jsxs("span",{className:f.clsx("form-check",u,n),style:m,children:[s.jsx("input",{type:"checkbox",className:"form-check-input",id:i,checked:e,onChange:t}),s.jsx("label",{className:"form-check-label",htmlFor:i,children:c})]})},j=e=>s.jsx(p,{type:"checkbox",...e}),U=e=>s.jsx(p,{type:"switch",...e}),y=({children:e,label:r,className:n="",labelClassName:c="",noMargin:l=!1,id:a})=>s.jsxs("div",{className:`${n} ${l?"":"mb-3"}`,children:[s.jsx("label",{className:`form-label ${c}`,htmlFor:a,children:r}),e]}),Y=({children:e,value:r,onChange:n,type:c,required:l,placeholder:a,className:i,labelClassName:t})=>{const u=N();return s.jsx(y,{label:s.jsxs(s.Fragment,{children:[e,":"]}),className:i,labelClassName:t,id:u,children:s.jsx("input",{id:u,className:"form-control",type:c??"text",value:r,required:l??!0,placeholder:a,onChange:m=>n(m.target.value)})})},V=500;let C;const I=()=>{C&&clearTimeout(C),C=null},z=({onChange:e,className:r,large:n=!0,noBorder:c=!1,initialValue:l="",setTimeout_:a=setTimeout})=>{const[i,t]=h.useState(l),u=(m,g=V)=>{t(m),I(),C=a(()=>{e(m),I()},g)};return s.jsxs("div",{className:f.clsx("search-field",r),children:[s.jsx("input",{type:"text",className:f.clsx("form-control search-field__input",{"form-control-lg":n,"search-field__input--no-border":c}),placeholder:"Search...",value:i,onChange:m=>u(m.target.value)}),s.jsx(b.FontAwesomeIcon,{icon:w.faSearch,className:"search-field__icon"}),s.jsx("button",{"aria-label":"Clear search",type:"button",className:"close search-field__close btn-close",hidden:i==="",id:"search-field__close",onClick:()=>u("",0)})]})},L=({text:e,disabled:r=!1,className:n,children:c,dropdownClassName:l,noCaret:a,end:i=!1,minWidth:t,inline:u,size:m,...g})=>{const[te,de]=A(),ie=f.clsx("dropdown-btn__toggle",n,{"btn-block":!u,"dropdown-btn__toggle--with-caret":!a}),he={minWidth:t&&`${t}px`};return s.jsxs(d.Dropdown,{isOpen:te,toggle:de,disabled:r,className:l,children:[s.jsx(d.DropdownToggle,{size:m,caret:!a,className:ie,color:"primary",...g,children:e}),s.jsx(d.DropdownMenu,{className:"w-100",end:i,style:he,children:c})]})},B=({children:e,minWidth:r,label:n="Options"})=>s.jsx(L,{text:s.jsx(b.FontAwesomeIcon,{className:"px-1",icon:w.faEllipsisV}),"aria-label":n,size:"sm",minWidth:r,end:!0,noCaret:!0,inline:!0,children:e}),D=({children:e,...r})=>s.jsx(d.NavItem,{children:s.jsx(d.NavLink,{className:"nav-pills__nav-link",tag:O.NavLink,...r,children:e})}),J=({children:e,fill:r=!1,className:n=""})=>s.jsx(d.Card,{className:`nav-pills__nav p-0 overflow-hidden ${n}`,body:!0,children:s.jsx(d.Nav,{pills:!0,fill:r,children:h.Children.map(e,c=>{if(!h.isValidElement(c)||c.type!==D)throw new Error("Only NavPillItem children are allowed inside NavPills.");return c})})}),S=(e,r,n)=>e!==r?"ASC":n?{ASC:"DESC",DESC:void 0}[n]:"ASC",W=(e,{field:r,dir:n})=>!r||!n?e:e.sort((c,l)=>{const a=n==="ASC"?1:-1,i=n==="ASC"?-1:1;return c[r]>l[r]?a:i}),X=e=>e.dir?`${e.field}-${e.dir}`:void 0,Z=e=>{const[r,n]=e.split("-");return{field:r,dir:n}},K=e=>{const[r,n]=h.useState(e),c=h.useCallback((l,a)=>n({field:l,dir:a}),[]);return[r,c]};function R({items:e,order:r,onChange:n,isButton:c=!0,right:l=!1,prefixed:a=!0}){const i=t=>()=>{const u=S(t,r.field,r.dir);n(u?t:void 0,u)};return s.jsxs(d.UncontrolledDropdown,{children:[s.jsxs(d.DropdownToggle,{caret:!0,color:c?"primary":"link",className:f.clsx({"dropdown-btn__toggle btn-block pe-4 overflow-hidden":c,"btn-sm p-0":!c}),children:[!c&&s.jsx(s.Fragment,{children:"Order by"}),c&&!r.field&&s.jsx("i",{children:"Order by..."}),c&&r.field&&s.jsxs(s.Fragment,{children:[a&&"Order by: ",e[r.field]," - ",s.jsx("small",{children:r.dir??"DESC"})]})]}),s.jsxs(d.DropdownMenu,{end:l,className:f.clsx("w-100",{"ordering-dropdown__menu--link":!c}),children:[Object.entries(e).map(([t,u])=>s.jsxs(d.DropdownItem,{active:r.field===t,onClick:i(t),children:[u,r.field===t&&s.jsx(b.FontAwesomeIcon,{icon:r.dir==="ASC"?w.faSortAmountUp:w.faSortAmountDown,className:"ordering-dropdown__sort-icon"})]},t)),s.jsx(d.DropdownItem,{divider:!0}),s.jsx(d.DropdownItem,{disabled:!r.field,onClick:()=>n(),children:s.jsx("i",{children:"Clear selection"})})]})]})}const x="#4696e5",ee="rgba(70, 150, 229, 0.4)",re="#f77f28",se="rgba(247, 127, 40, 0.4)",ne="white",oe="#161b22",ce=e=>{var r;return(r=document.querySelector("html"))==null?void 0:r.setAttribute("data-theme",e)},le=()=>{var e;return((e=document.querySelector("html"))==null?void 0:e.getAttribute("data-theme"))==="dark"},ae=(e=window.matchMedia.bind(window))=>e("(prefers-color-scheme: dark)").matches?"dark":"light";o.Checkbox=j,o.DropdownBtn=L,o.HIGHLIGHTED_COLOR=re,o.HIGHLIGHTED_COLOR_ALPHA=se,o.InputFormGroup=Y,o.LabeledFormGroup=y,o.MAIN_COLOR=x,o.MAIN_COLOR_ALPHA=ee,o.Message=H,o.NavPillItem=D,o.NavPills=J,o.OrderingDropdown=R,o.PRIMARY_DARK_COLOR=oe,o.PRIMARY_LIGHT_COLOR=ne,o.Result=E,o.RowDropdownBtn=B,o.SearchField=z,o.SimpleCard=T,o.ToggleSwitch=U,o.changeThemeInMarkup=ce,o.determineOrderDir=S,o.getSystemPreferredTheme=ae,o.isDarkThemeEnabled=le,o.orderToString=X,o.parseQuery=M,o.parseQueryString=_,o.sortList=W,o.stringToOrder=Z,o.stringifyQuery=G,o.stringifyQueryParams=k,o.useDomId=N,o.useElementRef=$,o.useOrder=K,o.useParsedQuery=Q,o.useTimeoutToggle=q,o.useToggle=A,Object.defineProperty(o,Symbol.toStringTag,{value:"Module"})});