freemium-ui 2.0.91 → 2.1.0-alpha.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/lib/Accordion-Ccv-p2G6.js +134 -0
- package/lib/Accordion.d.ts +56 -0
- package/lib/Accordion.js +7 -0
- package/lib/Alert-BtEbkVK1.js +52 -0
- package/lib/Alert.d.ts +66 -0
- package/lib/Alert.js +6 -0
- package/lib/AutoComplete-DF33_uur.js +608 -0
- package/lib/AutoComplete.d.ts +105 -0
- package/lib/AutoComplete.js +14 -0
- package/lib/BoxedRadio-D5Kiintm.js +75 -0
- package/lib/BoxedRadio.d.ts +61 -0
- package/lib/BoxedRadio.js +10 -0
- package/lib/Button-Bd1O8_k7.js +34 -0
- package/lib/Button.d.ts +34 -0
- package/lib/Button.js +2 -0
- package/lib/ButtonDropdown-BZvCwUDe.js +37 -0
- package/lib/ButtonDropdown.d.ts +82 -0
- package/lib/ButtonDropdown.js +11 -0
- package/lib/Calendar-C0xW_pPO.js +32 -0
- package/lib/Calendar.d.ts +25 -0
- package/lib/Calendar.js +2 -0
- package/lib/Checkbox-By1CgFUJ.js +66 -0
- package/lib/Checkbox.d.ts +28 -0
- package/lib/Checkbox.js +7 -0
- package/lib/ChevronUp-BWiG3XYd.js +7 -0
- package/lib/Combination-AmN1Cqrf.js +210 -0
- package/lib/Confirmation-49GhlyzQ.js +66 -0
- package/lib/Confirmation.d.ts +72 -0
- package/lib/Confirmation.js +8 -0
- package/lib/Cross-CIeKwtq6.js +7 -0
- package/lib/CustomizeColumns-BSF8e_we.js +865 -0
- package/lib/Drawer-CnmXL5_B.js +33 -0
- package/lib/Drawer.d.ts +50 -0
- package/lib/Drawer.js +8 -0
- package/lib/Dropdown-D59u6zOt.js +89 -0
- package/lib/Dropdown.d.ts +162 -0
- package/lib/Dropdown.js +15 -0
- package/lib/ErrorText-Uvye7uop.js +8 -0
- package/lib/Info-BsILbpCG.js +9 -0
- package/lib/Input.d.ts +66 -0
- package/lib/Input.js +5 -0
- package/lib/Loader-b8lHCp4N.js +13 -0
- package/lib/Loader.d.ts +21 -0
- package/lib/Loader.js +3 -0
- package/lib/Menu-DoE00Mg-.js +19 -0
- package/lib/Menu.d.ts +80 -0
- package/lib/Menu.js +11 -0
- package/lib/Modal-D5RJHnbn.js +51 -0
- package/lib/Modal.d.ts +51 -0
- package/lib/Modal.js +7 -0
- package/lib/MultiSelectDropdown-DblSkVpv.js +84 -0
- package/lib/MultiSelectDropdown.d.ts +116 -0
- package/lib/MultiSelectDropdown.js +14 -0
- package/lib/Pickers.d.ts +94 -0
- package/lib/Pickers.js +16 -0
- package/lib/Popover-BU73-g73.js +90 -0
- package/lib/Popover.d.ts +94 -0
- package/lib/Popover.js +8 -0
- package/lib/QuillEditor.d.ts +29 -0
- package/lib/QuillEditor.js +3369 -0
- package/lib/Radio.d.ts +69 -0
- package/lib/Radio.js +10 -0
- package/lib/RadioGroup-DM_Y48_b.js +42 -0
- package/lib/Reorder-DUSHsq7i.js +697 -0
- package/lib/Reorder.d.ts +36 -0
- package/lib/Reorder.js +5 -0
- package/lib/SortDropdown-B0SSCJX6.js +17 -0
- package/lib/SortDropdown.d.ts +47 -0
- package/lib/SortDropdown.js +10 -0
- package/lib/Table-cidceyn5.js +117 -0
- package/lib/Table.d.ts +95 -0
- package/lib/Table.js +18 -0
- package/lib/Tabs-j1c7ybY-.js +50 -0
- package/lib/Tabs.d.ts +68 -0
- package/lib/Tabs.js +6 -0
- package/lib/Tag-Cu75ReQP.js +49 -0
- package/lib/Tag.d.ts +50 -0
- package/lib/Tag.js +4 -0
- package/lib/TextArea--fiwZ_QM.js +98 -0
- package/lib/ThemeProvider-bWL8hyYA.js +7 -0
- package/lib/ThemeProvider.d.ts +158 -0
- package/lib/ThemeProvider.js +9 -0
- package/lib/TickIcon-BJqSAG4_.js +7 -0
- package/lib/TimePicker-7Uqb3xJn.js +6598 -0
- package/lib/Toast.d.ts +61 -0
- package/lib/Toast.js +10 -0
- package/lib/ToastProvider-CMk1PSzB.js +264 -0
- package/lib/Toggle-BGV7Nc6t.js +59 -0
- package/lib/Toggle.d.ts +35 -0
- package/lib/Toggle.js +6 -0
- package/lib/Tooltip-DU_ATFRB.js +127 -0
- package/lib/Tooltip.d.ts +53 -0
- package/lib/Tooltip.js +8 -0
- package/lib/Typography-BcAppjDF.js +11 -0
- package/lib/Typography.d.ts +20 -0
- package/lib/Typography.js +2 -0
- package/lib/WorkspaceTable-BV5zccyt.js +100 -0
- package/lib/WorkspaceTable.d.ts +85 -0
- package/lib/WorkspaceTable.js +18 -0
- package/lib/_commonjsHelpers-fGXyuM93.js +4 -0
- package/lib/allPaths-DKtiSqHL.js +19 -0
- package/lib/allPathsLoader-Drb6xO2O.js +5 -0
- package/lib/index-B9EcTy5B.js +46 -0
- package/lib/index-BPxkexqj.js +60 -0
- package/lib/index-BROhcSiX.js +8 -0
- package/lib/index-BT1o947S.js +8 -0
- package/lib/index-BY9lf-do.js +2 -0
- package/lib/index-BdTXfGkV.js +24 -0
- package/lib/index-BnDw8kbT.js +135 -0
- package/lib/index-BrF1HKA1.js +338 -0
- package/lib/index-BxNZ3C71.js +4 -0
- package/lib/index-ByHJlnsx.js +26 -0
- package/lib/index-COoRg_pp.js +55 -0
- package/lib/index-CeIB4COQ.js +10 -0
- package/lib/index-Cjkk7z9c.js +19 -0
- package/lib/index-D6iTv28r.js +607 -0
- package/lib/index-D8E8s0tV.js +60 -0
- package/lib/index-DtILdK5l.js +48 -0
- package/lib/index-DtzckyT3.js +4 -0
- package/lib/index-Dy5ztCxm.js +27 -0
- package/lib/index-KMLwCm58.js +607 -0
- package/lib/index-_WvIFKTM.js +6 -0
- package/lib/index.d.ts +1826 -1842
- package/lib/index.js +54 -17049
- package/lib/isTypedArray-DN-UDJh5.js +89 -0
- package/lib/keyframes-PnzFl0I5.js +20 -0
- package/lib/package.json +133 -3
- package/lib/rollup.config.d.ts.map +1 -0
- package/lib/splitPathsBySizeLoader-Cm_vHo5k.js +23 -0
- package/lib/styled-components.browser.esm-Bq2p-e5F.js +479 -0
- package/lib/styles-BbwNLGy3.js +177 -0
- package/lib/styles-BlCCKAZq.js +1192 -0
- package/lib/use-toasts-GqvPVmSy.js +5 -0
- package/package.json +148 -12
- package/buildspec.yml +0 -22
- package/freemium-ui-2.0.91.tgz +0 -0
- package/lib/index.cjs.js +0 -17225
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import n from"react"
|
|
2
|
+
;import{u as t,_ as e,f as i,e as o}from"./styled-components.browser.esm-Bq2p-e5F.js"
|
|
3
|
+
;import{c as r,e as a,h as l,a as s,b as c}from"./index-BPxkexqj.js"
|
|
4
|
+
;import{f as m,g as u}from"./index-D8E8s0tV.js"
|
|
5
|
+
;import{e as p,f as d,g as f,h as g}from"./keyframes-PnzFl0I5.js"
|
|
6
|
+
;import{C as h}from"./Cross-CIeKwtq6.js";var x,v,b,C,k,y,E,j={right:{x:"0",
|
|
7
|
+
right:"0",top:"0"},left:{x:"0",left:"0",top:"0"}},w={small:"424px",
|
|
8
|
+
default:"600px",medium:"720px",large:"800px","x-large":"1200px"
|
|
9
|
+
},D=t(r)(x||(x=e(["\n ","\n"],["\n ","\n"])),m),F=t(a)(v||(v=e(["\n ","\n max-width: ",";\n height: ",";\n position: fixed;\n top: 0;\n display: flex;\n flex-direction: column;\n top: ",";\n bottom: ",";\n left: ",";\n right: ",";\n animation-duration: ",";\n animation-timing-function: ",";\n &[data-state='open'] {\n animation-name: ",";\n }\n &[data-state='closed'] {\n animation-name: ",";\n }\n"],["\n ","\n max-width: ",";\n height: ",";\n position: fixed;\n top: 0;\n display: flex;\n flex-direction: column;\n top: ",";\n bottom: ",";\n left: ",";\n right: ",";\n animation-duration: ",";\n animation-timing-function: ",";\n &[data-state='open'] {\n animation-name: ",";\n }\n &[data-state='closed'] {\n animation-name: ",";\n }\n"])),u,(function(n){
|
|
10
|
+
var t=n.size;return w[t]}),(function(n){return n.isFullHeight?"100vh":"unset"
|
|
11
|
+
}),(function(n){var t=n.placement;return j[t].top}),(function(n){
|
|
12
|
+
var t=n.placement;return j[t].bottom}),(function(n){var t=n.placement
|
|
13
|
+
;return j[t].left}),(function(n){var t=n.placement;return j[t].right
|
|
14
|
+
}),(function(n){return n.theme.transitions.duration.standard}),(function(n){
|
|
15
|
+
return n.theme.transitions.easing.easeIn}),(function(n){var t=n.placement
|
|
16
|
+
;return j[t].right?p:d}),(function(n){var t=n.placement;return j[t].right?f:g
|
|
17
|
+
})),O=t.button(C||(C=e(["\n display: grid;\n place-content: center;\n position: absolute;\n height: 24px;\n width: 24px;\n padding: 0;\n margin: 0;\n background-color: ",";\n border: none;\n left: -24px;\n top: 0px;\n cursor: pointer;\n\n ","\n"],["\n display: grid;\n place-content: center;\n position: absolute;\n height: 24px;\n width: 24px;\n padding: 0;\n margin: 0;\n background-color: ",";\n border: none;\n left: -24px;\n top: 0px;\n cursor: pointer;\n\n ","\n"])),(function(n){
|
|
18
|
+
return n.theme.colors.text.primary}),(function(n){
|
|
19
|
+
return"dark"===n.theme.mode&&i(b||(b=e(["\n background-color: ",";\n "],["\n background-color: ",";\n "])),(function(n){
|
|
20
|
+
return n.theme.colors.fill.inverse}))
|
|
21
|
+
})),z=t(l)(k||(k=e(["\n left: ",";\n right: ",";\n"],["\n left: ",";\n right: ",";\n"])),(function(n){
|
|
22
|
+
return"right"===n.placement?"-24px":"unset"}),(function(n){
|
|
23
|
+
return"left"===n.placement?"-24px":"unset"
|
|
24
|
+
})),H=t(s)(y||(y=e([""],[""]))),I=t(c)(E||(E=e([""],[""]))),M=function(t){
|
|
25
|
+
var e=t.isOpen,i=t.children,r=t.hideDismissIcon,a=t.customClass,l=void 0===a?"":a,s=t.size,c=void 0===s?"default":s,m=t.isFullHeight,u=void 0===m||m,p=t.placement,d=void 0===p?"right":p,f=t.clickOutToClose,g=void 0!==f&&f,x=t.onDismiss,v=o(),b="rtl"===v.direction?"right"===d?"left":"right":d
|
|
26
|
+
;return n.createElement(H,{open:e,onOpenChange:function(n){n||null==x||x()}
|
|
27
|
+
},n.createElement(I,null,n.createElement(D,{forceMount:!0,
|
|
28
|
+
className:"DialogOverlay",onClick:function(){g&&(null==x||x())}
|
|
29
|
+
}),n.createElement(F,{forceMount:!0,
|
|
30
|
+
className:"DialogContent ".concat(null!=l?l:"").trim(),isFullHeight:u,size:c,
|
|
31
|
+
placement:b,dir:v.direction},!r&&n.createElement(z,{asChild:!0,placement:b
|
|
32
|
+
},n.createElement(O,{"aria-label":"Close"},n.createElement(h,{
|
|
33
|
+
fill:v.colors.text.inverse}))),i)))};export{M as D};
|
package/lib/Drawer.d.ts
ADDED
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import React$1 from 'react';
|
|
3
|
+
|
|
4
|
+
type DrawerSizeType = 'default' | 'medium' | 'small' | 'large' | 'x-large';
|
|
5
|
+
type DrawerPlacement = 'left' | 'right';
|
|
6
|
+
interface DrawerProps {
|
|
7
|
+
/**
|
|
8
|
+
* The children to be displayed in the drawer
|
|
9
|
+
*/
|
|
10
|
+
children?: React.ReactNode | string;
|
|
11
|
+
/**
|
|
12
|
+
* Whether the drawer is open
|
|
13
|
+
*/
|
|
14
|
+
isOpen?: boolean;
|
|
15
|
+
/**
|
|
16
|
+
* The placement of the drawer
|
|
17
|
+
*/
|
|
18
|
+
placement?: DrawerPlacement;
|
|
19
|
+
/**
|
|
20
|
+
* The size of the drawer
|
|
21
|
+
*/
|
|
22
|
+
size?: DrawerSizeType;
|
|
23
|
+
/**
|
|
24
|
+
* Whether the drawer is full height
|
|
25
|
+
*/
|
|
26
|
+
isFullHeight?: boolean;
|
|
27
|
+
/**
|
|
28
|
+
* Should the drawer close when clicking outside
|
|
29
|
+
*/
|
|
30
|
+
clickOutToClose?: boolean;
|
|
31
|
+
/**
|
|
32
|
+
* Should we hide the dismiss icon
|
|
33
|
+
*/
|
|
34
|
+
hideDismissIcon?: boolean;
|
|
35
|
+
/**
|
|
36
|
+
* Custom class to be added to the drawer
|
|
37
|
+
*/
|
|
38
|
+
customClass?: string;
|
|
39
|
+
/**
|
|
40
|
+
* Function to be called when the drawer is dismissed
|
|
41
|
+
*/
|
|
42
|
+
onDismiss?: () => void;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
/**
|
|
46
|
+
* Drawer component is used to show a drawer to the user. It is used to show additional information or actions. It can be used to show a menu, a form, or any other content.
|
|
47
|
+
*/
|
|
48
|
+
declare const Drawer: ({ isOpen, children, hideDismissIcon, customClass, size, isFullHeight, placement, clickOutToClose, onDismiss, }: DrawerProps) => React$1.JSX.Element;
|
|
49
|
+
|
|
50
|
+
export { Drawer, type DrawerPlacement, type DrawerProps, type DrawerSizeType };
|
package/lib/Drawer.js
ADDED
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
export{D as Drawer}from"./Drawer-CnmXL5_B.js";import"react"
|
|
2
|
+
;import"./styled-components.browser.esm-Bq2p-e5F.js";import"./index-BPxkexqj.js"
|
|
3
|
+
;import"./index-ByHJlnsx.js";import"react-dom";import"./index-CeIB4COQ.js"
|
|
4
|
+
;import"./index-BdTXfGkV.js";import"./index-BxNZ3C71.js"
|
|
5
|
+
;import"./index-COoRg_pp.js";import"./Combination-AmN1Cqrf.js"
|
|
6
|
+
;import"./index-Dy5ztCxm.js";import"./index-D8E8s0tV.js"
|
|
7
|
+
;import"./index-BnDw8kbT.js";import"./keyframes-PnzFl0I5.js"
|
|
8
|
+
;import"./Cross-CIeKwtq6.js";
|
|
@@ -0,0 +1,89 @@
|
|
|
1
|
+
import{a as e,e as t,b as l}from"./styled-components.browser.esm-Bq2p-e5F.js"
|
|
2
|
+
;import n from"react"
|
|
3
|
+
;import{S as a,a as r,b as o,c as i,d as s,e as c,E as m,f as u,g as d,h as p,i as f,j as v,k as E,l as g,m as h,n as y,u as b,D as C,A as I,o as w,I as S,L as k,T as O}from"./styles-BlCCKAZq.js"
|
|
4
|
+
;import{S as T,R as x,a as N}from"./index-D8E8s0tV.js"
|
|
5
|
+
;import{E as L}from"./ErrorText-Uvye7uop.js"
|
|
6
|
+
;import{C as j}from"./ChevronUp-BWiG3XYd.js"
|
|
7
|
+
;import{C as V}from"./Cross-CIeKwtq6.js"
|
|
8
|
+
;import{T as P}from"./TickIcon-BJqSAG4_.js"
|
|
9
|
+
;import{I as F}from"./TextArea--fiwZ_QM.js"
|
|
10
|
+
;import{L as M}from"./Loader-b8lHCp4N.js";var $=function(t){
|
|
11
|
+
var a=t.type,r=void 0===a?"button":a,o=e(t,["type"])
|
|
12
|
+
;return"button"===r?n.createElement(R,l({},o,{type:"button"
|
|
13
|
+
})):n.createElement(A,l({},o,{type:"input"}))},R=function(e){
|
|
14
|
+
var a,r=t(),o=e.itemIdentifier,b=void 0===o?"id":o,C=e.label,I=e.id,w=e.items,S=void 0===w?[]:w,k=e.onChange,O=e.placeholder,N=e.readOnly,V=void 0!==N&&N,P=e.disabled,F=void 0!==P&&P,$=e.isRequired,R=void 0!==$&&$,A=e.showTick,B=void 0===A||A,H=e.itemToString,D=e.name,W=e.itemComponent,G=e.width,K=e.className,U=e.style,z=e.defaultSelectedItem,J=void 0===z?null:z,Q=e.isErrored,X=e.portalContainer,Y=e.isMenuLoading,Z=e.errorText,_=e.defaultIsOpen,ee=e.matchButtonWidth,te=void 0===ee||ee,le=e.isOpen,ne=e.buttonContentProps,ae=e.selectedItemComponent,re=n.useMemo((function(){
|
|
15
|
+
var e=S.reduce((function(e,t){var l,n=null!==(l=t.group)&&void 0!==l?l:"default"
|
|
16
|
+
;return e[n]?e[n].push(t):e[n]=[t],e}),{})
|
|
17
|
+
;return Object.keys(e).sort((function(e,t){return"default"!==e?1:-1
|
|
18
|
+
})).map((function(t){return{key:t,items:e[t]}}))
|
|
19
|
+
}),[S]),oe=n.useState(J),ie=oe[0],se=oe[1]
|
|
20
|
+
;return n.createElement(i,null,C&&n.createElement(n.Fragment,null,n.createElement(T,{
|
|
21
|
+
className:"input-label","aria-label":C,htmlFor:I
|
|
22
|
+
},C,C&&R&&n.createElement(x,null,"*"))),n.createElement(s,{open:le,
|
|
23
|
+
defaultOpen:_,name:D,required:R,disabled:F,
|
|
24
|
+
value:null!==(a=null==J?void 0:J[b])&&void 0!==a?a:void 0,
|
|
25
|
+
onValueChange:function(e){if(!V){var t=S.find((function(t){
|
|
26
|
+
return(null==t?void 0:t[b])===e}));se(t),null==k||k(null!=t?t:null)}}
|
|
27
|
+
},n.createElement(c,{className:"SelectTrigger ".concat(null!=K?K:"").trim(),
|
|
28
|
+
"aria-label":null!=C?C:"dropdown",disabled:F,id:I,$isErrored:!!Q,
|
|
29
|
+
"aria-invalid":!!Q,width:G,style:U
|
|
30
|
+
},O||null!==J?ie&&ae?ae(ie):n.createElement(u,{
|
|
31
|
+
className:"SelectValue ".concat(null!=K?K:"").trim(),placeholder:O
|
|
32
|
+
}):n.createElement(m,null),n.createElement(d,{
|
|
33
|
+
className:"SelectIcon ".concat(null!=K?K:"").trim()},n.createElement(j,{
|
|
34
|
+
fill:r.colors.text.primary}))),n.createElement(p,{container:X
|
|
35
|
+
},n.createElement(f,l({className:"SelectContent ".concat(null!=K?K:"").trim(),
|
|
36
|
+
position:"popper",side:"bottom",sideOffset:4,avoidCollisions:!0,
|
|
37
|
+
$matchButtonWidth:te
|
|
38
|
+
},ne),Y?n.createElement(v,null,n.createElement(M,null)):n.createElement(n.Fragment,null,n.createElement(E,{
|
|
39
|
+
className:"SelectViewport ".concat(null!=K?K:"").trim()},re.map((function(e){
|
|
40
|
+
return n.createElement(g,{key:e.key,
|
|
41
|
+
className:"SelectGroup ".concat(null!=K?K:"").trim()
|
|
42
|
+
},"default"!==e.key&&n.createElement(h,{
|
|
43
|
+
className:"SelectLabel ".concat(null!=K?K:"").trim()
|
|
44
|
+
},e.key,n.createElement(y,null)),e.items.map((function(e,t){
|
|
45
|
+
var l,a="string"==typeof e?e:null==e?void 0:e[b],r=null!==(l=null==e?void 0:e[b])&&void 0!==l?l:""
|
|
46
|
+
;return void 0!==r&&""!==r||console.warn("No value for item",{item:e,value:r
|
|
47
|
+
}),n.createElement(n.Fragment,null,W?W(e,{key:a,value:null!=r?r:a,
|
|
48
|
+
disabled:!!e.disabled,showTick:B}):n.createElement(q,{key:a,value:r||a,
|
|
49
|
+
disabled:!!e.disabled,showTick:B},H(e,"list-item")))})))
|
|
50
|
+
}))))))),Q&&Z&&n.createElement(L,null,Z))},A=function(e){
|
|
51
|
+
var a=e.itemIdentifier,r=void 0===a?"id":a,o=e.label,i=e.id,s=e.items,c=void 0===s?[]:s,m=e.placeholder,u=e.readOnly,d=void 0!==u&&u,p=e.disabled,f=void 0!==p&&p,E=e.isRequired,g=void 0!==E&&E,h=e.hideClear,y=void 0!==h&&h,j=e.itemToString,$=e.name,R=e.filterKey,A=e.width,q=e.customValues,B=e.onCustomValueAdd,H=e.itemComponent,D=e.emptyItemsText,W=e.getCustomMessage,G=e.style,K=e.onChange,U=e.useComboboxProps,z=e.isErrored,J=e.errorText,Q=e.defaultSelectedItem,X=e.isMenuLoading,Y=e.clearInputOnselect,Z=void 0!==Y&&Y,_=t(),ee=n.useState(c),te=ee[0],le=ee[1],ne=b(l({
|
|
52
|
+
id:i,selectedItem:Q,items:te,onSelectedItemChange:function(e){
|
|
53
|
+
var t=e.selectedItem;null==K||K(null!=t?t:null)},onIsOpenChange:function(e){
|
|
54
|
+
var t=e.isOpen
|
|
55
|
+
;if(t&&(""===pe||re&&R&&(pe||"").toLowerCase()==="".concat((null==re?void 0:re[R||r])||"").toLowerCase()))le(c),
|
|
56
|
+
ue(re?c.indexOf(re):-1);else{var l=re?j(re):"";re&&!t&&l!==pe&&de(l)}
|
|
57
|
+
t||le(c),Z&&de("")},onInputValueChange:function(e){var t=e.inputValue
|
|
58
|
+
;ae&&(""===t||re&&R&&(t||"").toLowerCase()==="".concat((null==re?void 0:re[R||r])||"").toLowerCase())?le(c):le((function(e){
|
|
59
|
+
return e.filter((function(e){var l="string"==typeof e?e:null==e?void 0:e[R||r]
|
|
60
|
+
;return!t||l.toLowerCase().includes(t.toLowerCase())}))}))},
|
|
61
|
+
itemToString:function(e){return e?j(e,"downshift"):""}
|
|
62
|
+
},U)),ae=ne.isOpen,re=ne.selectedItem,oe=ne.getToggleButtonProps,ie=ne.getLabelProps,se=ne.getMenuProps,ce=ne.openMenu,me=ne.highlightedIndex,ue=ne.setHighlightedIndex,de=ne.setInputValue,pe=ne.inputValue,fe=ne.getItemProps,ve=ne.getInputProps,Ee=!f&&!d&&ae
|
|
63
|
+
;return n.createElement(C,{width:A},n.createElement(T,l({className:"input-label"
|
|
64
|
+
},ie({disabled:f,readOnly:d
|
|
65
|
+
})),o,o&&g&&n.createElement(x,null,"*")),n.createElement(F,l({},ve({name:$,
|
|
66
|
+
readOnly:d,disabled:f}),{placeholder:m,
|
|
67
|
+
endAdornment:n.createElement(I,null,!f&&!d&&!y&&re&&n.createElement(N,{
|
|
68
|
+
"aria-label":"close",onClick:function(e){
|
|
69
|
+
de(""),null==K||K(null),ce(),e.stopPropagation()},style:{borderRadius:"50%"}
|
|
70
|
+
},n.createElement(V,{fill:_.colors.text.primary})),n.createElement(N,l({},oe({
|
|
71
|
+
disabled:f,readOnly:d,"aria-label":"toggle-button"})),n.createElement(w,{
|
|
72
|
+
$isOpen:Ee,fill:_.colors.text.primary,width:8,height:8}))),style:G
|
|
73
|
+
})),!d&&!f&&n.createElement(S,l({className:"ItemsContainer",$isOpen:ae},se({
|
|
74
|
+
disabled:f,readOnly:d
|
|
75
|
+
})),X?n.createElement(v,null,n.createElement(M,null)):n.createElement(n.Fragment,null,ae&&0===te.length&&n.createElement(n.Fragment,null,q?n.createElement(k,null,n.createElement(O,{
|
|
76
|
+
onClick:function(e){e.stopPropagation(),B&&B({inputValue:pe,customValues:!0
|
|
77
|
+
}),de("")}},(null==W?void 0:W(pe))||"Click to add")):n.createElement(k,{
|
|
78
|
+
readOnly:!0},D||"No items")),ae&&te.map((function(e,t){
|
|
79
|
+
var a="string"==typeof e?e:null==e?void 0:e[r]
|
|
80
|
+
;return n.createElement(n.Fragment,{key:a},H?H(e,l({isHilighted:me===t,
|
|
81
|
+
isSelected:re===e,key:a},fe({item:e,index:t}))):n.createElement(k,l({
|
|
82
|
+
$isHilighted:me===t,$isSelected:re===e,key:a},fe({item:e,index:t
|
|
83
|
+
})),j(e),re===e&&n.createElement(P,{fill:_.colors.common.accent})))
|
|
84
|
+
})))),z&&J&&n.createElement(L,null,J))},q=n.forwardRef((function(i,s){
|
|
85
|
+
var c=i.children,m=i.showTick,u=void 0===m||m,d=e(i,["children","showTick"]),p=t()
|
|
86
|
+
;return n.createElement(a,l({className:"SelectItem"},d,{ref:s
|
|
87
|
+
}),n.createElement(r,{className:"SelectItemText"},c),u&&n.createElement(o,{
|
|
88
|
+
className:"SelectItemIndicator"},n.createElement(P,{fill:p.colors.common.accent
|
|
89
|
+
})))}));export{$ as D,q as I};
|
|
@@ -0,0 +1,162 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import * as Select from '@radix-ui/react-select';
|
|
3
|
+
import { SelectProps, SelectContentProps, SelectItemProps } from '@radix-ui/react-select';
|
|
4
|
+
export { Item as RadixSelectItem } from '@radix-ui/react-select';
|
|
5
|
+
import * as styled_components from 'styled-components';
|
|
6
|
+
import * as styled_components_dist_types from 'styled-components/dist/types';
|
|
7
|
+
import * as react from 'react';
|
|
8
|
+
import react__default from 'react';
|
|
9
|
+
import { PortalProps } from '@radix-ui/react-popover';
|
|
10
|
+
import { UseSelectProps, UseComboboxProps } from 'downshift';
|
|
11
|
+
|
|
12
|
+
type DropdownTypes = 'button' | 'input';
|
|
13
|
+
type DefaultDropdownItem = {
|
|
14
|
+
[key: string]: any;
|
|
15
|
+
group?: string;
|
|
16
|
+
};
|
|
17
|
+
type StyledListItemType = {
|
|
18
|
+
readOnly?: boolean;
|
|
19
|
+
$isSelected?: boolean;
|
|
20
|
+
$isHilighted?: boolean;
|
|
21
|
+
};
|
|
22
|
+
type DropdownInputItemProps = React.LiHTMLAttributes<HTMLLIElement> & StyledListItemType & {
|
|
23
|
+
key: string;
|
|
24
|
+
};
|
|
25
|
+
type PickedSelectProps = Pick<SelectProps, 'name' | 'disabled' | 'value'>;
|
|
26
|
+
interface DropdownProps<T extends DefaultDropdownItem = DefaultDropdownItem> extends PickedSelectProps {
|
|
27
|
+
/**
|
|
28
|
+
* The items to be displayed in the dropdown
|
|
29
|
+
*/
|
|
30
|
+
items?: Array<T>;
|
|
31
|
+
/**
|
|
32
|
+
* The identifier for the items
|
|
33
|
+
*/
|
|
34
|
+
itemIdentifier?: string;
|
|
35
|
+
isOpen?: SelectProps['open'];
|
|
36
|
+
defaultIsOpen?: SelectProps['defaultOpen'];
|
|
37
|
+
/**
|
|
38
|
+
* The selected item
|
|
39
|
+
*/
|
|
40
|
+
defaultSelectedItem?: T | null;
|
|
41
|
+
/**
|
|
42
|
+
* Function to be called when the selected item changes
|
|
43
|
+
*/
|
|
44
|
+
onChange?: (item: T | null) => void;
|
|
45
|
+
/**
|
|
46
|
+
* Fuction to give the string representation of the item
|
|
47
|
+
*/
|
|
48
|
+
itemToString: (item: T, type?: 'list-item' | 'display' | 'downshift') => string;
|
|
49
|
+
/**
|
|
50
|
+
* The type of the dropdown
|
|
51
|
+
*/
|
|
52
|
+
type?: DropdownTypes;
|
|
53
|
+
/**
|
|
54
|
+
* Is the dropdown read only
|
|
55
|
+
*/
|
|
56
|
+
readOnly?: boolean;
|
|
57
|
+
/**
|
|
58
|
+
* Is the dropdown read only
|
|
59
|
+
*/
|
|
60
|
+
showTick?: boolean;
|
|
61
|
+
/**
|
|
62
|
+
* The width of the dropdown
|
|
63
|
+
*/
|
|
64
|
+
width?: string;
|
|
65
|
+
/**
|
|
66
|
+
* The key to be used for filtering
|
|
67
|
+
*/
|
|
68
|
+
filterKey?: string;
|
|
69
|
+
/**
|
|
70
|
+
*
|
|
71
|
+
*/
|
|
72
|
+
getCustomMessage?: (inoutValue: string) => string;
|
|
73
|
+
/**
|
|
74
|
+
*
|
|
75
|
+
*/
|
|
76
|
+
emptyItemsText?: string;
|
|
77
|
+
/**
|
|
78
|
+
*
|
|
79
|
+
*/
|
|
80
|
+
hideClear?: boolean;
|
|
81
|
+
/**
|
|
82
|
+
*
|
|
83
|
+
*/
|
|
84
|
+
errorText?: string;
|
|
85
|
+
/**
|
|
86
|
+
*
|
|
87
|
+
*/
|
|
88
|
+
className?: string;
|
|
89
|
+
/**
|
|
90
|
+
*
|
|
91
|
+
*/
|
|
92
|
+
style?: React.CSSProperties;
|
|
93
|
+
/**
|
|
94
|
+
*
|
|
95
|
+
*/
|
|
96
|
+
isErrored?: boolean;
|
|
97
|
+
/**
|
|
98
|
+
*
|
|
99
|
+
*/
|
|
100
|
+
isRequired?: boolean;
|
|
101
|
+
/**
|
|
102
|
+
*
|
|
103
|
+
*/
|
|
104
|
+
isMenuLoading?: boolean;
|
|
105
|
+
/**
|
|
106
|
+
*
|
|
107
|
+
*/
|
|
108
|
+
matchButtonWidth?: boolean;
|
|
109
|
+
/**
|
|
110
|
+
*
|
|
111
|
+
*/
|
|
112
|
+
onCustomValueAdd?: (item: {
|
|
113
|
+
inputValue: string;
|
|
114
|
+
customValues: boolean;
|
|
115
|
+
}) => void;
|
|
116
|
+
/**
|
|
117
|
+
*
|
|
118
|
+
*/
|
|
119
|
+
customValues?: boolean;
|
|
120
|
+
/**
|
|
121
|
+
*
|
|
122
|
+
*/
|
|
123
|
+
id?: string;
|
|
124
|
+
/**
|
|
125
|
+
*
|
|
126
|
+
*/
|
|
127
|
+
label?: string;
|
|
128
|
+
/**
|
|
129
|
+
*
|
|
130
|
+
*/
|
|
131
|
+
placeholder?: string;
|
|
132
|
+
/**
|
|
133
|
+
*
|
|
134
|
+
*/
|
|
135
|
+
useSelectProps?: UseSelectProps<T>;
|
|
136
|
+
/**
|
|
137
|
+
*
|
|
138
|
+
*/
|
|
139
|
+
useComboboxProps?: UseComboboxProps<T>;
|
|
140
|
+
itemComponent?: (item: T, props?: DropdownItemProps | DropdownInputItemProps) => React.ReactNode | string;
|
|
141
|
+
selectedItemComponent?: (item: T) => React.ReactNode | string;
|
|
142
|
+
clearInputOnselect?: boolean;
|
|
143
|
+
buttonContentProps?: SelectContentProps;
|
|
144
|
+
portalContainer?: PortalProps['container'];
|
|
145
|
+
}
|
|
146
|
+
type DropdownButtonProps<T extends DefaultDropdownItem = DefaultDropdownItem> = DropdownProps<T>;
|
|
147
|
+
type DropdownInputProps<T extends DefaultDropdownItem = DefaultDropdownItem> = DropdownProps<T>;
|
|
148
|
+
type DropdownItemProps = SelectItemProps & {
|
|
149
|
+
showTick: boolean;
|
|
150
|
+
};
|
|
151
|
+
|
|
152
|
+
declare const ListItem: styled_components.IStyledComponent<"web", styled_components_dist_types.Substitute<react.DetailedHTMLProps<react.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, StyledListItemType>>;
|
|
153
|
+
|
|
154
|
+
/**
|
|
155
|
+
* Dropdown displays a list or drop-down box that enables selection of an option or multiple options from an available list of values.
|
|
156
|
+
*/
|
|
157
|
+
declare const Dropdown: <T extends DefaultDropdownItem>({ type, ...props }: DropdownProps<T>) => react__default.JSX.Element;
|
|
158
|
+
declare const Item: react__default.ForwardRefExoticComponent<Select.SelectItemProps & {
|
|
159
|
+
showTick: boolean;
|
|
160
|
+
} & react__default.RefAttributes<HTMLDivElement>>;
|
|
161
|
+
|
|
162
|
+
export { type DefaultDropdownItem, Dropdown, type DropdownButtonProps, ListItem as DropdownInputItem, type DropdownInputItemProps, type DropdownInputProps, Item as DropdownItem, type DropdownItemProps, type DropdownProps, type DropdownTypes, type StyledListItemType };
|
package/lib/Dropdown.js
ADDED
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
export{L as DropdownInputItem,$ as RadixSelectItem}from"./styles-BlCCKAZq.js"
|
|
2
|
+
;export{D as Dropdown,I as DropdownItem}from"./Dropdown-D59u6zOt.js"
|
|
3
|
+
;import"./index-ByHJlnsx.js";import"react";import"react-dom"
|
|
4
|
+
;import"./_commonjsHelpers-fGXyuM93.js"
|
|
5
|
+
;import"./styled-components.browser.esm-Bq2p-e5F.js";import"./index-CeIB4COQ.js"
|
|
6
|
+
;import"./index-BdTXfGkV.js";import"./index-Cjkk7z9c.js"
|
|
7
|
+
;import"./index-BY9lf-do.js";import"./index-COoRg_pp.js"
|
|
8
|
+
;import"./Combination-AmN1Cqrf.js";import"./index-BxNZ3C71.js"
|
|
9
|
+
;import"./index-BrF1HKA1.js";import"./index-BROhcSiX.js"
|
|
10
|
+
;import"./index-DtzckyT3.js";import"./index-_WvIFKTM.js"
|
|
11
|
+
;import"./keyframes-PnzFl0I5.js";import"./index-BnDw8kbT.js"
|
|
12
|
+
;import"./ChevronUp-BWiG3XYd.js";import"./index-D8E8s0tV.js"
|
|
13
|
+
;import"./ErrorText-Uvye7uop.js";import"./Cross-CIeKwtq6.js"
|
|
14
|
+
;import"./TickIcon-BJqSAG4_.js";import"./TextArea--fiwZ_QM.js"
|
|
15
|
+
;import"./Loader-b8lHCp4N.js";
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import{u as n,_ as t,b as e}from"./styled-components.browser.esm-Bq2p-e5F.js"
|
|
2
|
+
;import o from"react"
|
|
3
|
+
;var r,i=n.span(r||(r=t(["\n direction: ",";\n color: ",";\n font-family: ",";\n font-size: 12px;\n font-weight: 400;\n line-height: 20px;\n"],["\n direction: ",";\n color: ",";\n font-family: ",";\n font-size: 12px;\n font-weight: 400;\n line-height: 20px;\n"])),(function(n){
|
|
4
|
+
return n.theme.direction}),(function(n){return n.theme.colors.text.error
|
|
5
|
+
}),(function(n){return n.theme.typography.fontFamily})),a=function(n){var t
|
|
6
|
+
;return o.createElement(i,e({"aria-live":"polite",role:"status"},n,{
|
|
7
|
+
className:"input-helper ".concat(null!==(t=n.className)&&void 0!==t?t:"").trim()
|
|
8
|
+
}),n.children)};export{a as E};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import{b as e}from"./styled-components.browser.esm-Bq2p-e5F.js"
|
|
2
|
+
;import t from"react";var C=t.forwardRef((function(C,r){
|
|
3
|
+
return t.createElement("svg",e({width:"16",height:"16",viewBox:"0 0 16 16",
|
|
4
|
+
fill:"none",xmlns:"http://www.w3.org/2000/svg"},C,{ref:r
|
|
5
|
+
}),t.createElement("rect",{width:"16",height:"16",fill:"white",
|
|
6
|
+
"fill-opacity":"0.01"}),t.createElement("path",{fill:C.fill,
|
|
7
|
+
"fill-rule":"evenodd","clip-rule":"evenodd",
|
|
8
|
+
d:"M8 1C4.14 1 1 4.14 1 8C1 11.86 4.14 15 8 15C11.86 15 15 11.86 15 8C15 4.14 11.86 1 8 1ZM8 13.8C4.8 13.8 2.2 11.2 2.2 8C2.2 4.8 4.8 2.2 8 2.2C11.2 2.2 13.8 4.8 13.8 8C13.8 11.2 11.2 13.8 8 13.8ZM8.00003 6.24004C8.50003 6.24004 8.91003 5.83004 8.91003 5.33004C8.91003 4.83004 8.50003 4.42004 8.00003 4.42004C7.50003 4.42004 7.09003 4.83004 7.09003 5.33004C7.09003 5.83004 7.50003 6.24004 8.00003 6.24004ZM8.00003 5.04004C8.16003 5.04004 8.29003 5.17004 8.29003 5.33004C8.29003 5.49004 8.16003 5.62004 8.00003 5.62004C7.84003 5.62004 7.71003 5.49004 7.71003 5.33004C7.71003 5.17004 7.84003 5.04004 8.00003 5.04004ZM8.60002 10.37H8.86002C9.19002 10.37 9.46002 10.64 9.46002 10.97C9.46002 11.3 9.19002 11.57 8.86002 11.57H7.12002C6.79002 11.57 6.52002 11.3 6.52002 10.97C6.52002 10.64 6.79002 10.37 7.12002 10.37H7.39002V8.24996C7.15002 8.16996 6.96002 7.94996 6.96002 7.67996C6.96002 7.34996 7.23002 7.07996 7.56002 7.07996H8.43002C8.76002 7.07996 9.03002 7.34996 9.03002 7.67996C9.03002 7.95996 8.85002 8.17996 8.60002 8.24996V10.37Z"
|
|
9
|
+
}))}));export{C as I};
|
package/lib/Input.d.ts
ADDED
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import React$1 from 'react';
|
|
3
|
+
import { LabelProps } from '@radix-ui/react-label';
|
|
4
|
+
|
|
5
|
+
interface CommonProps {
|
|
6
|
+
/**
|
|
7
|
+
* Is this a required field?
|
|
8
|
+
*/
|
|
9
|
+
isRequired?: boolean;
|
|
10
|
+
/**
|
|
11
|
+
* Is this a error field?
|
|
12
|
+
*/
|
|
13
|
+
isErrored?: boolean;
|
|
14
|
+
/**
|
|
15
|
+
* Error text to be shown
|
|
16
|
+
*/
|
|
17
|
+
errorText?: string;
|
|
18
|
+
/**
|
|
19
|
+
* Id of the button
|
|
20
|
+
*/
|
|
21
|
+
id?: string;
|
|
22
|
+
/**
|
|
23
|
+
* Id of the button
|
|
24
|
+
*/
|
|
25
|
+
label?: string;
|
|
26
|
+
/**
|
|
27
|
+
* Label of the button
|
|
28
|
+
*/
|
|
29
|
+
inline?: boolean;
|
|
30
|
+
/**
|
|
31
|
+
* The max length of the input
|
|
32
|
+
*/
|
|
33
|
+
maxLength?: number;
|
|
34
|
+
/**
|
|
35
|
+
* Whether to show character count
|
|
36
|
+
*/
|
|
37
|
+
showCount?: boolean;
|
|
38
|
+
inputStyle?: React.CSSProperties;
|
|
39
|
+
startLabel?: React.ReactNode | any;
|
|
40
|
+
startAdornment?: React.ReactNode | any;
|
|
41
|
+
endLabel?: React.ReactNode | any;
|
|
42
|
+
endAdornment?: React.ReactNode | any;
|
|
43
|
+
labelProps?: LabelProps;
|
|
44
|
+
containerProps?: React.HTMLAttributes<HTMLDivElement>;
|
|
45
|
+
forceInputDir?: 'ltr' | 'rtl';
|
|
46
|
+
}
|
|
47
|
+
interface InputProps extends CommonProps, React.InputHTMLAttributes<HTMLInputElement> {
|
|
48
|
+
ref?: React.Ref<HTMLInputElement>;
|
|
49
|
+
}
|
|
50
|
+
interface TextAreaProps extends CommonProps, React.TextareaHTMLAttributes<HTMLTextAreaElement> {
|
|
51
|
+
ref?: React.Ref<HTMLTextAreaElement>;
|
|
52
|
+
showLineNumbers?: boolean;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
/**
|
|
56
|
+
* Input displays a single-line input box on the user interface and enables assigning a value to it. It is used to take user input for small text data.
|
|
57
|
+
*/
|
|
58
|
+
declare const Input: React$1.ForwardRefExoticComponent<Omit<InputProps, "ref"> & React$1.RefAttributes<HTMLInputElement>>;
|
|
59
|
+
//# sourceMappingURL=Input.d.ts.map
|
|
60
|
+
|
|
61
|
+
/**
|
|
62
|
+
* TextArea displays a multi-line input box on the user interface and enables assigning a value to it. It is used to take user input for large text data.
|
|
63
|
+
*/
|
|
64
|
+
declare const TextArea: React$1.ForwardRefExoticComponent<Omit<TextAreaProps, "ref"> & React$1.RefAttributes<HTMLTextAreaElement>>;
|
|
65
|
+
|
|
66
|
+
export { Input, type InputProps, TextArea, type TextAreaProps };
|
package/lib/Input.js
ADDED
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
export{I as Input,T as TextArea}from"./TextArea--fiwZ_QM.js"
|
|
2
|
+
;import"./styled-components.browser.esm-Bq2p-e5F.js";import"react"
|
|
3
|
+
;import"./index-D8E8s0tV.js";import"./index-ByHJlnsx.js";import"react-dom"
|
|
4
|
+
;import"./index-BnDw8kbT.js";import"./keyframes-PnzFl0I5.js"
|
|
5
|
+
;import"./ErrorText-Uvye7uop.js";
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import e from"react"
|
|
2
|
+
;import{u as n,_ as i,e as r}from"./styled-components.browser.esm-Bq2p-e5F.js"
|
|
3
|
+
;import{v as o}from"./keyframes-PnzFl0I5.js";var t,s={mini:2,small:2.5,medium:4,
|
|
4
|
+
big:5},a={slow:1,medium:.7,fast:.4},m={mini:12,small:16,medium:24,big:32
|
|
5
|
+
},d=n.div(t||(t=i(["\n position: relative;\n border: ","px solid\n ",";\n border-radius: 50%;\n border-top: ","px solid\n ",";\n width: ","px;\n height: ","px;\n animation: "," ","s linear infinite;\n"],["\n position: relative;\n border: ","px solid\n ",";\n border-radius: 50%;\n border-top: ","px solid\n ",";\n width: ","px;\n height: ","px;\n animation: "," ","s linear infinite;\n"])),(function(e){
|
|
6
|
+
var n=e.size;return s[n]}),(function(e){return e.theme.colors.common.accent
|
|
7
|
+
}),(function(e){var n=e.size;return s[n]}),(function(e){
|
|
8
|
+
return e.theme.colors.text.inverse}),(function(e){var n=e.size;return m[n]
|
|
9
|
+
}),(function(e){var n=e.size;return m[n]}),o,(function(e){var n=e.speed
|
|
10
|
+
;return a[n]})),u=function(n){
|
|
11
|
+
var i=n.size,o=void 0===i?"medium":i,t=n.speed,s=void 0===t?"medium":t,a=r()
|
|
12
|
+
;return e.createElement(d,{dir:a.direction,className:"fui-loader",speed:s,size:o
|
|
13
|
+
})};export{u as L};
|
package/lib/Loader.d.ts
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
|
|
3
|
+
type LoaderSizes = 'mini' | 'small' | 'medium' | 'big';
|
|
4
|
+
type LoaderSpeeds = 'slow' | 'medium' | 'fast';
|
|
5
|
+
type LoaderPropTypes = {
|
|
6
|
+
/**
|
|
7
|
+
* Size of Select input
|
|
8
|
+
*/
|
|
9
|
+
size?: LoaderSizes;
|
|
10
|
+
/**
|
|
11
|
+
* Speed of Select input
|
|
12
|
+
*/
|
|
13
|
+
speed?: LoaderSpeeds;
|
|
14
|
+
};
|
|
15
|
+
|
|
16
|
+
/**
|
|
17
|
+
* Loader Component can be used to indicate loading of a Page / Section of a page.
|
|
18
|
+
*/
|
|
19
|
+
declare const Loader: (props: LoaderPropTypes) => React.JSX.Element;
|
|
20
|
+
|
|
21
|
+
export { Loader, type LoaderPropTypes, type LoaderSizes, type LoaderSpeeds };
|
package/lib/Loader.js
ADDED
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import e from"react"
|
|
2
|
+
;import{e as n}from"./styled-components.browser.esm-Bq2p-e5F.js"
|
|
3
|
+
;import{T as o}from"./index-D8E8s0tV.js"
|
|
4
|
+
;import{a as l,b as i,c as d,d as s,D as t,f as a}from"./styles-BbwNLGy3.js"
|
|
5
|
+
;var r=function(r){
|
|
6
|
+
var c=r.isOpen,u=r.trigger,m=r.closeMenuCallback,v=r.idAccessor,f=void 0===v?"id":v,p=r.nameAccessor,b=void 0===p?"name":p,w=r.onSelect,g=r.itemComponent,C=r.showArrow,E=void 0!==C&&C,M=r.options,O=void 0===M?[]:M,D=r.value,S=r.disableMenu,y=void 0!==S&&S,A=r.side,N=void 0===A?"bottom":A,h=r.align,j=void 0===h?"center":h,k=r.sideOffset,x=void 0===k?4:k,I=r.alignOffset,P=r.arrowPadding,B=r.avoidCollisions,T=n()
|
|
7
|
+
;return e.createElement(l,{open:c,onOpenChange:function(e){e||null==m||m()}
|
|
8
|
+
},e.createElement(i,{asChild:!0,disabled:y
|
|
9
|
+
},e.createElement(o,null,u)),e.createElement(d,null,e.createElement(s,{side:N,
|
|
10
|
+
sideOffset:x,align:j,alignOffset:I,arrowPadding:P,avoidCollisions:B,
|
|
11
|
+
className:"DropdownMenuContent"},O.map((function(n){return g?g(n,{
|
|
12
|
+
disabled:null==n?void 0:n.disabled,className:"DropdownMenuItem",
|
|
13
|
+
key:null==n?void 0:n[f],onSelect:function(){return null==w?void 0:w(n)},
|
|
14
|
+
isSelected:(null==D?void 0:D[f])===(null==n?void 0:n[f])}):e.createElement(t,{
|
|
15
|
+
id:null==n?void 0:n[f],disabled:null==n?void 0:n.disabled,dir:T.direction,
|
|
16
|
+
className:"DropdownMenuItem",key:null==n?void 0:n[f],onSelect:function(){
|
|
17
|
+
return null==w?void 0:w(n)},
|
|
18
|
+
$isSelected:(null==D?void 0:D[f])===(null==n?void 0:n[f])},null==n?void 0:n[b])
|
|
19
|
+
})),E&&e.createElement(a,{className:"DropdownMenuArrow"}))))};export{r as M};
|
package/lib/Menu.d.ts
ADDED
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import * as DropdownMenu from '@radix-ui/react-dropdown-menu';
|
|
3
|
+
import { MenuItemProps as MenuItemProps$1 } from '@radix-ui/react-dropdown-menu';
|
|
4
|
+
export { Item as RadixMenuItem } from '@radix-ui/react-dropdown-menu';
|
|
5
|
+
import * as react from 'react';
|
|
6
|
+
import react__default from 'react';
|
|
7
|
+
import { PopperContentProps } from '@radix-ui/react-popover';
|
|
8
|
+
import * as styled_components from 'styled-components';
|
|
9
|
+
import * as styled_components_dist_types from 'styled-components/dist/types';
|
|
10
|
+
|
|
11
|
+
interface DefaultMenuItemProps {
|
|
12
|
+
disabled?: boolean;
|
|
13
|
+
[key: string]: any;
|
|
14
|
+
}
|
|
15
|
+
type MenuProps<T extends DefaultMenuItemProps = DefaultMenuItemProps> = {
|
|
16
|
+
side?: PopperContentProps['side'];
|
|
17
|
+
sideOffset?: PopperContentProps['sideOffset'];
|
|
18
|
+
align?: PopperContentProps['align'];
|
|
19
|
+
alignOffset?: PopperContentProps['alignOffset'];
|
|
20
|
+
arrowPadding?: PopperContentProps['arrowPadding'];
|
|
21
|
+
avoidCollisions?: PopperContentProps['avoidCollisions'];
|
|
22
|
+
/**
|
|
23
|
+
* value of menu
|
|
24
|
+
*/
|
|
25
|
+
value?: T;
|
|
26
|
+
/**
|
|
27
|
+
* Called when a menu item is selected
|
|
28
|
+
*/
|
|
29
|
+
onSelect?: (option: T) => void;
|
|
30
|
+
closeMenuCallback?: () => void;
|
|
31
|
+
itemComponent?: (item: T, props?: MenuItemProps) => React.ReactNode | string;
|
|
32
|
+
/**
|
|
33
|
+
* options for menu button
|
|
34
|
+
*/
|
|
35
|
+
options?: Array<T>;
|
|
36
|
+
/**
|
|
37
|
+
* The children or label
|
|
38
|
+
*/
|
|
39
|
+
trigger: React.ReactNode | string;
|
|
40
|
+
/**
|
|
41
|
+
* Is the button inline
|
|
42
|
+
* @deprecated
|
|
43
|
+
*/
|
|
44
|
+
highlightedIndex?: number | null;
|
|
45
|
+
/**
|
|
46
|
+
* id Accessor of menu
|
|
47
|
+
*/
|
|
48
|
+
idAccessor?: string;
|
|
49
|
+
/**
|
|
50
|
+
* name Accessor of menu
|
|
51
|
+
*/
|
|
52
|
+
nameAccessor?: string;
|
|
53
|
+
/**
|
|
54
|
+
* Is the button inline
|
|
55
|
+
*/
|
|
56
|
+
isOpen?: boolean;
|
|
57
|
+
/**
|
|
58
|
+
* should show the Arrow?
|
|
59
|
+
*/
|
|
60
|
+
showArrow?: boolean;
|
|
61
|
+
disableMenu?: boolean;
|
|
62
|
+
};
|
|
63
|
+
type MenuItemProps = MenuItemProps$1 & {
|
|
64
|
+
isSelected?: boolean;
|
|
65
|
+
};
|
|
66
|
+
|
|
67
|
+
/**
|
|
68
|
+
* Menu is a container for Menu Item components.
|
|
69
|
+
* Menu item is a component to define each row of a menu components. It takes in prefix, suffix and default slot to place content either at beginning or end or middle of the row respectively.
|
|
70
|
+
*/
|
|
71
|
+
declare const Menu: <T extends DefaultMenuItemProps>(props: MenuProps<T>) => react__default.JSX.Element;
|
|
72
|
+
|
|
73
|
+
declare const DropdownMenuItem: styled_components.IStyledComponent<"web", styled_components_dist_types.Substitute<Omit<DropdownMenu.DropdownMenuItemProps & react.RefAttributes<HTMLDivElement>, "ref"> & {
|
|
74
|
+
ref?: ((instance: HTMLDivElement | null) => void) | react.RefObject<HTMLDivElement> | null | undefined;
|
|
75
|
+
}, {
|
|
76
|
+
$isSelected?: boolean | undefined;
|
|
77
|
+
disabled?: boolean | undefined;
|
|
78
|
+
}>> & Omit<react.ForwardRefExoticComponent<DropdownMenu.DropdownMenuItemProps & react.RefAttributes<HTMLDivElement>>, keyof react.Component<any, {}, any>>;
|
|
79
|
+
|
|
80
|
+
export { DropdownMenuItem, Menu, type MenuItemProps, type MenuProps };
|
package/lib/Menu.js
ADDED
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
export{D as DropdownMenuItem,$ as RadixMenuItem}from"./styles-BbwNLGy3.js"
|
|
2
|
+
;export{M as Menu}from"./Menu-DoE00Mg-.js"
|
|
3
|
+
;import"./styled-components.browser.esm-Bq2p-e5F.js";import"react"
|
|
4
|
+
;import"./index-ByHJlnsx.js";import"react-dom";import"./index-CeIB4COQ.js"
|
|
5
|
+
;import"./index-BdTXfGkV.js";import"./index-Cjkk7z9c.js"
|
|
6
|
+
;import"./index-BY9lf-do.js";import"./index-COoRg_pp.js"
|
|
7
|
+
;import"./Combination-AmN1Cqrf.js";import"./index-BrF1HKA1.js"
|
|
8
|
+
;import"./index-BROhcSiX.js";import"./index-Dy5ztCxm.js"
|
|
9
|
+
;import"./index-DtILdK5l.js";import"./index-BxNZ3C71.js"
|
|
10
|
+
;import"./keyframes-PnzFl0I5.js";import"./index-BnDw8kbT.js"
|
|
11
|
+
;import"./index-D8E8s0tV.js";
|