@propellerads/button-drop-down 3.0.0 → 3.0.1
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/button-drop-down.cjs.development.js +16 -29
- package/dist/button-drop-down.cjs.development.js.map +1 -1
- package/dist/button-drop-down.cjs.production.min.js.map +1 -1
- package/dist/button-drop-down.esm.js +16 -29
- package/dist/button-drop-down.esm.js.map +1 -1
- package/dist/index.d.ts +11 -3
- package/package.json +11 -12
|
@@ -11,13 +11,8 @@ var Button__default = _interopDefault(Button);
|
|
|
11
11
|
var styled = _interopDefault(require('styled-components'));
|
|
12
12
|
var stylevariables = require('@propellerads/stylevariables');
|
|
13
13
|
|
|
14
|
-
function _taggedTemplateLiteralLoose(
|
|
15
|
-
|
|
16
|
-
raw = strings.slice(0);
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
strings.raw = raw;
|
|
20
|
-
return strings;
|
|
14
|
+
function _taggedTemplateLiteralLoose(e, t) {
|
|
15
|
+
return t || (t = e.slice(0)), e.raw = t, e;
|
|
21
16
|
}
|
|
22
17
|
|
|
23
18
|
var _templateObject, _templateObject2, _templateObject3;
|
|
@@ -26,10 +21,9 @@ var ButtonDropDownListContainer = /*#__PURE__*/styled.div(_templateObject2 || (_
|
|
|
26
21
|
var ButtonDropDownListItemContainer = /*#__PURE__*/styled.div(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n text-align: left;\n min-height: 32px;\n padding: ", "px ", "px;\n\n &:hover {\n background-color: ", ";\n }\n"])), stylevariables.spacing * 2, stylevariables.spacing * 3, stylevariables.gray95);
|
|
27
22
|
|
|
28
23
|
var BUTTON_DROPDOWN_TYPE = Button.BUTTON_TYPE;
|
|
29
|
-
|
|
30
24
|
var ButtonDropDownList = function ButtonDropDownList(props) {
|
|
31
25
|
var option = props.option,
|
|
32
|
-
|
|
26
|
+
_onClick = props.onClick;
|
|
33
27
|
return React__default.createElement(Button__default, {
|
|
34
28
|
elementId: option.id,
|
|
35
29
|
type: Button.BUTTON_TYPE.PLAIN,
|
|
@@ -39,35 +33,30 @@ var ButtonDropDownList = function ButtonDropDownList(props) {
|
|
|
39
33
|
isDisabled: option.isDisabled
|
|
40
34
|
}, React__default.createElement(ButtonDropDownListItemContainer, null, option.title));
|
|
41
35
|
};
|
|
42
|
-
|
|
43
36
|
var ButtonDropDown = function ButtonDropDown(props) {
|
|
44
37
|
var _props$type = props.type,
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
38
|
+
type = _props$type === void 0 ? Button.BUTTON_TYPE.ADVANCED : _props$type,
|
|
39
|
+
isLoading = props.isLoading,
|
|
40
|
+
isDisabled = props.isDisabled,
|
|
41
|
+
elementId = props.elementId,
|
|
42
|
+
options = props.options,
|
|
43
|
+
title = props.title,
|
|
44
|
+
onClick = props.onClick,
|
|
45
|
+
_props$onMouseEnter = props.onMouseEnter,
|
|
46
|
+
onMouseEnter = _props$onMouseEnter === void 0 ? undefined : _props$onMouseEnter,
|
|
47
|
+
_props$onMouseLeave = props.onMouseLeave,
|
|
48
|
+
onMouseLeave = _props$onMouseLeave === void 0 ? undefined : _props$onMouseLeave;
|
|
56
49
|
var containerRef = React.useRef(null);
|
|
57
|
-
|
|
58
50
|
var _useState = React.useState(false),
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
51
|
+
isExpanded = _useState[0],
|
|
52
|
+
setExpanded = _useState[1];
|
|
62
53
|
React.useEffect(function () {
|
|
63
54
|
var handleClickOutside = function handleClickOutside(event) {
|
|
64
55
|
var current = containerRef.current;
|
|
65
|
-
|
|
66
56
|
if (current && !current.contains(event.target)) {
|
|
67
57
|
setExpanded(false);
|
|
68
58
|
}
|
|
69
59
|
};
|
|
70
|
-
|
|
71
60
|
document.addEventListener('mousedown', handleClickOutside);
|
|
72
61
|
document.addEventListener('touchstart', handleClickOutside);
|
|
73
62
|
return function () {
|
|
@@ -75,12 +64,10 @@ var ButtonDropDown = function ButtonDropDown(props) {
|
|
|
75
64
|
document.removeEventListener('touchstart', handleClickOutside);
|
|
76
65
|
};
|
|
77
66
|
}, [containerRef]);
|
|
78
|
-
|
|
79
67
|
var onItemClick = function onItemClick(value) {
|
|
80
68
|
setExpanded(false);
|
|
81
69
|
onClick(value);
|
|
82
70
|
};
|
|
83
|
-
|
|
84
71
|
return React__default.createElement(ButtonDropDownContainer, {
|
|
85
72
|
ref: containerRef
|
|
86
73
|
}, React__default.createElement(Button__default, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button-drop-down.cjs.development.js","sources":["../src/style.tsx","../src/index.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport {gray80, gray95, white, spacing, fontNormal, borderRadius} from '@propellerads/stylevariables';\n\nconst ButtonDropDownContainer = styled.div`\n position: relative;\n width: fit-content;\n`;\n\nconst ButtonDropDownListContainer = styled.div`\n position: absolute;\n display: flex;\n flex-direction: column;\n min-width: 100%;\n width: fit-content;\n border: 1px solid ${gray80};\n border-radius: ${borderRadius}px;\n background-color: ${white};\n padding: ${spacing * 2}px 0;\n margin-top: 2px;\n font-size: ${fontNormal}px;\n z-index: 1;\n`;\n\nconst ButtonDropDownListItemContainer = styled.div`\n width: 100%;\n text-align: left;\n min-height: 32px;\n padding: ${spacing * 2}px ${spacing * 3}px;\n\n &:hover {\n background-color: ${gray95};\n }\n`;\n\nexport {ButtonDropDownContainer, ButtonDropDownListContainer, ButtonDropDownListItemContainer};\n","import React, {useState, useEffect, useRef} from 'react';\nimport Button, {BUTTON_TYPE} from '@propellerads/button';\n\nimport {ButtonDropDownContainer, ButtonDropDownListContainer, ButtonDropDownListItemContainer} from './style';\n\nexport const BUTTON_DROPDOWN_TYPE = BUTTON_TYPE;\n\ntype DROPDOWN_OPTION_TYPE = {\n id: string;\n title: string;\n isDisabled?: boolean;\n};\n\nconst ButtonDropDownList = (props: {option: DROPDOWN_OPTION_TYPE; onClick: (value: DROPDOWN_OPTION_TYPE) => void}) => {\n const {option, onClick} = props;\n\n return (\n <Button\n elementId={option.id}\n type={BUTTON_TYPE.PLAIN}\n onClick={() => onClick(option)}\n isDisabled={option.isDisabled}\n >\n <ButtonDropDownListItemContainer>{option.title}</ButtonDropDownListItemContainer>\n </Button>\n );\n};\n\ninterface IProps {\n type:
|
|
1
|
+
{"version":3,"file":"button-drop-down.cjs.development.js","sources":["../src/style.tsx","../src/index.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport {gray80, gray95, white, spacing, fontNormal, borderRadius} from '@propellerads/stylevariables';\n\nconst ButtonDropDownContainer = styled.div`\n position: relative;\n width: fit-content;\n`;\n\nconst ButtonDropDownListContainer = styled.div`\n position: absolute;\n display: flex;\n flex-direction: column;\n min-width: 100%;\n width: fit-content;\n border: 1px solid ${gray80};\n border-radius: ${borderRadius}px;\n background-color: ${white};\n padding: ${spacing * 2}px 0;\n margin-top: 2px;\n font-size: ${fontNormal}px;\n z-index: 1;\n`;\n\nconst ButtonDropDownListItemContainer = styled.div`\n width: 100%;\n text-align: left;\n min-height: 32px;\n padding: ${spacing * 2}px ${spacing * 3}px;\n\n &:hover {\n background-color: ${gray95};\n }\n`;\n\nexport {ButtonDropDownContainer, ButtonDropDownListContainer, ButtonDropDownListItemContainer};\n","import React, {useState, useEffect, useRef} from 'react';\nimport Button, {BUTTON_TYPE, ButtonType} from '@propellerads/button';\n\nimport {ButtonDropDownContainer, ButtonDropDownListContainer, ButtonDropDownListItemContainer} from './style';\n\nexport const BUTTON_DROPDOWN_TYPE = BUTTON_TYPE;\n\ntype DROPDOWN_OPTION_TYPE = {\n id: string;\n title: string;\n isDisabled?: boolean;\n};\n\nconst ButtonDropDownList = (props: {option: DROPDOWN_OPTION_TYPE; onClick: (value: DROPDOWN_OPTION_TYPE) => void}) => {\n const {option, onClick} = props;\n\n return (\n <Button\n elementId={option.id}\n type={BUTTON_TYPE.PLAIN}\n onClick={() => onClick(option)}\n isDisabled={option.isDisabled}\n >\n <ButtonDropDownListItemContainer>{option.title}</ButtonDropDownListItemContainer>\n </Button>\n );\n};\n\ninterface IProps {\n type: ButtonType;\n options: DROPDOWN_OPTION_TYPE[];\n elementId: string;\n isLoading: boolean;\n isDisabled: boolean;\n title: string;\n onClick: (value: DROPDOWN_OPTION_TYPE) => void;\n onMouseEnter: () => void | undefined;\n onMouseLeave: () => void | undefined;\n}\n\nconst ButtonDropDown = (props: IProps) => {\n const {\n type = BUTTON_TYPE.ADVANCED,\n isLoading,\n isDisabled,\n elementId,\n options,\n title,\n onClick,\n onMouseEnter = undefined,\n onMouseLeave = undefined,\n } = props;\n\n const containerRef = useRef<HTMLDivElement>(null);\n\n const [isExpanded, setExpanded] = useState(false);\n\n useEffect(() => {\n const handleClickOutside = (event: any) => {\n const {current} = containerRef;\n\n if (current && !current.contains(event.target)) {\n setExpanded(false);\n }\n };\n\n document.addEventListener('mousedown', handleClickOutside);\n document.addEventListener('touchstart', handleClickOutside);\n return () => {\n document.removeEventListener('mousedown', handleClickOutside);\n document.removeEventListener('touchstart', handleClickOutside);\n };\n }, [containerRef]);\n\n const onItemClick = (value: DROPDOWN_OPTION_TYPE) => {\n setExpanded(false);\n onClick(value);\n };\n\n return (\n <ButtonDropDownContainer ref={containerRef}>\n {/* eslint-disable-next-line @typescript-eslint/ban-ts-comment */}\n {/* @ts-ignore */}\n <Button\n type={type}\n isLoading={isLoading}\n isDisabled={isDisabled}\n elementId={elementId}\n onClick={() => setExpanded(!isExpanded)}\n onMouseEnter={onMouseEnter}\n onMouseLeave={onMouseLeave}\n >\n {title}\n </Button>\n\n {isExpanded && options.length > 0 && (\n <ButtonDropDownListContainer>\n {options.map((option) => (\n <ButtonDropDownList option={option} key={option.id} onClick={onItemClick} />\n ))}\n </ButtonDropDownListContainer>\n )}\n </ButtonDropDownContainer>\n );\n};\n\nexport default ButtonDropDown;\n"],"names":["ButtonDropDownContainer","styled","div","_templateObject","_taggedTemplateLiteralLoose","ButtonDropDownListContainer","_templateObject2","gray80","borderRadius","white","spacing","fontNormal","ButtonDropDownListItemContainer","_templateObject3","gray95","BUTTON_DROPDOWN_TYPE","BUTTON_TYPE","ButtonDropDownList","props","option","onClick","React","Button","elementId","id","type","PLAIN","isDisabled","title","ButtonDropDown","_props$type","ADVANCED","isLoading","options","_props$onMouseEnter","onMouseEnter","undefined","_props$onMouseLeave","onMouseLeave","containerRef","useRef","_useState","useState","isExpanded","setExpanded","useEffect","handleClickOutside","event","current","contains","target","document","addEventListener","removeEventListener","onItemClick","value","ref","length","map","key"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button-drop-down.cjs.production.min.js","sources":["../src/style.tsx","../src/index.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport {gray80, gray95, white, spacing, fontNormal, borderRadius} from '@propellerads/stylevariables';\n\nconst ButtonDropDownContainer = styled.div`\n position: relative;\n width: fit-content;\n`;\n\nconst ButtonDropDownListContainer = styled.div`\n position: absolute;\n display: flex;\n flex-direction: column;\n min-width: 100%;\n width: fit-content;\n border: 1px solid ${gray80};\n border-radius: ${borderRadius}px;\n background-color: ${white};\n padding: ${spacing * 2}px 0;\n margin-top: 2px;\n font-size: ${fontNormal}px;\n z-index: 1;\n`;\n\nconst ButtonDropDownListItemContainer = styled.div`\n width: 100%;\n text-align: left;\n min-height: 32px;\n padding: ${spacing * 2}px ${spacing * 3}px;\n\n &:hover {\n background-color: ${gray95};\n }\n`;\n\nexport {ButtonDropDownContainer, ButtonDropDownListContainer, ButtonDropDownListItemContainer};\n","import React, {useState, useEffect, useRef} from 'react';\nimport Button, {BUTTON_TYPE} from '@propellerads/button';\n\nimport {ButtonDropDownContainer, ButtonDropDownListContainer, ButtonDropDownListItemContainer} from './style';\n\nexport const BUTTON_DROPDOWN_TYPE = BUTTON_TYPE;\n\ntype DROPDOWN_OPTION_TYPE = {\n id: string;\n title: string;\n isDisabled?: boolean;\n};\n\nconst ButtonDropDownList = (props: {option: DROPDOWN_OPTION_TYPE; onClick: (value: DROPDOWN_OPTION_TYPE) => void}) => {\n const {option, onClick} = props;\n\n return (\n <Button\n elementId={option.id}\n type={BUTTON_TYPE.PLAIN}\n onClick={() => onClick(option)}\n isDisabled={option.isDisabled}\n >\n <ButtonDropDownListItemContainer>{option.title}</ButtonDropDownListItemContainer>\n </Button>\n );\n};\n\ninterface IProps {\n type:
|
|
1
|
+
{"version":3,"file":"button-drop-down.cjs.production.min.js","sources":["../src/style.tsx","../src/index.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport {gray80, gray95, white, spacing, fontNormal, borderRadius} from '@propellerads/stylevariables';\n\nconst ButtonDropDownContainer = styled.div`\n position: relative;\n width: fit-content;\n`;\n\nconst ButtonDropDownListContainer = styled.div`\n position: absolute;\n display: flex;\n flex-direction: column;\n min-width: 100%;\n width: fit-content;\n border: 1px solid ${gray80};\n border-radius: ${borderRadius}px;\n background-color: ${white};\n padding: ${spacing * 2}px 0;\n margin-top: 2px;\n font-size: ${fontNormal}px;\n z-index: 1;\n`;\n\nconst ButtonDropDownListItemContainer = styled.div`\n width: 100%;\n text-align: left;\n min-height: 32px;\n padding: ${spacing * 2}px ${spacing * 3}px;\n\n &:hover {\n background-color: ${gray95};\n }\n`;\n\nexport {ButtonDropDownContainer, ButtonDropDownListContainer, ButtonDropDownListItemContainer};\n","import React, {useState, useEffect, useRef} from 'react';\nimport Button, {BUTTON_TYPE, ButtonType} from '@propellerads/button';\n\nimport {ButtonDropDownContainer, ButtonDropDownListContainer, ButtonDropDownListItemContainer} from './style';\n\nexport const BUTTON_DROPDOWN_TYPE = BUTTON_TYPE;\n\ntype DROPDOWN_OPTION_TYPE = {\n id: string;\n title: string;\n isDisabled?: boolean;\n};\n\nconst ButtonDropDownList = (props: {option: DROPDOWN_OPTION_TYPE; onClick: (value: DROPDOWN_OPTION_TYPE) => void}) => {\n const {option, onClick} = props;\n\n return (\n <Button\n elementId={option.id}\n type={BUTTON_TYPE.PLAIN}\n onClick={() => onClick(option)}\n isDisabled={option.isDisabled}\n >\n <ButtonDropDownListItemContainer>{option.title}</ButtonDropDownListItemContainer>\n </Button>\n );\n};\n\ninterface IProps {\n type: ButtonType;\n options: DROPDOWN_OPTION_TYPE[];\n elementId: string;\n isLoading: boolean;\n isDisabled: boolean;\n title: string;\n onClick: (value: DROPDOWN_OPTION_TYPE) => void;\n onMouseEnter: () => void | undefined;\n onMouseLeave: () => void | undefined;\n}\n\nconst ButtonDropDown = (props: IProps) => {\n const {\n type = BUTTON_TYPE.ADVANCED,\n isLoading,\n isDisabled,\n elementId,\n options,\n title,\n onClick,\n onMouseEnter = undefined,\n onMouseLeave = undefined,\n } = props;\n\n const containerRef = useRef<HTMLDivElement>(null);\n\n const [isExpanded, setExpanded] = useState(false);\n\n useEffect(() => {\n const handleClickOutside = (event: any) => {\n const {current} = containerRef;\n\n if (current && !current.contains(event.target)) {\n setExpanded(false);\n }\n };\n\n document.addEventListener('mousedown', handleClickOutside);\n document.addEventListener('touchstart', handleClickOutside);\n return () => {\n document.removeEventListener('mousedown', handleClickOutside);\n document.removeEventListener('touchstart', handleClickOutside);\n };\n }, [containerRef]);\n\n const onItemClick = (value: DROPDOWN_OPTION_TYPE) => {\n setExpanded(false);\n onClick(value);\n };\n\n return (\n <ButtonDropDownContainer ref={containerRef}>\n {/* eslint-disable-next-line @typescript-eslint/ban-ts-comment */}\n {/* @ts-ignore */}\n <Button\n type={type}\n isLoading={isLoading}\n isDisabled={isDisabled}\n elementId={elementId}\n onClick={() => setExpanded(!isExpanded)}\n onMouseEnter={onMouseEnter}\n onMouseLeave={onMouseLeave}\n >\n {title}\n </Button>\n\n {isExpanded && options.length > 0 && (\n <ButtonDropDownListContainer>\n {options.map((option) => (\n <ButtonDropDownList option={option} key={option.id} onClick={onItemClick} />\n ))}\n </ButtonDropDownListContainer>\n )}\n </ButtonDropDownContainer>\n );\n};\n\nexport default ButtonDropDown;\n"],"names":["ButtonDropDownContainer","styled","div","_templateObject","_taggedTemplateLiteralLoose","ButtonDropDownListContainer","_templateObject2","gray80","borderRadius","white","spacing","fontNormal","ButtonDropDownListItemContainer","_templateObject3","gray95","ButtonDropDownList","props","option","onClick","React","Button","elementId","id","type","BUTTON_TYPE","PLAIN","isDisabled","title","_props$type","ADVANCED","isLoading","options","_props$onMouseEnter","onMouseEnter","undefined","_props$onMouseLeave","onMouseLeave","containerRef","useRef","_useState","useState","isExpanded","setExpanded","useEffect","handleClickOutside","event","current","contains","target","document","addEventListener","removeEventListener","onItemClick","value","ref","length","map","key"],"mappings":"sVAGA,IAAMA,EAA0BC,EAAOC,IAAGC,IAAAA,EAAAC,0DAKpCC,EAA8BJ,EAAOC,IAAGI,IAAAA,EAAAF,oRAMxBG,SACHC,eACGC,QACC,EAAVC,UAEEC,cAITC,EAAkCX,EAAOC,IAAGW,IAAAA,EAAAT,8IAI3B,EAAVM,UAA2B,EAAVA,UAGNI,UCjBlBC,EAAqB,SAACC,GAC1B,IAAOC,EAAmBD,EAAnBC,OAAQC,EAAWF,EAAXE,QAEf,OACEC,gBAACC,GACCC,UAAWJ,EAAOK,GAClBC,KAAMC,cAAYC,MAClBP,QAAS,WAAF,OAAQA,EAAQD,IACvBS,WAAYT,EAAOS,YAEnBP,gBAACP,OAAiCK,EAAOU,sCAlBXH,8BAmCb,SAACR,GACtB,IAAAY,EAUIZ,EATFO,KAAAA,WAAIK,EAAGJ,cAAYK,SAAQD,EAC3BE,EAQEd,EARFc,UACAJ,EAOEV,EAPFU,WACAL,EAMEL,EANFK,UACAU,EAKEf,EALFe,QACAJ,EAIEX,EAJFW,MACAT,EAGEF,EAHFE,QAAOc,EAGLhB,EAFFiB,aAAAA,WAAYD,OAAGE,EAASF,EAAAG,EAEtBnB,EADFoB,aAAAA,WAAYD,OAAGD,EAASC,EAGpBE,EAAeC,SAAuB,MAE5CC,EAAkCC,YAAS,GAApCC,EAAUF,KAAEG,EAAWH,KAE9BI,aAAU,WACR,IAAMC,EAAqB,SAACC,GAC1B,IAAOC,EAAWT,EAAXS,QAEHA,IAAYA,EAAQC,SAASF,EAAMG,SACrCN,GAAY,IAMhB,OAFAO,SAASC,iBAAiB,YAAaN,GACvCK,SAASC,iBAAiB,aAAcN,GACjC,WACLK,SAASE,oBAAoB,YAAaP,GAC1CK,SAASE,oBAAoB,aAAcP,MAE5C,CAACP,IAEJ,IAAMe,EAAc,SAACC,GACnBX,GAAY,GACZxB,EAAQmC,IAGV,OACElC,gBAACnB,GAAwBsD,IAAKjB,GAG5BlB,gBAACC,GACCG,KAAMA,EACNO,UAAWA,EACXJ,WAAYA,EACZL,UAAWA,EACXH,QAAS,WAAF,OAAQwB,GAAaD,IAC5BR,aAAcA,EACdG,aAAcA,GAEbT,GAGFc,GAAcV,EAAQwB,OAAS,GAC9BpC,gBAACd,OACE0B,EAAQyB,KAAI,SAACvC,GAAM,OAClBE,gBAACJ,GAAmBE,OAAQA,EAAQwC,IAAKxC,EAAOK,GAAIJ,QAASkC"}
|
|
@@ -3,13 +3,8 @@ import Button, { BUTTON_TYPE } from '@propellerads/button';
|
|
|
3
3
|
import styled from 'styled-components';
|
|
4
4
|
import { gray80, borderRadius, white, spacing, fontNormal, gray95 } from '@propellerads/stylevariables';
|
|
5
5
|
|
|
6
|
-
function _taggedTemplateLiteralLoose(
|
|
7
|
-
|
|
8
|
-
raw = strings.slice(0);
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
strings.raw = raw;
|
|
12
|
-
return strings;
|
|
6
|
+
function _taggedTemplateLiteralLoose(e, t) {
|
|
7
|
+
return t || (t = e.slice(0)), e.raw = t, e;
|
|
13
8
|
}
|
|
14
9
|
|
|
15
10
|
var _templateObject, _templateObject2, _templateObject3;
|
|
@@ -18,10 +13,9 @@ var ButtonDropDownListContainer = /*#__PURE__*/styled.div(_templateObject2 || (_
|
|
|
18
13
|
var ButtonDropDownListItemContainer = /*#__PURE__*/styled.div(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n text-align: left;\n min-height: 32px;\n padding: ", "px ", "px;\n\n &:hover {\n background-color: ", ";\n }\n"])), spacing * 2, spacing * 3, gray95);
|
|
19
14
|
|
|
20
15
|
var BUTTON_DROPDOWN_TYPE = BUTTON_TYPE;
|
|
21
|
-
|
|
22
16
|
var ButtonDropDownList = function ButtonDropDownList(props) {
|
|
23
17
|
var option = props.option,
|
|
24
|
-
|
|
18
|
+
_onClick = props.onClick;
|
|
25
19
|
return React.createElement(Button, {
|
|
26
20
|
elementId: option.id,
|
|
27
21
|
type: BUTTON_TYPE.PLAIN,
|
|
@@ -31,35 +25,30 @@ var ButtonDropDownList = function ButtonDropDownList(props) {
|
|
|
31
25
|
isDisabled: option.isDisabled
|
|
32
26
|
}, React.createElement(ButtonDropDownListItemContainer, null, option.title));
|
|
33
27
|
};
|
|
34
|
-
|
|
35
28
|
var ButtonDropDown = function ButtonDropDown(props) {
|
|
36
29
|
var _props$type = props.type,
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
30
|
+
type = _props$type === void 0 ? BUTTON_TYPE.ADVANCED : _props$type,
|
|
31
|
+
isLoading = props.isLoading,
|
|
32
|
+
isDisabled = props.isDisabled,
|
|
33
|
+
elementId = props.elementId,
|
|
34
|
+
options = props.options,
|
|
35
|
+
title = props.title,
|
|
36
|
+
onClick = props.onClick,
|
|
37
|
+
_props$onMouseEnter = props.onMouseEnter,
|
|
38
|
+
onMouseEnter = _props$onMouseEnter === void 0 ? undefined : _props$onMouseEnter,
|
|
39
|
+
_props$onMouseLeave = props.onMouseLeave,
|
|
40
|
+
onMouseLeave = _props$onMouseLeave === void 0 ? undefined : _props$onMouseLeave;
|
|
48
41
|
var containerRef = useRef(null);
|
|
49
|
-
|
|
50
42
|
var _useState = useState(false),
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
43
|
+
isExpanded = _useState[0],
|
|
44
|
+
setExpanded = _useState[1];
|
|
54
45
|
useEffect(function () {
|
|
55
46
|
var handleClickOutside = function handleClickOutside(event) {
|
|
56
47
|
var current = containerRef.current;
|
|
57
|
-
|
|
58
48
|
if (current && !current.contains(event.target)) {
|
|
59
49
|
setExpanded(false);
|
|
60
50
|
}
|
|
61
51
|
};
|
|
62
|
-
|
|
63
52
|
document.addEventListener('mousedown', handleClickOutside);
|
|
64
53
|
document.addEventListener('touchstart', handleClickOutside);
|
|
65
54
|
return function () {
|
|
@@ -67,12 +56,10 @@ var ButtonDropDown = function ButtonDropDown(props) {
|
|
|
67
56
|
document.removeEventListener('touchstart', handleClickOutside);
|
|
68
57
|
};
|
|
69
58
|
}, [containerRef]);
|
|
70
|
-
|
|
71
59
|
var onItemClick = function onItemClick(value) {
|
|
72
60
|
setExpanded(false);
|
|
73
61
|
onClick(value);
|
|
74
62
|
};
|
|
75
|
-
|
|
76
63
|
return React.createElement(ButtonDropDownContainer, {
|
|
77
64
|
ref: containerRef
|
|
78
65
|
}, React.createElement(Button, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button-drop-down.esm.js","sources":["../src/style.tsx","../src/index.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport {gray80, gray95, white, spacing, fontNormal, borderRadius} from '@propellerads/stylevariables';\n\nconst ButtonDropDownContainer = styled.div`\n position: relative;\n width: fit-content;\n`;\n\nconst ButtonDropDownListContainer = styled.div`\n position: absolute;\n display: flex;\n flex-direction: column;\n min-width: 100%;\n width: fit-content;\n border: 1px solid ${gray80};\n border-radius: ${borderRadius}px;\n background-color: ${white};\n padding: ${spacing * 2}px 0;\n margin-top: 2px;\n font-size: ${fontNormal}px;\n z-index: 1;\n`;\n\nconst ButtonDropDownListItemContainer = styled.div`\n width: 100%;\n text-align: left;\n min-height: 32px;\n padding: ${spacing * 2}px ${spacing * 3}px;\n\n &:hover {\n background-color: ${gray95};\n }\n`;\n\nexport {ButtonDropDownContainer, ButtonDropDownListContainer, ButtonDropDownListItemContainer};\n","import React, {useState, useEffect, useRef} from 'react';\nimport Button, {BUTTON_TYPE} from '@propellerads/button';\n\nimport {ButtonDropDownContainer, ButtonDropDownListContainer, ButtonDropDownListItemContainer} from './style';\n\nexport const BUTTON_DROPDOWN_TYPE = BUTTON_TYPE;\n\ntype DROPDOWN_OPTION_TYPE = {\n id: string;\n title: string;\n isDisabled?: boolean;\n};\n\nconst ButtonDropDownList = (props: {option: DROPDOWN_OPTION_TYPE; onClick: (value: DROPDOWN_OPTION_TYPE) => void}) => {\n const {option, onClick} = props;\n\n return (\n <Button\n elementId={option.id}\n type={BUTTON_TYPE.PLAIN}\n onClick={() => onClick(option)}\n isDisabled={option.isDisabled}\n >\n <ButtonDropDownListItemContainer>{option.title}</ButtonDropDownListItemContainer>\n </Button>\n );\n};\n\ninterface IProps {\n type:
|
|
1
|
+
{"version":3,"file":"button-drop-down.esm.js","sources":["../src/style.tsx","../src/index.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport {gray80, gray95, white, spacing, fontNormal, borderRadius} from '@propellerads/stylevariables';\n\nconst ButtonDropDownContainer = styled.div`\n position: relative;\n width: fit-content;\n`;\n\nconst ButtonDropDownListContainer = styled.div`\n position: absolute;\n display: flex;\n flex-direction: column;\n min-width: 100%;\n width: fit-content;\n border: 1px solid ${gray80};\n border-radius: ${borderRadius}px;\n background-color: ${white};\n padding: ${spacing * 2}px 0;\n margin-top: 2px;\n font-size: ${fontNormal}px;\n z-index: 1;\n`;\n\nconst ButtonDropDownListItemContainer = styled.div`\n width: 100%;\n text-align: left;\n min-height: 32px;\n padding: ${spacing * 2}px ${spacing * 3}px;\n\n &:hover {\n background-color: ${gray95};\n }\n`;\n\nexport {ButtonDropDownContainer, ButtonDropDownListContainer, ButtonDropDownListItemContainer};\n","import React, {useState, useEffect, useRef} from 'react';\nimport Button, {BUTTON_TYPE, ButtonType} from '@propellerads/button';\n\nimport {ButtonDropDownContainer, ButtonDropDownListContainer, ButtonDropDownListItemContainer} from './style';\n\nexport const BUTTON_DROPDOWN_TYPE = BUTTON_TYPE;\n\ntype DROPDOWN_OPTION_TYPE = {\n id: string;\n title: string;\n isDisabled?: boolean;\n};\n\nconst ButtonDropDownList = (props: {option: DROPDOWN_OPTION_TYPE; onClick: (value: DROPDOWN_OPTION_TYPE) => void}) => {\n const {option, onClick} = props;\n\n return (\n <Button\n elementId={option.id}\n type={BUTTON_TYPE.PLAIN}\n onClick={() => onClick(option)}\n isDisabled={option.isDisabled}\n >\n <ButtonDropDownListItemContainer>{option.title}</ButtonDropDownListItemContainer>\n </Button>\n );\n};\n\ninterface IProps {\n type: ButtonType;\n options: DROPDOWN_OPTION_TYPE[];\n elementId: string;\n isLoading: boolean;\n isDisabled: boolean;\n title: string;\n onClick: (value: DROPDOWN_OPTION_TYPE) => void;\n onMouseEnter: () => void | undefined;\n onMouseLeave: () => void | undefined;\n}\n\nconst ButtonDropDown = (props: IProps) => {\n const {\n type = BUTTON_TYPE.ADVANCED,\n isLoading,\n isDisabled,\n elementId,\n options,\n title,\n onClick,\n onMouseEnter = undefined,\n onMouseLeave = undefined,\n } = props;\n\n const containerRef = useRef<HTMLDivElement>(null);\n\n const [isExpanded, setExpanded] = useState(false);\n\n useEffect(() => {\n const handleClickOutside = (event: any) => {\n const {current} = containerRef;\n\n if (current && !current.contains(event.target)) {\n setExpanded(false);\n }\n };\n\n document.addEventListener('mousedown', handleClickOutside);\n document.addEventListener('touchstart', handleClickOutside);\n return () => {\n document.removeEventListener('mousedown', handleClickOutside);\n document.removeEventListener('touchstart', handleClickOutside);\n };\n }, [containerRef]);\n\n const onItemClick = (value: DROPDOWN_OPTION_TYPE) => {\n setExpanded(false);\n onClick(value);\n };\n\n return (\n <ButtonDropDownContainer ref={containerRef}>\n {/* eslint-disable-next-line @typescript-eslint/ban-ts-comment */}\n {/* @ts-ignore */}\n <Button\n type={type}\n isLoading={isLoading}\n isDisabled={isDisabled}\n elementId={elementId}\n onClick={() => setExpanded(!isExpanded)}\n onMouseEnter={onMouseEnter}\n onMouseLeave={onMouseLeave}\n >\n {title}\n </Button>\n\n {isExpanded && options.length > 0 && (\n <ButtonDropDownListContainer>\n {options.map((option) => (\n <ButtonDropDownList option={option} key={option.id} onClick={onItemClick} />\n ))}\n </ButtonDropDownListContainer>\n )}\n </ButtonDropDownContainer>\n );\n};\n\nexport default ButtonDropDown;\n"],"names":["ButtonDropDownContainer","styled","div","_templateObject","_taggedTemplateLiteralLoose","ButtonDropDownListContainer","_templateObject2","gray80","borderRadius","white","spacing","fontNormal","ButtonDropDownListItemContainer","_templateObject3","gray95","BUTTON_DROPDOWN_TYPE","BUTTON_TYPE","ButtonDropDownList","props","option","onClick","React","Button","elementId","id","type","PLAIN","isDisabled","title","ButtonDropDown","_props$type","ADVANCED","isLoading","options","_props$onMouseEnter","onMouseEnter","undefined","_props$onMouseLeave","onMouseLeave","containerRef","useRef","_useState","useState","isExpanded","setExpanded","useEffect","handleClickOutside","event","current","contains","target","document","addEventListener","removeEventListener","onItemClick","value","ref","length","map","key"],"mappings":"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"}
|
package/dist/index.d.ts
CHANGED
|
@@ -1,13 +1,21 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import {
|
|
3
|
-
export declare const BUTTON_DROPDOWN_TYPE:
|
|
2
|
+
import { ButtonType } from '@propellerads/button';
|
|
3
|
+
export declare const BUTTON_DROPDOWN_TYPE: {
|
|
4
|
+
readonly PRIMARY: "isPrimary";
|
|
5
|
+
readonly SECONDARY: "isSecondary";
|
|
6
|
+
readonly ADVANCED: "isAdvanced";
|
|
7
|
+
readonly LINK: "isLink";
|
|
8
|
+
readonly PLAIN: "isPlain";
|
|
9
|
+
readonly DANGER: "isDanger";
|
|
10
|
+
readonly SUCCESS: "isSuccess";
|
|
11
|
+
};
|
|
4
12
|
declare type DROPDOWN_OPTION_TYPE = {
|
|
5
13
|
id: string;
|
|
6
14
|
title: string;
|
|
7
15
|
isDisabled?: boolean;
|
|
8
16
|
};
|
|
9
17
|
interface IProps {
|
|
10
|
-
type:
|
|
18
|
+
type: ButtonType;
|
|
11
19
|
options: DROPDOWN_OPTION_TYPE[];
|
|
12
20
|
elementId: string;
|
|
13
21
|
isLoading: boolean;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@propellerads/button-drop-down",
|
|
3
|
-
"version": "3.0.
|
|
3
|
+
"version": "3.0.1",
|
|
4
4
|
"description": "ButtonDropDown component",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/button-drop-down.esm.js",
|
|
@@ -14,25 +14,24 @@
|
|
|
14
14
|
"url": "https://github.com/propellerads/ui-components/issues"
|
|
15
15
|
},
|
|
16
16
|
"scripts": {
|
|
17
|
-
"prepublishOnly": "tsdx build",
|
|
18
17
|
"start": "tsdx watch",
|
|
19
18
|
"build": "tsdx build"
|
|
20
19
|
},
|
|
21
20
|
"homepage": "https://github.com/propellerads/ui-components#readme",
|
|
22
21
|
"private": false,
|
|
23
22
|
"dependencies": {
|
|
24
|
-
"@propellerads/button": "^
|
|
25
|
-
"@propellerads/stylevariables": "^
|
|
26
|
-
"add": "
|
|
23
|
+
"@propellerads/button": "^8.0.1",
|
|
24
|
+
"@propellerads/stylevariables": "^2.0.1",
|
|
25
|
+
"add": "2.0.6"
|
|
27
26
|
},
|
|
28
27
|
"devDependencies": {
|
|
29
|
-
"@babel/core": "
|
|
30
|
-
"@babel/plugin-proposal-object-rest-spread": "
|
|
31
|
-
"@babel/preset-env": "
|
|
32
|
-
"@babel/preset-react": "
|
|
33
|
-
"tsdx": "
|
|
34
|
-
"tslib": "
|
|
35
|
-
"typescript": "
|
|
28
|
+
"@babel/core": "7.15.0",
|
|
29
|
+
"@babel/plugin-proposal-object-rest-spread": "7.14.7",
|
|
30
|
+
"@babel/preset-env": "7.15.0",
|
|
31
|
+
"@babel/preset-react": "7.14.5",
|
|
32
|
+
"tsdx": "0.14.1",
|
|
33
|
+
"tslib": "2.3.1",
|
|
34
|
+
"typescript": "4.9.5"
|
|
36
35
|
},
|
|
37
36
|
"peerDependencies": {
|
|
38
37
|
"react": ">=18 <19",
|