stargazer-ui 1.0.5 → 1.0.6
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/cjs/components/index.d.ts +16 -0
- package/dist/cjs/index.js +1 -1
- package/dist/cjs/index.js.map +1 -1
- package/dist/esm/BaseTypes.d.ts +19 -0
- package/dist/esm/components/Button/Button.d.ts +4 -0
- package/dist/esm/components/Button/Button.types.d.ts +7 -0
- package/dist/esm/components/Button/index.d.ts +1 -0
- package/dist/esm/components/Card/Card.d.ts +34 -0
- package/dist/esm/components/Card/Card.types.d.ts +24 -0
- package/dist/esm/components/Card/index.d.ts +1 -0
- package/dist/esm/components/CloseButton/CloseButton.d.ts +4 -0
- package/dist/esm/components/CloseButton/CloseButton.types.d.ts +5 -0
- package/dist/esm/components/CloseButton/index.d.ts +1 -0
- package/dist/esm/components/Dropdown/Dropdown.d.ts +71 -0
- package/dist/esm/components/Dropdown/Dropdown.types.d.ts +55 -0
- package/dist/esm/components/Dropdown/index.d.ts +1 -0
- package/dist/esm/components/FloatingLabel/FloatingLabel.d.ts +4 -0
- package/dist/esm/components/FloatingLabel/FloatingLabel.types.d.ts +9 -0
- package/dist/esm/components/FloatingLabel/index.d.ts +1 -0
- package/dist/esm/components/Form/Form.d.ts +17 -0
- package/dist/esm/components/Form/Form.types.d.ts +50 -0
- package/dist/esm/components/Form/index.d.ts +1 -0
- package/dist/esm/components/InputGroup/InputGroup.d.ts +6 -0
- package/dist/esm/components/InputGroup/InputGroup.types.d.ts +10 -0
- package/dist/esm/components/InputGroup/index.d.ts +1 -0
- package/dist/esm/components/Modal/Modal.d.ts +40 -0
- package/dist/esm/components/Modal/Modal.types.d.ts +40 -0
- package/dist/esm/components/Modal/index.d.ts +1 -0
- package/dist/esm/components/Nav/Nav.d.ts +30 -0
- package/dist/esm/components/Nav/Nav.types.d.ts +17 -0
- package/dist/esm/components/Nav/index.d.ts +1 -0
- package/dist/esm/components/NavBar/Navbar.d.ts +20 -0
- package/dist/esm/components/NavBar/Navbar.types.d.ts +18 -0
- package/dist/esm/components/NavBar/index.d.ts +1 -0
- package/dist/esm/components/NavDropdown/NavDropdown.d.ts +35 -0
- package/dist/esm/components/NavDropdown/NavDropdown.types.d.ts +5 -0
- package/dist/esm/components/NavDropdown/index.d.ts +1 -0
- package/dist/esm/components/Popout/Popout.d.ts +22 -0
- package/dist/esm/components/Popout/Popout.types.d.ts +36 -0
- package/dist/esm/components/Popout/index.d.ts +1 -0
- package/dist/esm/components/Spinner/Spinner.d.ts +4 -0
- package/dist/esm/components/Spinner/Spinner.types.d.ts +7 -0
- package/dist/esm/components/Spinner/index.d.ts +1 -0
- package/dist/esm/components/Table/Table.d.ts +4 -0
- package/dist/esm/components/Table/Table.types.d.ts +7 -0
- package/dist/esm/components/Table/index.d.ts +1 -0
- package/dist/esm/components/Tabs/Tabs.d.ts +9 -0
- package/dist/esm/components/Tabs/Tabs.types.d.ts +35 -0
- package/dist/esm/components/Tabs/index.d.ts +1 -0
- package/dist/esm/components/ToggleButton/ToggleButton.d.ts +9 -0
- package/dist/esm/components/ToggleButton/index.d.ts +1 -0
- package/dist/esm/components/index.d.ts +16 -0
- package/dist/esm/index.d.ts +1 -0
- package/dist/esm/index.js +1 -1
- package/dist/esm/index.js.map +1 -1
- package/dist/types.d.ts +469 -1
- package/package.json +2 -2
- package/dist/BaseTypes.js +0 -1
- package/dist/components/Button/Button.js +0 -6
- package/dist/components/Button/Button.types.js +0 -1
- package/dist/components/Button/index.js +0 -4
- package/dist/components/Card/Card.js +0 -18
- package/dist/components/Card/Card.types.js +0 -1
- package/dist/components/Card/index.js +0 -4
- package/dist/components/CloseButton/CloseButton.js +0 -6
- package/dist/components/CloseButton/CloseButton.types.js +0 -1
- package/dist/components/CloseButton/index.js +0 -4
- package/dist/components/Dropdown/Dropdown.js +0 -205
- package/dist/components/Dropdown/Dropdown.types.js +0 -1
- package/dist/components/Dropdown/index.js +0 -4
- package/dist/components/FloatingLabel/FloatingLabel.js +0 -13
- package/dist/components/FloatingLabel/FloatingLabel.types.js +0 -1
- package/dist/components/FloatingLabel/index.js +0 -4
- package/dist/components/Form/Form.js +0 -63
- package/dist/components/Form/Form.types.js +0 -1
- package/dist/components/Form/index.js +0 -4
- package/dist/components/Grid/Grid.d.ts +0 -5
- package/dist/components/Grid/Grid.js +0 -36
- package/dist/components/Grid/index.d.ts +0 -1
- package/dist/components/Grid/index.js +0 -4
- package/dist/components/InputGroup/InputGroup.js +0 -8
- package/dist/components/InputGroup/InputGroup.types.js +0 -1
- package/dist/components/InputGroup/index.js +0 -4
- package/dist/components/Modal/Modal.js +0 -100
- package/dist/components/Modal/Modal.types.js +0 -1
- package/dist/components/Modal/index.js +0 -4
- package/dist/components/Nav/Nav.js +0 -13
- package/dist/components/Nav/Nav.types.js +0 -1
- package/dist/components/Nav/index.js +0 -4
- package/dist/components/NavBar/Navbar.js +0 -17
- package/dist/components/NavBar/Navbar.types.js +0 -1
- package/dist/components/NavBar/index.js +0 -4
- package/dist/components/NavDropdown/NavDropdown.js +0 -62
- package/dist/components/NavDropdown/NavDropdown.types.js +0 -1
- package/dist/components/NavDropdown/index.js +0 -4
- package/dist/components/OffCanvas/OffCanvas.d.ts +0 -3
- package/dist/components/OffCanvas/OffCanvas.js +0 -2266
- package/dist/components/OffCanvas/index.d.ts +0 -1
- package/dist/components/OffCanvas/index.js +0 -4
- package/dist/components/Overlay/Overlay.d.ts +0 -3
- package/dist/components/Overlay/Overlay.js +0 -125
- package/dist/components/Overlay/index.d.ts +0 -1
- package/dist/components/Overlay/index.js +0 -4
- package/dist/components/Popout/Popout.js +0 -72
- package/dist/components/Popout/Popout.types.js +0 -1
- package/dist/components/Popout/index.js +0 -4
- package/dist/components/Spinner/Spinner.js +0 -9
- package/dist/components/Spinner/Spinner.types.js +0 -1
- package/dist/components/Spinner/index.js +0 -4
- package/dist/components/Table/Table.js +0 -9
- package/dist/components/Table/Table.types.js +0 -1
- package/dist/components/Table/index.js +0 -4
- package/dist/components/Tabs/Tabs.js +0 -77
- package/dist/components/Tabs/Tabs.types.js +0 -1
- package/dist/components/Tabs/index.js +0 -4
- package/dist/components/ToggleButton/ToggleButton.js +0 -11
- package/dist/components/ToggleButton/ToggleButton.types.d.ts +0 -0
- package/dist/components/ToggleButton/ToggleButton.types.js +0 -1
- package/dist/components/ToggleButton/index.js +0 -4
- package/dist/components/index.d.ts +0 -19
- package/dist/components/index.js +0 -19
- package/dist/index.js +0 -19
- package/dist/vite-env.d.js +0 -1
- /package/dist/{BaseTypes.d.ts → cjs/BaseTypes.d.ts} +0 -0
- /package/dist/{components → cjs/components}/Button/Button.d.ts +0 -0
- /package/dist/{components → cjs/components}/Button/Button.types.d.ts +0 -0
- /package/dist/{components → cjs/components}/Button/index.d.ts +0 -0
- /package/dist/{components → cjs/components}/Card/Card.d.ts +0 -0
- /package/dist/{components → cjs/components}/Card/Card.types.d.ts +0 -0
- /package/dist/{components → cjs/components}/Card/index.d.ts +0 -0
- /package/dist/{components → cjs/components}/CloseButton/CloseButton.d.ts +0 -0
- /package/dist/{components → cjs/components}/CloseButton/CloseButton.types.d.ts +0 -0
- /package/dist/{components → cjs/components}/CloseButton/index.d.ts +0 -0
- /package/dist/{components → cjs/components}/Dropdown/Dropdown.d.ts +0 -0
- /package/dist/{components → cjs/components}/Dropdown/Dropdown.types.d.ts +0 -0
- /package/dist/{components → cjs/components}/Dropdown/index.d.ts +0 -0
- /package/dist/{components → cjs/components}/FloatingLabel/FloatingLabel.d.ts +0 -0
- /package/dist/{components → cjs/components}/FloatingLabel/FloatingLabel.types.d.ts +0 -0
- /package/dist/{components → cjs/components}/FloatingLabel/index.d.ts +0 -0
- /package/dist/{components → cjs/components}/Form/Form.d.ts +0 -0
- /package/dist/{components → cjs/components}/Form/Form.types.d.ts +0 -0
- /package/dist/{components → cjs/components}/Form/index.d.ts +0 -0
- /package/dist/{components → cjs/components}/InputGroup/InputGroup.d.ts +0 -0
- /package/dist/{components → cjs/components}/InputGroup/InputGroup.types.d.ts +0 -0
- /package/dist/{components → cjs/components}/InputGroup/index.d.ts +0 -0
- /package/dist/{components → cjs/components}/Modal/Modal.d.ts +0 -0
- /package/dist/{components → cjs/components}/Modal/Modal.types.d.ts +0 -0
- /package/dist/{components → cjs/components}/Modal/index.d.ts +0 -0
- /package/dist/{components → cjs/components}/Nav/Nav.d.ts +0 -0
- /package/dist/{components → cjs/components}/Nav/Nav.types.d.ts +0 -0
- /package/dist/{components → cjs/components}/Nav/index.d.ts +0 -0
- /package/dist/{components → cjs/components}/NavBar/Navbar.d.ts +0 -0
- /package/dist/{components → cjs/components}/NavBar/Navbar.types.d.ts +0 -0
- /package/dist/{components → cjs/components}/NavBar/index.d.ts +0 -0
- /package/dist/{components → cjs/components}/NavDropdown/NavDropdown.d.ts +0 -0
- /package/dist/{components → cjs/components}/NavDropdown/NavDropdown.types.d.ts +0 -0
- /package/dist/{components → cjs/components}/NavDropdown/index.d.ts +0 -0
- /package/dist/{components → cjs/components}/Popout/Popout.d.ts +0 -0
- /package/dist/{components → cjs/components}/Popout/Popout.types.d.ts +0 -0
- /package/dist/{components → cjs/components}/Popout/index.d.ts +0 -0
- /package/dist/{components → cjs/components}/Spinner/Spinner.d.ts +0 -0
- /package/dist/{components → cjs/components}/Spinner/Spinner.types.d.ts +0 -0
- /package/dist/{components → cjs/components}/Spinner/index.d.ts +0 -0
- /package/dist/{components → cjs/components}/Table/Table.d.ts +0 -0
- /package/dist/{components → cjs/components}/Table/Table.types.d.ts +0 -0
- /package/dist/{components → cjs/components}/Table/index.d.ts +0 -0
- /package/dist/{components → cjs/components}/Tabs/Tabs.d.ts +0 -0
- /package/dist/{components → cjs/components}/Tabs/Tabs.types.d.ts +0 -0
- /package/dist/{components → cjs/components}/Tabs/index.d.ts +0 -0
- /package/dist/{components → cjs/components}/ToggleButton/ToggleButton.d.ts +0 -0
- /package/dist/{components → cjs/components}/ToggleButton/index.d.ts +0 -0
- /package/dist/{index.d.ts → cjs/index.d.ts} +0 -0
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import { ReactNode } from "react";
|
|
2
|
+
import { BaseDialogType, BaseDivType, BaseHeadingType, BaseParagraphType, BaseSpanType } from "../../BaseTypes";
|
|
3
|
+
export type PopoutType = {
|
|
4
|
+
children: ReactNode;
|
|
5
|
+
initialPosition?: {
|
|
6
|
+
top?: number;
|
|
7
|
+
bottom?: number;
|
|
8
|
+
right?: number;
|
|
9
|
+
left?: number;
|
|
10
|
+
};
|
|
11
|
+
id?: string;
|
|
12
|
+
resize?: boolean;
|
|
13
|
+
move?: boolean;
|
|
14
|
+
} & BaseDialogType;
|
|
15
|
+
export type PopoutHeaderType = {
|
|
16
|
+
children: ReactNode;
|
|
17
|
+
className?: string;
|
|
18
|
+
as?: React.ElementType;
|
|
19
|
+
} & (BaseDivType | BaseHeadingType | BaseSpanType);
|
|
20
|
+
export type PopoutTitleType = {
|
|
21
|
+
children: ReactNode;
|
|
22
|
+
className?: string;
|
|
23
|
+
as?: React.ElementType;
|
|
24
|
+
} & BaseHeadingType;
|
|
25
|
+
export type PopoutBodyType = {
|
|
26
|
+
children: ReactNode;
|
|
27
|
+
className?: string;
|
|
28
|
+
} & BaseDivType;
|
|
29
|
+
export type PopoutTextType = {
|
|
30
|
+
children: ReactNode;
|
|
31
|
+
className?: string;
|
|
32
|
+
} & BaseParagraphType;
|
|
33
|
+
export type PopoutFooterType = {
|
|
34
|
+
children: ReactNode;
|
|
35
|
+
className?: string;
|
|
36
|
+
} & BaseDivType;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "./Popout";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "./Spinner";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "./Table";
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { TabsButtonType, TabsContentType, TabsControlsType, TabsPageType, TabsType } from "./Tabs.types";
|
|
3
|
+
declare const _default: import("react").ForwardRefExoticComponent<Omit<TabsType, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
|
|
4
|
+
Controls: import("react").ForwardRefExoticComponent<Omit<TabsControlsType, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
5
|
+
Button: import("react").ForwardRefExoticComponent<Omit<TabsButtonType, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
|
|
6
|
+
Content: import("react").ForwardRefExoticComponent<Omit<TabsContentType, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
7
|
+
Page: import("react").ForwardRefExoticComponent<Omit<TabsPageType, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
8
|
+
};
|
|
9
|
+
export default _default;
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { BaseButtonType, BaseDivType } from "../../BaseTypes";
|
|
3
|
+
export type TabsContextType = {
|
|
4
|
+
activeTab: string;
|
|
5
|
+
setActiveTab: React.Dispatch<React.SetStateAction<string>>;
|
|
6
|
+
controlId: string;
|
|
7
|
+
activeClass: string;
|
|
8
|
+
};
|
|
9
|
+
export type TabsType = {
|
|
10
|
+
children: React.ReactNode;
|
|
11
|
+
className?: string;
|
|
12
|
+
controlId: string;
|
|
13
|
+
activeClassName?: string;
|
|
14
|
+
defaultActive: string;
|
|
15
|
+
} & BaseDivType;
|
|
16
|
+
export type TabsControlsType = {
|
|
17
|
+
children: React.ReactNode;
|
|
18
|
+
className?: string;
|
|
19
|
+
} & BaseDivType;
|
|
20
|
+
export type TabsButtonType = {
|
|
21
|
+
children: React.ReactNode;
|
|
22
|
+
className?: string;
|
|
23
|
+
onClick?: Function;
|
|
24
|
+
tabId: string;
|
|
25
|
+
id?: string;
|
|
26
|
+
} & BaseButtonType;
|
|
27
|
+
export type TabsContentType = {
|
|
28
|
+
children: React.ReactNode;
|
|
29
|
+
className?: string;
|
|
30
|
+
} & BaseDivType;
|
|
31
|
+
export type TabsPageType = {
|
|
32
|
+
children: React.ReactNode;
|
|
33
|
+
className?: string;
|
|
34
|
+
tabId: string;
|
|
35
|
+
} & BaseDivType;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "./Tabs";
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { ReactNode } from "react";
|
|
2
|
+
import { BaseButtonType } from "../../BaseTypes";
|
|
3
|
+
type ToggleButtonType = {
|
|
4
|
+
children: ReactNode;
|
|
5
|
+
toggled?: boolean;
|
|
6
|
+
onClick?: <T>(event: T) => T;
|
|
7
|
+
} & BaseButtonType;
|
|
8
|
+
declare const ToggleButton: import("react").ForwardRefExoticComponent<Omit<ToggleButtonType, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
|
|
9
|
+
export default ToggleButton;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "./ToggleButton";
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
export { default as Button } from "./Button";
|
|
2
|
+
export { default as Card } from "./Card";
|
|
3
|
+
export { default as CloseButton } from "./CloseButton";
|
|
4
|
+
export { default as Dropdown } from "./Dropdown";
|
|
5
|
+
export { default as FloatingLabel } from "./FloatingLabel";
|
|
6
|
+
export { default as Form } from "./Form";
|
|
7
|
+
export { default as InputGroup } from "./InputGroup";
|
|
8
|
+
export { default as Modal } from "./Modal";
|
|
9
|
+
export { default as Nav } from "./Nav";
|
|
10
|
+
export { default as NavBar } from "./NavBar";
|
|
11
|
+
export { default as NavDropdown } from "./NavDropdown";
|
|
12
|
+
export { default as Popout } from "./Popout";
|
|
13
|
+
export { default as Spinner } from "./Spinner";
|
|
14
|
+
export { default as Table } from "./Table";
|
|
15
|
+
export { default as Tabs } from "./Tabs";
|
|
16
|
+
export { default as ToggleButton } from "./ToggleButton";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "./components";
|
package/dist/esm/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import{forwardRef as r,createContext as s,useState as o,useMemo as a,useEffect as l,useLayoutEffect as c,useContext as d,useRef as i,useCallback as u}from"react";import{createPortal as h}from"react-dom";const m=r((({children:t,variant:n="primary",className:r,...s},o)=>e("button",{ref:o,type:"button",className:`sg-button sg-button-${n}${null==r?"":" "+r}`,...s,children:t}))),f=r((({children:t,className:n,...r},s)=>e("div",{ref:s,className:"sg-card "+n,...r,children:t}))),p=r((({as:t="div",className:n,children:r,...s},o)=>{let a=["div","span","h1","h2","h3","h4","h5","h6"].find((e=>e===t))?t:"div";return e(a,{ref:o,className:`sg-card-header ${n}`,...s,children:r})})),g=r((({as:t="h5",className:n,children:r,...s},o)=>{let a=["h1","h2","h3","h4","h5","h6"].find((e=>e===t))?t:"h5";return e(a,{ref:o,className:n,...s,children:r})})),b=r((({children:t,className:n,...r},s)=>e("div",{ref:s,className:`sg-card-body ${n}`,...r,children:t}))),v=r((({children:t,className:n,...r},s)=>e("p",{ref:s,className:`sg-card-text ${n}`,...r,children:t}))),w=r((({children:t,className:n,...r},s)=>e("div",{ref:s,className:`sg-card-footer ${n}`,...r,children:t})));Object.assign(f,{Header:p,Body:b,Title:g,Text:v,Footer:w});const N=r((({className:t,variant:n=!1,...r},s)=>e("button",{ref:s,className:`sg-button-close${n?" sg-button-close-white":""} ${t}`,...r,children:e("span",{className:"sg-close-visually-hidden-label",children:"Close"})}))),y=(e,t="")=>{let n=e.target,r=!0,s=!1;for(;r;)n.id!=t+"-menu"?n=n.parentElement:(s=!0,r=!1),"root"===n.id&&(r=!1,s=!1);return s},k=s(null),I=({children:t,value:n})=>e(k.Provider,{value:n,children:t}),C=()=>{const e=d(k);if(!e)throw new Error("useDropdownContext has to be used within DropdownContextProvider!");return e},x=r((({children:t,className:n,onSelect:r,onToggle:s,controlId:l,drop:c="down",align:d="start",autoClose:i=!0,show:u="default",...h},m)=>{const[f,p]=o("default"!==u&&u),[g,b]=o({case:""}),v=e=>{e.stopPropagation(),p((e=>!e))},w=((e,t,n=!1)=>{let r=e?n?"bottom-start":"bottom-end":n?"bottom-end":"bottom-start";return"up"===t?r=e?n?"top-start":"top-end":n?"top-end":"top-start":"end"===t?r=e?n?"left-end":"right-end":n?"left-start":"right-start":"start"===t?r=e?n?"right-end":"left-end":n?"right-start":"left-start":"down-centered"===t?r="bottom":"up-centered"===t&&(r="top"),r})("end"===d,c),N=a((()=>({align:d,drop:c,showInternal:"default"!=u&&s?u:f,handleToggle:"default"!=u&&s?s:v,placement:w,directionClasses:{down:"dropdown","down-centered":"dropdown-center",up:"dropup","up-centered":"dropup-center dropup",end:"dropend",start:"dropstart"},controlId:l,activeDescendant:g,setActiveDescendant:b})),[d,c,u,f,s,w,l,g,b]);return e("div",{id:l+"-wrapper",ref:m,className:"sg-dropdown"+(n?" "+n:""),...h,children:e(I,{value:N,children:t})})})),T=r((({children:t,className:n,navDropdown:r=!1,as:s="button",variant:o="primary",...a},c)=>{const{controlId:d,handleToggle:i,setActiveDescendant:u,showInternal:h}=C(),m=s,f=e=>{let t=!1;switch(console.log(e.key),e.key){case"ArrowDown":t=!0,h?u((e=>({...e,case:"next"}))):(i(e),u((e=>({...e,case:"first"}))));break;case"ArrowUp":t=!0,h?u((e=>({...e,case:"previous"}))):(i(e),u((e=>({...e,case:"last"}))));break;case"Home":t=!0,h&&u((e=>({...e,case:"first"})));break;case"End":t=!0,h&&u((e=>({...e,case:"last"})));break;case"Tab":h&&i(e);break;case"Escape":t=!0,h&&i(e);break;case"Enter":case" ":if(h){t=!0;document.querySelector(".sg-dropdown-item-visual-focus").click(),i(e);break}u((e=>({...e,case:"first"})))}t&&(e.stopPropagation(),e.preventDefault())},p=e=>{if(h&&e.target.id!==d)if(y(e,d)){if(y(e,d)){i(e);const t=document.getElementById(d);t?.focus()}}else i(e)};l((()=>{const e=document.getElementById(d);return e.addEventListener("keydown",f,!0),document.addEventListener("mouseup",p,!0),function(){e.removeEventListener("keydown",f,!0),document.removeEventListener("mouseup",p,!0)}}),[f,d]);let g=`sg-button sg-button${o?"-"+o:"-primary"} sg-dropdown-toggle${n?" "+n:""}`;return("a"===m||r)&&(g="sg-nav-dropdown-toggle sg-dropdown-toggle"+(n?" "+n:"")),e(m,{tabIndex:"0",type:"button","aria-haspopup":"true","aria-controls":d+"-menu","aria-expanded":h,id:d,ref:c,className:g,onClick:e=>(e=>{i(e),h||u((e=>({...e,case:"first"})))})(e),...a,children:t})})),E=r((({children:t,className:n,style:r={},...s},a)=>{const{controlId:d,showInternal:i,activeDescendant:u}=C(),[h,m]=o(r);c((()=>{if(i){const e=document.getElementById(d+"-menu");let t={};e.getBoundingClientRect().right>window.innerWidth?t={...t,right:0}:e.getBoundingClientRect().left<0?t={...t,left:0}:e.getBoundingClientRect().top<0?t={...t,top:0}:e.getBoundingClientRect().bottom>window.innerHeight&&(t={...t,bottom:0}),m((e=>({...e,...t})))}}),[i]),l((()=>{if(i){const e=document.getElementById(d+"-menu"),t=document.getElementById(d+"-menu").children,n=t.length-1,r=document.querySelector(".sg-dropdown-item-visual-focus");let s=0,o=t[0].children[0];if(null!=r){r.classList.remove("sg-dropdown-item-visual-focus");for(let e=0;e<t.length;e++)if(t[e]===r.parentElement){s=e;break}}switch(u.case){case"first":o=t[0].children[0],s=0;break;case"last":o=t[n].children[0],s=n;break;case"next":s=s===n?0:s+1,o=t[s].children[0];break;case"previous":s=0===s?n:s-1,o=t[s].children[0]}e.setAttribute("aria-activedescendant",o.id),t[s].children[0].classList.add("sg-dropdown-item-visual-focus")}else{document.getElementById(d+"-menu").setAttribute("aria-activedescendant","")}}),[d,i,u]);const f=e=>{const t=e.target;let n=t.classList.contains("sg-dropdown-item-visual-focus");const r=document.getElementById(d+"-menu");n||(document.querySelector(".sg-dropdown-item-visual-focus")?.classList.remove("sg-dropdown-item-visual-focus"),r.setAttribute("aria-activedescendant",""),t.classList.add("sg-dropdown-item-visual-focus"),r.setAttribute("aria-activedescendant",t.id))};return l((()=>{const e=document.getElementById(d+"-menu");for(let t of e.children)t.addEventListener("mouseover",f,!0);return function(){for(let t of e.children)t.removeEventListener("mouseover",f,!0)}}),[]),e("ul",{id:d+"-menu",role:"menu",tabIndex:-1,"aria-labelledby":d,ref:a,className:`sg-dropdown-list${n?" "+n:""}${i?" show":""}`,style:h,...s,children:t})})),$=r((({children:t,as:n="button",className:r,...s},o)=>e("li",{role:"none",children:e(n,{ref:o,role:"menuitem",tabIndex:"-1",className:"sg-dropdown-item"+(r?" "+r:""),...s,children:t})}))),L=r((({className:t="",...n},r)=>e("hr",{ref:r,className:`.sg-dropdown-divider${t}`,...n})));var D=Object.assign(x,{Toggle:T,Menu:E,Item:$,Divider:L});const P=s(null),B=({children:t,value:n})=>e(P.Provider,{value:n,children:t}),S=()=>{const e=d(P);if(!e)throw new Error("useFormContext has to be used within a FormContextProvider!");return e},A=r((({children:t,...n},r)=>e("form",{ref:r,...n,children:t}))),H=r((({as:t="input",className:n="",plaintext:r=!1,id:s="",type:o="text",autoFocus:a=!1,...l},c)=>{let d=t;const{controlId:i}=S();return e(d,{autoFocus:a,ref:c,id:i||s,type:o,className:(r?"sg-form-control-plaintext":"sg-form-control")+(""!=n?" "+n:"")+("color"==o?" sg-form-control-color":""),...l})})),F=r((({children:t,className:n,id:r,...s},o)=>{const{controlId:a}=S();return e("select",{ref:o,className:"sg-form-select"+(n?" "+n:""),id:a||r,...s,children:t})})),j=r((({children:t,className:n,controlId:r,...s},o)=>{const l=a((()=>({controlId:r})),[r]);return e("div",{ref:o,className:"sg-from-group"+(n?" "+n:""),...s,children:e(B,{value:l,children:t})})})),O=r((({children:t,className:n,htmlFor:r},s)=>{const{controlId:o}=S();return e("label",{ref:s,htmlFor:r||o,className:"sg-form-label"+(n?" "+n:""),children:t})})),M=r((({classNameContainer:r,containerRef:s,containerId:o,style:a,classNameLabel:l,labelRef:c,label:d,labelId:i,className:u,type:h,id:m,controlId:f,reverse:p=!1,checkStyle:g,...b},v)=>{let w=f||m,N="switch"===h?"checkbox":h;return e("div",{ref:s,id:o,style:a,className:`sg-form-check${p?"-reverse":""}${r?" "+r:""}${"switch"===h?" sg-form-switch":""}`,children:t(n,p?{children:[e("input",{ref:v,type:N,id:w,className:"sg-form-check-input"+(u?" "+u:""),...b}),e("label",{ref:c,id:i,htmlFor:w,className:"sg-form-check-label"+(l?" "+l:""),children:d})]}:{children:[e("label",{ref:c,id:i,htmlFor:w,className:"sg-form-check-label"+(l?" "+l:""),children:d}),e("input",{ref:v,type:N,id:w,className:"sg-form-check-input"+(u?" "+u:""),style:g,...b})]})})})),R=r((({children:t,className:n,...r},s)=>e("small",{ref:s,className:"sg-form-text"+(n?" "+n:""),...r,children:t})));Object.assign(A,{Control:H,Select:F,Group:j,Label:O,Check:M,Text:R}),r((({children:n,label:r,controlId:s,className:o,htmlFor:l,...c},d)=>{const i=a((()=>({controlId:s})),[s]);return e(B,{value:i,children:t("div",{className:"sg-form-floating",children:[n,e("label",{ref:d,htmlFor:s,className:"sg-form-floating-label",...c,children:r})]})})}));const q=r((({children:t,className:n,...r},s)=>e("div",{ref:s,className:"sg-input-group"+(n?" "+n:""),...r,children:t}))),z=r((({children:t,className:n,...r},s)=>e("span",{ref:s,className:"sg-input-group-text"+(n?" "+n:""),...r,children:t})));Object.assign(q,{Text:z});const W=s(null),X=({children:t,value:n})=>e(W.Provider,{value:n,children:t}),Y=r((({children:n,as:r="",className:s="",closeButton:o=!1,onClick:a,...l},c)=>{let i=["div","span","h1","h2","h3","h4","h5","h6"].find((e=>e===r))?r:"div";const u=(()=>{const e=d(W);if(!e)throw new Error("useModalContext has to be used within ModalContextProvider!");return e})();return t(i,{ref:c,className:`sg-modal-header ${s}`,...l,children:[n,o?e(N,{variant:!0,onClick:e=>(e=>{a&&a(e),u()})(e)}):null]})})),K=r((({children:t,as:n="h4",className:r,...s},o)=>{let a=["div","span","h1","h2","h3","h4","h5","h6"].find((e=>e===n))?n:"h4";return e(a,{ref:o,className:`sg-modal-title ${r}`,...s,children:t})})),G=r((({children:t,className:n,...r},s)=>e("div",{ref:s,className:`sg-modal-body ${n}`,...r,children:t}))),U=r((({children:t,className:n,...r},s)=>e("div",{ref:s,className:`sg-modal-footer ${n}`,...r,children:t})));Object.assign((({children:t,centered:n=!1,size:r="md",show:s,backdrop:a="static",onHide:c,className:d,id:u,...m})=>{const[f,p]=o(s);l((()=>{p(s)}),[s]);const g=i(null);J(g);let b="boolean"==typeof s&&"function"==typeof c?void 0:{show:"boolean"==typeof s,onHide:"function"==typeof c};b&&console.error(b.show?null:"The variable 'show' must be used and must be a boolean used to decide when to show the modal!",b.onHide?null:"The variable 'onHide' must be used and must be a function which is used to set 'show' as the modal gets closed!");const v=()=>{c&&c(),p(!1)};l((()=>{const e=g.current;e&&(f?(e.classList.remove("close"),e.showModal()):e.close())}),[f]);let w=`sg-modal-tag sg-modal-${r}`;d&&(w+=" "+d),"static"!==a&&"true"!==a||(w+=" sg-modal-static");return h(e("dialog",{ref:g,className:w,onKeyDown:e=>(e=>{if("Escape"!=e.key)return;e.preventDefault();const t=g.current;t.classList.add("close"),t.addEventListener("animationend",(()=>{v()}),{once:!0})})(e),...m,children:e(X,{value:c,children:b?e(Q,{typeCheck:b,closeModal:v}):t})}),document.body)}),{Header:Y,Title:K,Body:G,Footer:U});const J=function(e){l((()=>{const t=t=>{const n='button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])',r=e.current;if(r){const e=r.querySelectorAll(n)[0],s=r.querySelectorAll(n),o=s[s.length-1];if(!("Tab"===t.key))return;t.shiftKey?document.activeElement===e&&(o.focus(),t.preventDefault()):document.activeElement===o&&(e.focus(),t.preventDefault())}};return document.addEventListener("keydown",t,!0),function(){document.removeEventListener("keydown",t,!0)}}),[e])},Q=({typeCheck:r,closeModal:s})=>t(n,{children:[e(Y,{closeButton:!0,children:e(K,{children:"An Error ocurred!"})}),e(G,{children:t("p",{children:[r.show?null:"The variable 'show' must be used and must be a boolean used to decide when to show the modal!",r.onHide?null:"The variable 'onHide' must be used and must be a function which is used to set 'show' as the modal gets closed!"]})}),e(U,{children:e(m,{variant:"danger",type:"button",onClick:()=>s(),children:"Close"})})]}),V=s(null),Z=({children:t,value:n})=>e(V.Provider,{value:n,children:t}),_=r((({children:t,className:n,navbarPrefix:r="sg-navbar-",...s},o)=>{const l=a((()=>r),[r]);return e("nav",{ref:o,className:"sg-navbar"+(n?" "+n:""),...s,children:e(Z,{value:l,children:t})})})),ee=r((({children:t,className:n,href:r="#",as:s="a",...o},a)=>e(s||(r&&"Link"!=s?"a":"span"),{ref:a,href:r,className:"sg-navbar-brand"+(n?" "+n:""),...o,children:t}))),te=r((({children:t,className:n,as:r="span",...s},o)=>e(r,{ref:o,className:"sg-navbar-text"+(n?" "+n:""),...s,children:t})));Object.assign(_,{Brand:ee,Text:te});const ne=r((({children:t,className:n,as:r="ul",...s},o)=>{const a=r,l=d(V);return e(a,{ref:o,className:`${n} ${l||"sg-navbar-"}nav`,...s,children:t})})),re=r((({children:t,className:n,as:r="li",...s},o)=>e(r,{role:"none",ref:o,className:"sg-nav-item"+(n?" "+n:""),...s,children:t}))),se=r((({children:t,className:n,as:r="a",...s},o)=>e(r,{role:"menuitem",ref:o,className:"sg-nav-link"+(n?" "+n:""),...s,children:t})));Object.assign(ne,{Item:re,Link:se});const oe=r((({children:n,className:r,onSelect:s,onToggle:l,controlId:c,toggleProps:d,title:i,menuProps:h,drop:m="down",align:f="start",autoClose:p=!0,show:g="default",...b},v)=>{const[w,N]=o("default"!==g&&g),[y,k]=o({case:""}),C=u((e=>{e.stopPropagation(),N((e=>!e))}),[]),x=((e,t,n=!1)=>{let r=e?n?"bottom-start":"bottom-end":n?"bottom-end":"bottom-start";return"up"===t?r=e?n?"top-start":"top-end":n?"top-end":"top-start":"end"===t?r=e?n?"left-end":"right-end":n?"left-start":"right-start":"start"===t?r=e?n?"right-end":"left-end":n?"right-start":"left-start":"down-centered"===t?r="bottom":"up-centered"===t&&(r="top"),r})("end"===f,m),T=c,E=a((()=>({align:f,drop:m,showInternal:"default"!=g&&l?g:w,handleToggle:"default"!=g&&l?l:C,placement:x,directionClasses:{down:"dropdown","down-centered":"dropdown-center",up:"dropup","up-centered":"dropup-center dropup",end:"dropend",start:"dropstart"},controlId:T,activeDescendant:y,setActiveDescendant:k})),[f,m,g,w,l,C,x,{down:"dropdown","down-centered":"dropdown-center",up:"dropup","up-centered":"dropup-center dropup",end:"dropend",start:"dropstart"},c,y,k]);return e("div",{ref:v,id:c+"-wrapper",className:`sg-dropdown${r?" "+r:""} sg-nav-item`,...b,children:t(I,{value:E,children:[e(D.Toggle,{navDropdown:!0,...d,children:i}),e(D.Menu,{...h,children:n})]})})}));Object.assign(oe,{Toggle:D.Toggle,Menu:D.Menu,Item:D.Item,Divider:D.Divider});const ae=r((({children:t,initialPosition:n={top:0,left:0},id:r,resize:s=!1,move:a=!1,className:c,style:d,...u},m)=>{const[f,p]=o({offSetTop:0,offSetLeft:0,...n}),g=s?"true":"false",b=a?"true":"false",v=i(m),w=i(null),[N,y]=o(!1),k=i(N);l((()=>{k.current=N}),[N]);const I=()=>{a&&(w.current.style.removeProperty("user-select"),y(!1))};return l((()=>(document.body.addEventListener("pointerup",(()=>I()),!0),function(){document.body.removeEventListener("pointerup",(()=>I()),!0)})),[]),h(e("dialog",{"data-resize":g,"data-move":b,"data-passedRef":v,ref:w,id:r,className:"sg-moveable-popout"+(c?" "+c:""),style:{...d,top:f.top,left:f.left,bottom:f.bottom,right:f.right},onPointerDown:e=>{const t=e.target;if(a&&t.className.includes("sg-popout-title")||t.className.includes("sg-popout-header")){const{top:t,left:n}=w.current.getBoundingClientRect();p((r=>({...r,offSetTop:e.clientY-t,offSetLeft:e.clientX-n}))),w.current.style.setProperty("user-select","none"),w.current.setPointerCapture(e.pointerId),y(!0)}},onPointerMove:e=>(e=>{if(a&&k.current&&w.current){const t=e.clientY-f.offSetTop<0,n=window.innerHeight-(e.clientY-f.offSetTop+w.current.offsetHeight)<0,r=e.clientX-f.offSetLeft<0,s=window.innerWidth-(e.clientX-f.offSetLeft+w.current.offsetWidth)<0;let o=t?0:e.clientY-f.offSetTop;o=n?window.innerHeight-w.current.offsetHeight:o;let a=r?0:e.clientX-f.offSetLeft;a=s?window.innerWidth-w.current.offsetWidth:a,p((e=>({...e,top:o,left:a})))}})(e),...u,children:t}),document.body)})),le=r((({children:t,className:n,as:r="div",...s},o)=>{let a=["div","span","h1","h2","h3","h4","h5","h6"].find((e=>e===r))?r:"div";return e(a,{ref:o,className:`sg-popout-header ${n}`,...s,children:t})})),ce=r((({as:t="h4",className:n,children:r,...s},o)=>{let a=["h1","h2","h3","h4","h5","h6"].find((e=>e===t))?t:"h5";return e(a,{ref:o,className:`sg-popout-title ${n}`,...s,children:r})})),de=r((({children:t,className:n,...r},s)=>e("div",{ref:s,className:`sg-popout-body ${n}`,...r,children:t}))),ie=r((({children:t,className:n,...r},s)=>e("p",{ref:s,className:`sg-popout-text ${n}`,...r,children:t}))),ue=r((({children:t,className:n,...r},s)=>e("div",{ref:s,className:`sg-popout-footer ${n}`,...r,children:t})));Object.assign(ae,{Header:le,Title:ce,Body:de,Text:ie,Footer:ue}),r((({size:r="1em",color:s="white",label:o,className:a,controlId:l,...c},d)=>t(n,{children:[e("div",{"aria-labelledby":l,role:"status",ref:d,className:"sg-spinner"+(a?" "+a:""),style:{width:r,height:r,borderColor:s},...c}),e("label",{id:l,className:"sg-visually-hidden",children:o})]}))),r((({children:t,size:n="lg",className:r,...s},o)=>e("table",{ref:o,className:`sg-table${r?" "+r:""}${"sm"===n?" sg-table-sm":""}`,...s,children:t})));const he=s(null),me=({children:t,value:n})=>e(he.Provider,{value:n,children:t}),fe=()=>{const e=d(he);if(!e)throw new Error("useTabContext has to be used within a TabContextProvider!");return e},pe=r((({children:t,className:n,controlId:r,activeClassName:s,defaultActive:l,...c},d)=>{const[i,u]=o(l),h=s||"sg-active",m=a((()=>({activeTab:i,setActiveTab:u,controlId:r,activeClass:h})),[i,u,r]);return e(me,{value:m,children:e("div",{ref:d,id:r+"-tab-wrapper",className:"sg-tabs"+(n?" "+n:""),...c,children:t})})})),ge=r((({children:t,className:n,...r},s)=>{const{controlId:o,activeClass:a}=fe();return e("div",{onKeyDown:e=>(e=>{const t=e.key,n=document.getElementById(o+"-tab-controls");if(n){const r=Array.from(n.children);if("ArrowRight"===t||"ArrowLeft"===t){e.preventDefault();const n=document.querySelector(".sg-tabs-button."+a),s=r.indexOf(n),o="ArrowRight"===t?1:-1,l=s+o<0?r.length-1:s+o>=r.length?0:s+o;r[l].focus(),r[l].click()}else if("Home"===t||"End"===t){e.preventDefault();const n="Home"===t?0:r.length-1;r[n].focus(),r[n].click()}}})(e),role:"tablist",id:o+"-tab-controls",ref:s,className:"sg-tabs-controls"+(n?" "+n:""),...r,children:t})})),be=r((({children:t,className:n,onClick:r,tabId:s,id:o,...a},l)=>{const{activeTab:c,setActiveTab:d,activeClass:i}=fe(),u=c===s;return e("button",{role:"tab",type:"button",id:s+"-button",ref:l,onClick:e=>(e=>{d(s),r&&r(e)})(e),className:"sg-tabs-button"+(n?" "+n:"")+(c===s?" "+i:""),...a,tabIndex:u?0:-1,"aria-selected":u?"true":"false","aria-controls":s+"-page",children:t})})),ve=r((({children:t,className:n,...r},s)=>e("div",{role:"none",ref:s,className:"sg-tabs-content"+(n?" "+n:""),...r,children:t}))),we=r((({children:t,className:n,tabId:r,...s},o)=>{const{activeTab:a,activeClass:l}=fe();return e("div",{role:"tabpanel",id:r+"-page","aria-labelledby":r+"-button",ref:o,className:"sg-tabs-page"+(n?" "+n:"")+(a===r?" "+l:""),...s,children:t})}));Object.assign(pe,{Controls:ge,Button:be,Content:ve,Page:we}),r((({children:t,toggled:n="false",onClick:r,...s},a)=>{const[l,c]=o("true"===n);return e("button",{onClick:e=>(e=>{c((e=>!e)),r&&r(e)})(e),"data-toggled":l,...s,children:t})}));
|
|
1
|
+
import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import{forwardRef as r,createContext as s,useState as o,useMemo as a,useEffect as l,useLayoutEffect as c,useContext as d,useRef as i,useCallback as u}from"react";import{createPortal as h}from"react-dom";const m=r((({children:t,variant:n="primary",className:r,...s},o)=>e("button",{ref:o,type:"button",className:`sg-button sg-button-${n}${null==r?"":" "+r}`,...s,children:t}))),f=r((({children:t,className:n,...r},s)=>e("div",{ref:s,className:"sg-card "+n,...r,children:t}))),p=r((({as:t="div",className:n,children:r,...s},o)=>{let a=["div","span","h1","h2","h3","h4","h5","h6"].find((e=>e===t))?t:"div";return e(a,{ref:o,className:`sg-card-header ${n}`,...s,children:r})})),g=r((({as:t="h5",className:n,children:r,...s},o)=>{let a=["h1","h2","h3","h4","h5","h6"].find((e=>e===t))?t:"h5";return e(a,{ref:o,className:n,...s,children:r})})),v=r((({children:t,className:n,...r},s)=>e("div",{ref:s,className:`sg-card-body ${n}`,...r,children:t}))),b=r((({children:t,className:n,...r},s)=>e("p",{ref:s,className:`sg-card-text ${n}`,...r,children:t}))),N=r((({children:t,className:n,...r},s)=>e("div",{ref:s,className:`sg-card-footer ${n}`,...r,children:t})));var w=Object.assign(f,{Header:p,Body:v,Title:g,Text:b,Footer:N});const y=r((({className:t,variant:n=!1,...r},s)=>e("button",{ref:s,className:`sg-button-close${n?" sg-button-close-white":""} ${t}`,...r,children:e("span",{className:"sg-close-visually-hidden-label",children:"Close"})}))),k=(e,t="")=>{let n=e.target,r=!0,s=!1;for(;r;)n.id!=t+"-menu"?n=n.parentElement:(s=!0,r=!1),"root"===n.id&&(r=!1,s=!1);return s},I=s(null),C=({children:t,value:n})=>e(I.Provider,{value:n,children:t}),x=()=>{const e=d(I);if(!e)throw new Error("useDropdownContext has to be used within DropdownContextProvider!");return e},T=r((({children:t,className:n,onSelect:r,onToggle:s,controlId:l,drop:c="down",align:d="start",autoClose:i=!0,show:u="default",...h},m)=>{const[f,p]=o("default"!==u&&u),[g,v]=o({case:""}),b=e=>{e.stopPropagation(),p((e=>!e))},N=((e,t,n=!1)=>{let r=e?n?"bottom-start":"bottom-end":n?"bottom-end":"bottom-start";return"up"===t?r=e?n?"top-start":"top-end":n?"top-end":"top-start":"end"===t?r=e?n?"left-end":"right-end":n?"left-start":"right-start":"start"===t?r=e?n?"right-end":"left-end":n?"right-start":"left-start":"down-centered"===t?r="bottom":"up-centered"===t&&(r="top"),r})("end"===d,c),w=a((()=>({align:d,drop:c,showInternal:"default"!=u&&s?u:f,handleToggle:"default"!=u&&s?s:b,placement:N,directionClasses:{down:"dropdown","down-centered":"dropdown-center",up:"dropup","up-centered":"dropup-center dropup",end:"dropend",start:"dropstart"},controlId:l,activeDescendant:g,setActiveDescendant:v})),[d,c,u,f,s,N,l,g,v]);return e("div",{id:l+"-wrapper",ref:m,className:"sg-dropdown"+(n?" "+n:""),...h,children:e(C,{value:w,children:t})})})),E=r((({children:t,className:n,navDropdown:r=!1,as:s="button",variant:o="primary",...a},c)=>{const{controlId:d,handleToggle:i,setActiveDescendant:u,showInternal:h}=x(),m=s,f=e=>{let t=!1;switch(console.log(e.key),e.key){case"ArrowDown":t=!0,h?u((e=>({...e,case:"next"}))):(i(e),u((e=>({...e,case:"first"}))));break;case"ArrowUp":t=!0,h?u((e=>({...e,case:"previous"}))):(i(e),u((e=>({...e,case:"last"}))));break;case"Home":t=!0,h&&u((e=>({...e,case:"first"})));break;case"End":t=!0,h&&u((e=>({...e,case:"last"})));break;case"Tab":h&&i(e);break;case"Escape":t=!0,h&&i(e);break;case"Enter":case" ":if(h){t=!0;document.querySelector(".sg-dropdown-item-visual-focus").click(),i(e);break}u((e=>({...e,case:"first"})))}t&&(e.stopPropagation(),e.preventDefault())},p=e=>{if(h&&e.target.id!==d)if(k(e,d)){if(k(e,d)){i(e);const t=document.getElementById(d);t?.focus()}}else i(e)};l((()=>{const e=document.getElementById(d);return e.addEventListener("keydown",f,!0),document.addEventListener("mouseup",p,!0),function(){e.removeEventListener("keydown",f,!0),document.removeEventListener("mouseup",p,!0)}}),[f,d]);let g=`sg-button sg-button${o?"-"+o:"-primary"} sg-dropdown-toggle${n?" "+n:""}`;return("a"===m||r)&&(g="sg-nav-dropdown-toggle sg-dropdown-toggle"+(n?" "+n:"")),e(m,{tabIndex:"0",type:"button","aria-haspopup":"true","aria-controls":d+"-menu","aria-expanded":h,id:d,ref:c,className:g,onClick:e=>(e=>{i(e),h||u((e=>({...e,case:"first"})))})(e),...a,children:t})})),$=r((({children:t,className:n,style:r={},...s},a)=>{const{controlId:d,showInternal:i,activeDescendant:u}=x(),[h,m]=o(r);c((()=>{if(i){const e=document.getElementById(d+"-menu");let t={};e.getBoundingClientRect().right>window.innerWidth?t={...t,right:0}:e.getBoundingClientRect().left<0?t={...t,left:0}:e.getBoundingClientRect().top<0?t={...t,top:0}:e.getBoundingClientRect().bottom>window.innerHeight&&(t={...t,bottom:0}),m((e=>({...e,...t})))}}),[i]),l((()=>{if(i){const e=document.getElementById(d+"-menu"),t=document.getElementById(d+"-menu").children,n=t.length-1,r=document.querySelector(".sg-dropdown-item-visual-focus");let s=0,o=t[0].children[0];if(null!=r){r.classList.remove("sg-dropdown-item-visual-focus");for(let e=0;e<t.length;e++)if(t[e]===r.parentElement){s=e;break}}switch(u.case){case"first":o=t[0].children[0],s=0;break;case"last":o=t[n].children[0],s=n;break;case"next":s=s===n?0:s+1,o=t[s].children[0];break;case"previous":s=0===s?n:s-1,o=t[s].children[0]}e.setAttribute("aria-activedescendant",o.id),t[s].children[0].classList.add("sg-dropdown-item-visual-focus")}else{document.getElementById(d+"-menu").setAttribute("aria-activedescendant","")}}),[d,i,u]);const f=e=>{const t=e.target;let n=t.classList.contains("sg-dropdown-item-visual-focus");const r=document.getElementById(d+"-menu");n||(document.querySelector(".sg-dropdown-item-visual-focus")?.classList.remove("sg-dropdown-item-visual-focus"),r.setAttribute("aria-activedescendant",""),t.classList.add("sg-dropdown-item-visual-focus"),r.setAttribute("aria-activedescendant",t.id))};return l((()=>{const e=document.getElementById(d+"-menu");for(let t of e.children)t.addEventListener("mouseover",f,!0);return function(){for(let t of e.children)t.removeEventListener("mouseover",f,!0)}}),[]),e("ul",{id:d+"-menu",role:"menu",tabIndex:-1,"aria-labelledby":d,ref:a,className:`sg-dropdown-list${n?" "+n:""}${i?" show":""}`,style:h,...s,children:t})})),L=r((({children:t,as:n="button",className:r,...s},o)=>e("li",{role:"none",children:e(n,{ref:o,role:"menuitem",tabIndex:"-1",className:"sg-dropdown-item"+(r?" "+r:""),...s,children:t})}))),D=r((({className:t="",...n},r)=>e("hr",{ref:r,className:`.sg-dropdown-divider${t}`,...n})));var B=Object.assign(T,{Toggle:E,Menu:$,Item:L,Divider:D});const P=s(null),S=({children:t,value:n})=>e(P.Provider,{value:n,children:t}),A=()=>{const e=d(P);if(!e)throw new Error("useFormContext has to be used within a FormContextProvider!");return e},H=r((({children:t,...n},r)=>e("form",{ref:r,...n,children:t}))),F=r((({as:t="input",className:n="",plaintext:r=!1,id:s="",type:o="text",autoFocus:a=!1,...l},c)=>{let d=t;const{controlId:i}=A();return e(d,{autoFocus:a,ref:c,id:i||s,type:o,className:(r?"sg-form-control-plaintext":"sg-form-control")+(""!=n?" "+n:"")+("color"==o?" sg-form-control-color":""),...l})})),j=r((({children:t,className:n,id:r,...s},o)=>{const{controlId:a}=A();return e("select",{ref:o,className:"sg-form-select"+(n?" "+n:""),id:a||r,...s,children:t})})),M=r((({children:t,className:n,controlId:r,...s},o)=>{const l=a((()=>({controlId:r})),[r]);return e("div",{ref:o,className:"sg-from-group"+(n?" "+n:""),...s,children:e(S,{value:l,children:t})})})),O=r((({children:t,className:n,htmlFor:r},s)=>{const{controlId:o}=A();return e("label",{ref:s,htmlFor:r||o,className:"sg-form-label"+(n?" "+n:""),children:t})})),R=r((({classNameContainer:r,containerRef:s,containerId:o,style:a,classNameLabel:l,labelRef:c,label:d,labelId:i,className:u,type:h,id:m,controlId:f,reverse:p=!1,checkStyle:g,...v},b)=>{let N=f||m,w="switch"===h?"checkbox":h;return e("div",{ref:s,id:o,style:a,className:`sg-form-check${p?"-reverse":""}${r?" "+r:""}${"switch"===h?" sg-form-switch":""}`,children:t(n,p?{children:[e("input",{ref:b,type:w,id:N,className:"sg-form-check-input"+(u?" "+u:""),...v}),e("label",{ref:c,id:i,htmlFor:N,className:"sg-form-check-label"+(l?" "+l:""),children:d})]}:{children:[e("label",{ref:c,id:i,htmlFor:N,className:"sg-form-check-label"+(l?" "+l:""),children:d}),e("input",{ref:b,type:w,id:N,className:"sg-form-check-input"+(u?" "+u:""),style:g,...v})]})})})),q=r((({children:t,className:n,...r},s)=>e("small",{ref:s,className:"sg-form-text"+(n?" "+n:""),...r,children:t})));var z=Object.assign(H,{Control:F,Select:j,Group:M,Label:O,Check:R,Text:q});const W=r((({children:n,label:r,controlId:s,className:o,htmlFor:l,...c},d)=>{const i=a((()=>({controlId:s})),[s]);return e(S,{value:i,children:t("div",{className:"sg-form-floating",children:[n,e("label",{ref:d,htmlFor:s,className:"sg-form-floating-label",...c,children:r})]})})})),X=r((({children:t,className:n,...r},s)=>e("div",{ref:s,className:"sg-input-group"+(n?" "+n:""),...r,children:t}))),Y=r((({children:t,className:n,...r},s)=>e("span",{ref:s,className:"sg-input-group-text"+(n?" "+n:""),...r,children:t})));var K=Object.assign(X,{Text:Y});const G=s(null),U=({children:t,value:n})=>e(G.Provider,{value:n,children:t}),J=r((({children:n,as:r="",className:s="",closeButton:o=!1,onClick:a,...l},c)=>{let i=["div","span","h1","h2","h3","h4","h5","h6"].find((e=>e===r))?r:"div";const u=(()=>{const e=d(G);if(!e)throw new Error("useModalContext has to be used within ModalContextProvider!");return e})();return t(i,{ref:c,className:`sg-modal-header ${s}`,...l,children:[n,o?e(y,{variant:!0,onClick:e=>(e=>{a&&a(e),u()})(e)}):null]})})),Q=r((({children:t,as:n="h4",className:r,...s},o)=>{let a=["div","span","h1","h2","h3","h4","h5","h6"].find((e=>e===n))?n:"h4";return e(a,{ref:o,className:`sg-modal-title ${r}`,...s,children:t})})),V=r((({children:t,className:n,...r},s)=>e("div",{ref:s,className:`sg-modal-body ${n}`,...r,children:t}))),Z=r((({children:t,className:n,...r},s)=>e("div",{ref:s,className:`sg-modal-footer ${n}`,...r,children:t})));var _=Object.assign((({children:t,centered:n=!1,size:r="md",show:s,backdrop:a="static",onHide:c,className:d,id:u,...m})=>{const[f,p]=o(s);l((()=>{p(s)}),[s]);const g=i(null);ee(g);let v="boolean"==typeof s&&"function"==typeof c?void 0:{show:"boolean"==typeof s,onHide:"function"==typeof c};v&&console.error(v.show?null:"The variable 'show' must be used and must be a boolean used to decide when to show the modal!",v.onHide?null:"The variable 'onHide' must be used and must be a function which is used to set 'show' as the modal gets closed!");const b=()=>{c&&c(),p(!1)};l((()=>{const e=g.current;e&&(f?(e.classList.remove("close"),e.showModal()):e.close())}),[f]);let N=`sg-modal-tag sg-modal-${r}`;d&&(N+=" "+d),"static"!==a&&"true"!==a||(N+=" sg-modal-static");return h(e("dialog",{ref:g,className:N,onKeyDown:e=>(e=>{if("Escape"!=e.key)return;e.preventDefault();const t=g.current;t.classList.add("close"),t.addEventListener("animationend",(()=>{b()}),{once:!0})})(e),...m,children:e(U,{value:c,children:v?e(te,{typeCheck:v,closeModal:b}):t})}),document.body)}),{Header:J,Title:Q,Body:V,Footer:Z});const ee=function(e){l((()=>{const t=t=>{const n='button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])',r=e.current;if(r){const e=r.querySelectorAll(n)[0],s=r.querySelectorAll(n),o=s[s.length-1];if(!("Tab"===t.key))return;t.shiftKey?document.activeElement===e&&(o.focus(),t.preventDefault()):document.activeElement===o&&(e.focus(),t.preventDefault())}};return document.addEventListener("keydown",t,!0),function(){document.removeEventListener("keydown",t,!0)}}),[e])},te=({typeCheck:r,closeModal:s})=>t(n,{children:[e(J,{closeButton:!0,children:e(Q,{children:"An Error ocurred!"})}),e(V,{children:t("p",{children:[r.show?null:"The variable 'show' must be used and must be a boolean used to decide when to show the modal!",r.onHide?null:"The variable 'onHide' must be used and must be a function which is used to set 'show' as the modal gets closed!"]})}),e(Z,{children:e(m,{variant:"danger",type:"button",onClick:()=>s(),children:"Close"})})]}),ne=s(null),re=({children:t,value:n})=>e(ne.Provider,{value:n,children:t}),se=r((({children:t,className:n,navbarPrefix:r="sg-navbar-",...s},o)=>{const l=a((()=>r),[r]);return e("nav",{ref:o,className:"sg-navbar"+(n?" "+n:""),...s,children:e(re,{value:l,children:t})})})),oe=r((({children:t,className:n,href:r="#",as:s="a",...o},a)=>e(s||(r&&"Link"!=s?"a":"span"),{ref:a,href:r,className:"sg-navbar-brand"+(n?" "+n:""),...o,children:t}))),ae=r((({children:t,className:n,as:r="span",...s},o)=>e(r,{ref:o,className:"sg-navbar-text"+(n?" "+n:""),...s,children:t})));var le=Object.assign(se,{Brand:oe,Text:ae});const ce=r((({children:t,className:n,as:r="ul",...s},o)=>{const a=r,l=d(ne);return e(a,{ref:o,className:`${n} ${l||"sg-navbar-"}nav`,...s,children:t})})),de=r((({children:t,className:n,as:r="li",...s},o)=>e(r,{role:"none",ref:o,className:"sg-nav-item"+(n?" "+n:""),...s,children:t}))),ie=r((({children:t,className:n,as:r="a",...s},o)=>e(r,{role:"menuitem",ref:o,className:"sg-nav-link"+(n?" "+n:""),...s,children:t})));var ue=Object.assign(ce,{Item:de,Link:ie});const he=r((({children:n,className:r,onSelect:s,onToggle:l,controlId:c,toggleProps:d,title:i,menuProps:h,drop:m="down",align:f="start",autoClose:p=!0,show:g="default",...v},b)=>{const[N,w]=o("default"!==g&&g),[y,k]=o({case:""}),I=u((e=>{e.stopPropagation(),w((e=>!e))}),[]),x=((e,t,n=!1)=>{let r=e?n?"bottom-start":"bottom-end":n?"bottom-end":"bottom-start";return"up"===t?r=e?n?"top-start":"top-end":n?"top-end":"top-start":"end"===t?r=e?n?"left-end":"right-end":n?"left-start":"right-start":"start"===t?r=e?n?"right-end":"left-end":n?"right-start":"left-start":"down-centered"===t?r="bottom":"up-centered"===t&&(r="top"),r})("end"===f,m),T=c,E=a((()=>({align:f,drop:m,showInternal:"default"!=g&&l?g:N,handleToggle:"default"!=g&&l?l:I,placement:x,directionClasses:{down:"dropdown","down-centered":"dropdown-center",up:"dropup","up-centered":"dropup-center dropup",end:"dropend",start:"dropstart"},controlId:T,activeDescendant:y,setActiveDescendant:k})),[f,m,g,N,l,I,x,{down:"dropdown","down-centered":"dropdown-center",up:"dropup","up-centered":"dropup-center dropup",end:"dropend",start:"dropstart"},c,y,k]);return e("div",{ref:b,id:c+"-wrapper",className:`sg-dropdown${r?" "+r:""} sg-nav-item`,...v,children:t(C,{value:E,children:[e(B.Toggle,{navDropdown:!0,...d,children:i}),e(B.Menu,{...h,children:n})]})})}));var me=Object.assign(he,{Toggle:B.Toggle,Menu:B.Menu,Item:B.Item,Divider:B.Divider});const fe=r((({children:t,initialPosition:n={top:0,left:0},id:r,resize:s=!1,move:a=!1,className:c,style:d,...u},m)=>{const[f,p]=o({offSetTop:0,offSetLeft:0,...n}),g=s?"true":"false",v=a?"true":"false",b=i(m),N=i(null),[w,y]=o(!1),k=i(w);l((()=>{k.current=w}),[w]);const I=()=>{a&&(N.current.style.removeProperty("user-select"),y(!1))};return l((()=>(document.body.addEventListener("pointerup",(()=>I()),!0),function(){document.body.removeEventListener("pointerup",(()=>I()),!0)})),[]),h(e("dialog",{"data-resize":g,"data-move":v,"data-passedRef":b,ref:N,id:r,className:"sg-moveable-popout"+(c?" "+c:""),style:{...d,top:f.top,left:f.left,bottom:f.bottom,right:f.right},onPointerDown:e=>{const t=e.target;if(a&&t.className.includes("sg-popout-title")||t.className.includes("sg-popout-header")){const{top:t,left:n}=N.current.getBoundingClientRect();p((r=>({...r,offSetTop:e.clientY-t,offSetLeft:e.clientX-n}))),N.current.style.setProperty("user-select","none"),N.current.setPointerCapture(e.pointerId),y(!0)}},onPointerMove:e=>(e=>{if(a&&k.current&&N.current){const t=e.clientY-f.offSetTop<0,n=window.innerHeight-(e.clientY-f.offSetTop+N.current.offsetHeight)<0,r=e.clientX-f.offSetLeft<0,s=window.innerWidth-(e.clientX-f.offSetLeft+N.current.offsetWidth)<0;let o=t?0:e.clientY-f.offSetTop;o=n?window.innerHeight-N.current.offsetHeight:o;let a=r?0:e.clientX-f.offSetLeft;a=s?window.innerWidth-N.current.offsetWidth:a,p((e=>({...e,top:o,left:a})))}})(e),...u,children:t}),document.body)})),pe=r((({children:t,className:n,as:r="div",...s},o)=>{let a=["div","span","h1","h2","h3","h4","h5","h6"].find((e=>e===r))?r:"div";return e(a,{ref:o,className:`sg-popout-header ${n}`,...s,children:t})})),ge=r((({as:t="h4",className:n,children:r,...s},o)=>{let a=["h1","h2","h3","h4","h5","h6"].find((e=>e===t))?t:"h5";return e(a,{ref:o,className:`sg-popout-title ${n}`,...s,children:r})})),ve=r((({children:t,className:n,...r},s)=>e("div",{ref:s,className:`sg-popout-body ${n}`,...r,children:t}))),be=r((({children:t,className:n,...r},s)=>e("p",{ref:s,className:`sg-popout-text ${n}`,...r,children:t}))),Ne=r((({children:t,className:n,...r},s)=>e("div",{ref:s,className:`sg-popout-footer ${n}`,...r,children:t})));var we=Object.assign(fe,{Header:pe,Title:ge,Body:ve,Text:be,Footer:Ne});const ye=r((({size:r="1em",color:s="white",label:o,className:a,controlId:l,...c},d)=>t(n,{children:[e("div",{"aria-labelledby":l,role:"status",ref:d,className:"sg-spinner"+(a?" "+a:""),style:{width:r,height:r,borderColor:s},...c}),e("label",{id:l,className:"sg-visually-hidden",children:o})]}))),ke=r((({children:t,size:n="lg",className:r,...s},o)=>e("table",{ref:o,className:`sg-table${r?" "+r:""}${"sm"===n?" sg-table-sm":""}`,...s,children:t}))),Ie=s(null),Ce=({children:t,value:n})=>e(Ie.Provider,{value:n,children:t}),xe=()=>{const e=d(Ie);if(!e)throw new Error("useTabContext has to be used within a TabContextProvider!");return e},Te=r((({children:t,className:n,controlId:r,activeClassName:s,defaultActive:l,...c},d)=>{const[i,u]=o(l),h=s||"sg-active",m=a((()=>({activeTab:i,setActiveTab:u,controlId:r,activeClass:h})),[i,u,r]);return e(Ce,{value:m,children:e("div",{ref:d,id:r+"-tab-wrapper",className:"sg-tabs"+(n?" "+n:""),...c,children:t})})})),Ee=r((({children:t,className:n,...r},s)=>{const{controlId:o,activeClass:a}=xe();return e("div",{onKeyDown:e=>(e=>{const t=e.key,n=document.getElementById(o+"-tab-controls");if(n){const r=Array.from(n.children);if("ArrowRight"===t||"ArrowLeft"===t){e.preventDefault();const n=document.querySelector(".sg-tabs-button."+a),s=r.indexOf(n),o="ArrowRight"===t?1:-1,l=s+o<0?r.length-1:s+o>=r.length?0:s+o;r[l].focus(),r[l].click()}else if("Home"===t||"End"===t){e.preventDefault();const n="Home"===t?0:r.length-1;r[n].focus(),r[n].click()}}})(e),role:"tablist",id:o+"-tab-controls",ref:s,className:"sg-tabs-controls"+(n?" "+n:""),...r,children:t})})),$e=r((({children:t,className:n,onClick:r,tabId:s,id:o,...a},l)=>{const{activeTab:c,setActiveTab:d,activeClass:i}=xe(),u=c===s;return e("button",{role:"tab",type:"button",id:s+"-button",ref:l,onClick:e=>(e=>{d(s),r&&r(e)})(e),className:"sg-tabs-button"+(n?" "+n:"")+(c===s?" "+i:""),...a,tabIndex:u?0:-1,"aria-selected":u?"true":"false","aria-controls":s+"-page",children:t})})),Le=r((({children:t,className:n,...r},s)=>e("div",{role:"none",ref:s,className:"sg-tabs-content"+(n?" "+n:""),...r,children:t}))),De=r((({children:t,className:n,tabId:r,...s},o)=>{const{activeTab:a,activeClass:l}=xe();return e("div",{role:"tabpanel",id:r+"-page","aria-labelledby":r+"-button",ref:o,className:"sg-tabs-page"+(n?" "+n:"")+(a===r?" "+l:""),...s,children:t})}));var Be=Object.assign(Te,{Controls:Ee,Button:$e,Content:Le,Page:De});const Pe=r((({children:t,toggled:n="false",onClick:r,...s},a)=>{const[l,c]=o("true"===n);return e("button",{onClick:e=>(e=>{c((e=>!e)),r&&r(e)})(e),"data-toggled":l,...s,children:t})}));export{m as Button,w as Card,y as CloseButton,B as Dropdown,W as FloatingLabel,z as Form,K as InputGroup,_ as Modal,ue as Nav,le as NavBar,me as NavDropdown,we as Popout,ye as Spinner,ke as Table,Be as Tabs,Pe as ToggleButton};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|