etudes 0.51.0 → 0.52.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/SelectableButton.js
CHANGED
|
@@ -77,22 +77,16 @@ function SelectableButton(_a) {
|
|
|
77
77
|
if (!isDeselectable)
|
|
78
78
|
return;
|
|
79
79
|
setIsSelected(false);
|
|
80
|
+
onDeselect === null || onDeselect === void 0 ? void 0 : onDeselect();
|
|
80
81
|
}
|
|
81
82
|
else {
|
|
82
83
|
setIsSelected(true);
|
|
84
|
+
onSelect === null || onSelect === void 0 ? void 0 : onSelect();
|
|
83
85
|
}
|
|
84
86
|
};
|
|
85
87
|
(0, react_1.useEffect)(function () {
|
|
86
88
|
setIsSelected(externalIsSelected);
|
|
87
89
|
}, [externalIsSelected]);
|
|
88
|
-
(0, react_1.useEffect)(function () {
|
|
89
|
-
if (isSelected) {
|
|
90
|
-
onSelect === null || onSelect === void 0 ? void 0 : onSelect();
|
|
91
|
-
}
|
|
92
|
-
else {
|
|
93
|
-
onDeselect === null || onDeselect === void 0 ? void 0 : onDeselect();
|
|
94
|
-
}
|
|
95
|
-
}, [isSelected]);
|
|
96
90
|
return (react_1.default.createElement(StyledRoot, __assign({}, props, { onClick: function () { return toggleSelection(); }, disabled: isDisabled || (isSelected && !isDeselectable) }), (_b = children === null || children === void 0 ? void 0 : children({ isDeselectable: isDeselectable, isDisabled: isDisabled, isSelected: isSelected, label: label })) !== null && _b !== void 0 ? _b : label));
|
|
97
91
|
}
|
|
98
92
|
exports.default = SelectableButton;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectableButton.js","sourceRoot":"/","sources":["SelectableButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAAkE;AAClE,wEAAsC;AAYtC,SAAwB,gBAAgB,CAAC,EASjC;;IARN,IAAA,QAAQ,cAAA,EACR,sBAAsB,EAAtB,cAAc,mBAAG,KAAK,KAAA,EACtB,kBAAkB,EAAlB,UAAU,mBAAG,KAAK,KAAA,EAClB,kBAAsC,EAA1B,kBAAkB,mBAAG,KAAK,KAAA,EACtC,KAAK,WAAA,EACL,UAAU,gBAAA,EACV,QAAQ,cAAA,EACL,KAAK,cAR+B,6FASxC,CADS;IAEF,IAAA,KAAA,OAA8B,IAAA,gBAAQ,EAAC,kBAAkB,CAAC,IAAA,EAAzD,UAAU,QAAA,EAAE,aAAa,QAAgC,CAAA;IAEhE,IAAM,eAAe,GAAG;QACtB,IAAI,UAAU;YAAE,OAAM;QAEtB,IAAI,UAAU,EAAE;YACd,IAAI,CAAC,cAAc;gBAAE,OAAM;YAC3B,aAAa,CAAC,KAAK,CAAC,CAAA;
|
|
1
|
+
{"version":3,"file":"SelectableButton.js","sourceRoot":"/","sources":["SelectableButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAAkE;AAClE,wEAAsC;AAYtC,SAAwB,gBAAgB,CAAC,EASjC;;IARN,IAAA,QAAQ,cAAA,EACR,sBAAsB,EAAtB,cAAc,mBAAG,KAAK,KAAA,EACtB,kBAAkB,EAAlB,UAAU,mBAAG,KAAK,KAAA,EAClB,kBAAsC,EAA1B,kBAAkB,mBAAG,KAAK,KAAA,EACtC,KAAK,WAAA,EACL,UAAU,gBAAA,EACV,QAAQ,cAAA,EACL,KAAK,cAR+B,6FASxC,CADS;IAEF,IAAA,KAAA,OAA8B,IAAA,gBAAQ,EAAC,kBAAkB,CAAC,IAAA,EAAzD,UAAU,QAAA,EAAE,aAAa,QAAgC,CAAA;IAEhE,IAAM,eAAe,GAAG;QACtB,IAAI,UAAU;YAAE,OAAM;QAEtB,IAAI,UAAU,EAAE;YACd,IAAI,CAAC,cAAc;gBAAE,OAAM;YAC3B,aAAa,CAAC,KAAK,CAAC,CAAA;YACpB,UAAU,aAAV,UAAU,uBAAV,UAAU,EAAI,CAAA;SACf;aACI;YACH,aAAa,CAAC,IAAI,CAAC,CAAA;YACnB,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,EAAI,CAAA;SACb;IACH,CAAC,CAAA;IAED,IAAA,iBAAS,EAAC;QACR,aAAa,CAAC,kBAAkB,CAAC,CAAA;IACnC,CAAC,EAAE,CAAC,kBAAkB,CAAC,CAAC,CAAA;IAExB,OAAO,CACL,8BAAC,UAAU,eAAK,KAAK,IAAE,OAAO,EAAE,cAAM,OAAA,eAAe,EAAE,EAAjB,CAAiB,EAAE,QAAQ,EAAE,UAAU,IAAI,CAAC,UAAU,IAAI,CAAC,cAAc,CAAC,KAC7G,MAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,EAAE,cAAc,gBAAA,EAAE,UAAU,YAAA,EAAE,UAAU,YAAA,EAAE,KAAK,OAAA,EAAE,CAAC,mCAAI,KAAK,CAC5D,CACd,CAAA;AACH,CAAC;AAnCD,mCAmCC;AAED,IAAM,UAAU,GAAG,2BAAM,CAAC,MAAM,wHAAA,qDAI/B,IAAA,CAAA","sourcesContent":["import React, { HTMLAttributes, useEffect, useState } from 'react'\nimport styled from 'styled-components'\n\nexport type Props = HTMLAttributes<HTMLButtonElement> & {\n children?: (props: Pick<Props, 'isDeselectable' | 'isDisabled' | 'isSelected' | 'label'>) => JSX.Element\n isDeselectable?: boolean\n isDisabled?: boolean\n isSelected?: boolean\n label?: string\n onDeselect?: () => void\n onSelect?: () => void\n}\n\nexport default function SelectableButton({\n children,\n isDeselectable = false,\n isDisabled = false,\n isSelected: externalIsSelected = false,\n label,\n onDeselect,\n onSelect,\n ...props\n}: Props) {\n const [isSelected, setIsSelected] = useState(externalIsSelected)\n\n const toggleSelection = () => {\n if (isDisabled) return\n\n if (isSelected) {\n if (!isDeselectable) return\n setIsSelected(false)\n onDeselect?.()\n }\n else {\n setIsSelected(true)\n onSelect?.()\n }\n }\n\n useEffect(() => {\n setIsSelected(externalIsSelected)\n }, [externalIsSelected])\n\n return (\n <StyledRoot {...props} onClick={() => toggleSelection()} disabled={isDisabled || (isSelected && !isDeselectable)}>\n {children?.({ isDeselectable, isDisabled, isSelected, label }) ?? label}\n </StyledRoot>\n )\n}\n\nconst StyledRoot = styled.button`\n &[disabled] {\n pointer-events: none;\n }\n`\n"]}
|