krl-alfred 1.72.10 → 1.72.11

package/dist/components/Accordion/Accordion.js

@@ -14,7 +14,7 @@ exports.AccordionContext = (0, react_1.createContext)({
     setActive: function (index) { }
 });
 var Accordion = function (props) {
-    var title = props.title, data = props.data, activeIndex = props.activeIndex, showLink = props.showLink, linkText = props.linkText, linkOnClick = props.linkOnClick;
+    var title = props.title, data = props.data, activeIndex = props.activeIndex, showLink = props.showLink, linkText = props.linkText, linkOnClick = props.linkOnClick, collapseAll = props.collapseAll;
     var _a = (0, react_1.useState)(0), active = _a[0], setActive = _a[1];
     (0, react_1.useEffect)(function () {
         setActive(activeIndex);
@@ -22,7 +22,7 @@ var Accordion = function (props) {
     return ((0, jsx_runtime_1.jsxs)(Accordion_styled_1.AccordionStyled, { children: [title && (0, jsx_runtime_1.jsx)(Accordion_styled_1.AccordionTitle, { className: "title-bold-16-19", children: title }), (0, jsx_runtime_1.jsx)(Accordion_styled_1.Wrapper, { children: (0, jsx_runtime_1.jsx)(exports.AccordionContext.Provider, { value: {
                         active: active,
                         setActive: setActive
-                    }, children: data === null || data === void 0 ? void 0 : data.map(function (item, key) { return ((0, jsx_runtime_1.jsx)(AccordionItem_1.default, { index: key, title: item.question, content: item.answer }, key)); }) }) }), showLink && ((0, jsx_runtime_1.jsx)(Accordion_styled_1.Footer, { className: "body-bold-14-17", children: (0, jsx_runtime_1.jsx)(TextLink_1.default, { onClick: linkOnClick, children: linkText }) }))] }));
+                    }, children: data === null || data === void 0 ? void 0 : data.map(function (item, key) { return ((0, jsx_runtime_1.jsx)(AccordionItem_1.default, { collapseAll: collapseAll, index: key, title: item.question, content: item.answer }, key)); }) }) }), showLink && ((0, jsx_runtime_1.jsx)(Accordion_styled_1.Footer, { className: "body-bold-14-17", children: (0, jsx_runtime_1.jsx)(TextLink_1.default, { onClick: linkOnClick, children: linkText }) }))] }));
 };
 Accordion.defaultProps = {
     activeIndex: 0,

package/dist/components/Accordion/AccordionItem.js

@@ -9,14 +9,24 @@ var Accordion_styled_1 = require("./Accordion.styled");
 var Accordion_1 = require("./Accordion");
 var Icon_1 = __importDefault(require("../Icon/Icon"));
 var AccordionItem = function (props) {
-    var title = props.title, content = props.content, index = props.index;
+    var title = props.title, content = props.content, index = props.index, collapseAll = props.collapseAll;
     var _a = (0, react_1.useContext)(Accordion_1.AccordionContext), active = _a.active, setActive = _a.setActive;
     var _b = (0, react_1.useState)(0), height = _b[0], setHeight = _b[1];
     var itemRef = (0, react_1.useRef)();
     (0, react_1.useEffect)(function () {
         var _a, _b;
-        setHeight(active === index ? (_b = (_a = itemRef === null || itemRef === void 0 ? void 0 : itemRef.current) === null || _a === void 0 ? void 0 : _a.children[0]) === null || _b === void 0 ? void 0 : _b.clientHeight : 0);
+        setHeight((active === index || activeItem) ? (_b = (_a = itemRef === null || itemRef === void 0 ? void 0 : itemRef.current) === null || _a === void 0 ? void 0 : _a.children[0]) === null || _b === void 0 ? void 0 : _b.clientHeight : 0);
     });
-    return ((0, jsx_runtime_1.jsxs)(Accordion_styled_1.Item, { children: [(0, jsx_runtime_1.jsxs)(Accordion_styled_1.ItemTitle, { onClick: function () { return setActive(active === index ? null : index); }, className: "body-bold-14-17", children: [(0, jsx_runtime_1.jsx)("div", { children: title }), (0, jsx_runtime_1.jsxs)("div", { children: [" ", (0, jsx_runtime_1.jsx)(Icon_1.default, { name: active === index ? 'NegativeSmall' : 'PlusSmall', width: "24px", height: "24px" }), " "] })] }), (0, jsx_runtime_1.jsx)(Accordion_styled_1.ItemContent, { ref: itemRef, style: { height: height }, active: active === index, className: "body-regular-14-17", children: (0, jsx_runtime_1.jsx)("div", { children: content }) })] }));
+    var _c = (0, react_1.useState)(collapseAll ? true : false), activeItem = _c[0], setActiveItem = _c[1];
+    var handleCollapse = function () {
+        if (collapseAll) {
+            setActiveItem(!activeItem);
+        }
+        else {
+            setActive(active === index ? null : index);
+            setActiveItem(false);
+        }
+    };
+    return ((0, jsx_runtime_1.jsxs)(Accordion_styled_1.Item, { children: [(0, jsx_runtime_1.jsxs)(Accordion_styled_1.ItemTitle, { onClick: handleCollapse, className: "body-bold-14-17", children: [(0, jsx_runtime_1.jsx)("div", { children: title }), (0, jsx_runtime_1.jsxs)("div", { children: [" ", (0, jsx_runtime_1.jsx)(Icon_1.default, { name: (active === index || activeItem) ? 'NegativeSmall' : 'PlusSmall', width: "24px", height: "24px" }), " "] })] }), (0, jsx_runtime_1.jsx)(Accordion_styled_1.ItemContent, { ref: itemRef, style: { height: height }, active: (active === index || activeItem), className: "body-regular-14-17", children: (0, jsx_runtime_1.jsx)("div", { children: content }) })] }));
 };
 exports.default = AccordionItem;

package/dist/components/Accordion/stories/Accordion.stories.js

@@ -10,13 +10,18 @@ exports.default = {
     title: 'Components/Accordion',
     component: Accordion_1.default,
     tags: ['autodocs'],
-    argTypes: {}
+    argTypes: {
+        collapseAll: { control: 'boolean' },
+        showLink: { control: 'boolean' },
+    }
 };
 exports.Default = {
     args: {
         title: "Merak Edebileceğin Sorulardan Bazıları",
         data: faq_json_1.default,
         showLink: false,
+        collapseAll: true,
+        activeIndex: null,
         linkText: "Daha Fazla Soru Göster",
         linkOnClick: function () { return console.log("test"); },
     },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "krl-alfred",
-  "version": "1.72.10",
+  "version": "1.72.11",
   "files": [
     "dist"
   ],