krl-alfred 2.18.11 → 2.18.12

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.
Files changed (7) hide show
  1. package/dist/components/Accordion/Accordion.js +6 -6
  2. package/dist/components/Accordion/Accordion.styled.js +1 -1
  3. package/dist/components/Accordion/props.d.ts +2 -1
  4. package/dist/components/Accordion/props.js +1 -1
  5. package/dist/components/Accordion/stories/Accordion.stories.d.ts +7 -7
  6. package/dist/components/Accordion/stories/Accordion.stories.js +7 -7
  7. package/package.json +1 -1
package/dist/components/Accordion/Accordion.js CHANGED
@@ -22,16 +22,16 @@ var AccordionItem_1 = __importDefault(require("./AccordionItem"));
22
22
  var TextLink_1 = __importDefault(require("./../TextLink"));
23
23
  var Accordion = function (_a) {
24
24
  var _b = _a.data, data = _b === void 0 ? props_1.AccordionDefault.data : _b, _c = _a.linkOnClick, linkOnClick = _c === void 0 ? props_1.AccordionDefault.linkOnClick : _c, _d = _a.collapseAll, collapseAll = _d === void 0 ? props_1.AccordionDefault.collapseAll : _d, _e = _a.size, size = _e === void 0 ? props_1.AccordionDefault.size : _e, _f = _a.hasScrollOnFocus, hasScrollOnFocus = _f === void 0 ? props_1.AccordionDefault.hasScrollOnFocus : _f, _g = _a.activeIndex, activeIndex = _g === void 0 ? props_1.AccordionDefault.activeIndex : _g, _h = _a.showLink, showLink = _h === void 0 ? props_1.AccordionDefault.showLink : _h, _j = _a.linkText, linkText = _j === void 0 ? props_1.AccordionDefault.linkText : _j;
25
- var _k = (0, react_1.useState)(0), active = _k[0], setActive = _k[1];
26
- var wrapperRef = (0, react_1.useRef)();
25
+ var _k = (0, react_1.useState)(activeIndex !== null && activeIndex !== void 0 ? activeIndex : null), active = _k[0], setActive = _k[1];
26
+ var wrapperRef = (0, react_1.useRef)(null);
27
27
  (0, react_1.useEffect)(function () {
28
- setActive(activeIndex);
28
+ setActive(activeIndex !== null && activeIndex !== void 0 ? activeIndex : null);
29
29
  }, [activeIndex]);
30
30
  (0, react_1.useEffect)(function () {
31
- if (hasScrollOnFocus) {
31
+ if (hasScrollOnFocus && activeIndex != null && activeIndex >= 0) {
32
32
  setTimeout(function () {
33
- var _a;
34
- (_a = wrapperRef.current.children[activeIndex - 1]) === null || _a === void 0 ? void 0 : _a.scrollIntoView({ behavior: 'smooth', block: 'start' });
33
+ var _a, _b;
34
+ (_b = (_a = wrapperRef.current) === null || _a === void 0 ? void 0 : _a.children[activeIndex - 1]) === null || _b === void 0 ? void 0 : _b.scrollIntoView({ behavior: 'smooth', block: 'start' });
35
35
  }, 800);
36
36
  }
37
37
  }, [hasScrollOnFocus, activeIndex]);
package/dist/components/Accordion/Accordion.styled.js CHANGED
@@ -14,7 +14,7 @@ exports.AccordionStyled = styled_components_1.default.div(templateObject_1 || (t
14
14
  exports.AccordionTitle = styled_components_1.default.h1(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n margin-bottom: 1.5rem;\n margin-top: 0;\n font : ", ";\n\n @media only screen and ", " {\n font : var(--title-bold-16-19);\n }\n"], ["\n margin-bottom: 1.5rem;\n margin-top: 0;\n font : ", ";\n\n @media only screen and ", " {\n font : var(--title-bold-16-19);\n }\n"])), function (props) { return props.$size === "large" ? "var(--headline-bold-18-22)" : "var(--title-bold-16-19)"; }, devices_1.devices.lg);
15
15
  exports.Wrapper = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n\n"], ["\n\n"])));
16
16
  exports.Item = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n &:not(:nth-child(1)) {\n margin-top: 1.5rem;\n }\n"], ["\n &:not(:nth-child(1)) {\n margin-top: 1.5rem;\n }\n"])));
17
- exports.ItemTitle = styled_components_1.default.strong(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n cursor: pointer;\n font : ", ";\n >div{\n position: relative;\n &:last-child{\n > div{\n transition: all .3s ease;\n &:first-child{\n opacity: 0;\n }\n &:last-child{\n position: absolute;\n inset: 0;\n opacity: 1;\n }\n }\n }\n }\n \n &:is(.active){\n >div{\n &:last-child{\n > div{\n &:first-child{\n opacity: 1;\n }\n &:last-child{\n transform: rotate(90deg);\n opacity: 0;\n }\n }\n }\n }\n }\n @media only screen and ", " {\n font : var(--body-bold-14-17);\n }\n"], ["\n display: flex;\n align-items: center;\n justify-content: space-between;\n cursor: pointer;\n font : ", ";\n >div{\n position: relative;\n &:last-child{\n > div{\n transition: all .3s ease;\n &:first-child{\n opacity: 0;\n }\n &:last-child{\n position: absolute;\n inset: 0;\n opacity: 1;\n }\n }\n }\n }\n \n &:is(.active){\n >div{\n &:last-child{\n > div{\n &:first-child{\n opacity: 1;\n }\n &:last-child{\n transform: rotate(90deg);\n opacity: 0;\n }\n }\n }\n }\n }\n @media only screen and ", " {\n font : var(--body-bold-14-17);\n }\n"])), function (props) { return props.$size === "large" ? "var(--title-bold-16-19)" : "var(--body-bold-14-17)"; }, devices_1.devices.lg);
17
+ exports.ItemTitle = styled_components_1.default.strong(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n cursor: pointer;\n font : ", ";\n >div{\n position: relative;\n &:last-child{\n margin-left: 1rem;\n > div{\n transition: all .3s ease;\n &:first-child{\n opacity: 0;\n }\n &:last-child{\n position: absolute;\n inset: 0;\n opacity: 1;\n }\n }\n }\n }\n \n &:is(.active){\n >div{\n &:last-child{\n > div{\n &:first-child{\n opacity: 1;\n }\n &:last-child{\n transform: rotate(90deg);\n opacity: 0;\n }\n }\n }\n }\n }\n @media only screen and ", " {\n font : var(--body-bold-14-17);\n }\n"], ["\n display: flex;\n align-items: center;\n justify-content: space-between;\n cursor: pointer;\n font : ", ";\n >div{\n position: relative;\n &:last-child{\n margin-left: 1rem;\n > div{\n transition: all .3s ease;\n &:first-child{\n opacity: 0;\n }\n &:last-child{\n position: absolute;\n inset: 0;\n opacity: 1;\n }\n }\n }\n }\n \n &:is(.active){\n >div{\n &:last-child{\n > div{\n &:first-child{\n opacity: 1;\n }\n &:last-child{\n transform: rotate(90deg);\n opacity: 0;\n }\n }\n }\n }\n }\n @media only screen and ", " {\n font : var(--body-bold-14-17);\n }\n"])), function (props) { return props.$size === "large" ? "var(--title-bold-16-19)" : "var(--body-bold-14-17)"; }, devices_1.devices.lg);
18
18
  exports.ItemContent = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n transition: all .3s ease;\n overflow: hidden;\n position: relative;\n font : ", ";\n @media only screen and ", " {\n font : var(--body-regular-14-17);\n }\n > div{\n padding: 1rem 2rem 0 0;\n position: absolute;\n left: 0;\n right: 0;\n top: 0;\n a{\n color : var(--primary);\n &:hover , :focus , :active {\n color: var(--primary-hover);\n }\n }\n }\n"], ["\n transition: all .3s ease;\n overflow: hidden;\n position: relative;\n font : ", ";\n @media only screen and ", " {\n font : var(--body-regular-14-17);\n }\n > div{\n padding: 1rem 2rem 0 0;\n position: absolute;\n left: 0;\n right: 0;\n top: 0;\n a{\n color : var(--primary);\n &:hover , :focus , :active {\n color: var(--primary-hover);\n }\n }\n }\n"])), function (props) { return props.$size === "large" ? "var(--title-regular-16-19)" : "var(--body-regular-14-17)"; }, devices_1.devices.lg);
19
19
  exports.Footer = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n box-sizing: border-box;\n display: block;\n margin-top: 1.5rem!important;\n font : var(--body-bold-14-17);\n"], ["\n box-sizing: border-box;\n display: block;\n margin-top: 1.5rem!important;\n font : var(--body-bold-14-17);\n"])));
20
20
  var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
package/dist/components/Accordion/props.d.ts CHANGED
@@ -3,7 +3,8 @@ type SIZES = typeof sizes[number];
3
3
  export interface Accordion {
4
4
  data?: [];
5
5
  active?: boolean;
6
- activeIndex?: number;
6
+ /** Açık panel indeksi (0 tabanlı). null = hiçbiri açık değil */
7
+ activeIndex?: number | null;
7
8
  showLink?: boolean;
8
9
  collapseAll?: boolean;
9
10
  linkText?: string;
package/dist/components/Accordion/props.js CHANGED
@@ -5,7 +5,7 @@ exports.sizes = ['large', 'medium'];
5
5
  exports.AccordionDefault = {
6
6
  data: [],
7
7
  active: false,
8
- activeIndex: 0,
8
+ activeIndex: null,
9
9
  showLink: false,
10
10
  collapseAll: false,
11
11
  linkText: 'Daha Fazla Soru Göster',
package/dist/components/Accordion/stories/Accordion.stories.d.ts CHANGED
@@ -27,7 +27,7 @@ export declare const Default: {
27
27
  showLink: boolean;
28
28
  collapseAll: boolean;
29
29
  hasScrollOnFocus: boolean;
30
- activeIndex: number;
30
+ activeIndex: any;
31
31
  linkText: string;
32
32
  linkOnClick: () => void;
33
33
  size: string;
@@ -44,7 +44,7 @@ export declare const Large: {
44
44
  showLink: boolean;
45
45
  collapseAll: boolean;
46
46
  hasScrollOnFocus: boolean;
47
- activeIndex: number;
47
+ activeIndex: any;
48
48
  linkText: string;
49
49
  linkOnClick: () => void;
50
50
  size: string;
@@ -61,7 +61,7 @@ export declare const WithLink: {
61
61
  showLink: boolean;
62
62
  collapseAll: boolean;
63
63
  hasScrollOnFocus: boolean;
64
- activeIndex: number;
64
+ activeIndex: any;
65
65
  linkText: string;
66
66
  linkOnClick: () => void;
67
67
  size: string;
@@ -78,7 +78,7 @@ export declare const LargeWithLink: {
78
78
  showLink: boolean;
79
79
  collapseAll: boolean;
80
80
  hasScrollOnFocus: boolean;
81
- activeIndex: number;
81
+ activeIndex: any;
82
82
  linkText: string;
83
83
  linkOnClick: () => void;
84
84
  size: string;
@@ -95,7 +95,7 @@ export declare const CollapseAll: {
95
95
  showLink: boolean;
96
96
  collapseAll: boolean;
97
97
  hasScrollOnFocus: boolean;
98
- activeIndex: number;
98
+ activeIndex: any;
99
99
  linkText: string;
100
100
  linkOnClick: () => void;
101
101
  size: string;
@@ -112,7 +112,7 @@ export declare const LargeCollapseAll: {
112
112
  showLink: boolean;
113
113
  collapseAll: boolean;
114
114
  hasScrollOnFocus: boolean;
115
- activeIndex: number;
115
+ activeIndex: any;
116
116
  linkText: string;
117
117
  linkOnClick: () => void;
118
118
  size: string;
@@ -129,7 +129,7 @@ export declare const CollapseAllWithLink: {
129
129
  showLink: boolean;
130
130
  collapseAll: boolean;
131
131
  hasScrollOnFocus: boolean;
132
- activeIndex: number;
132
+ activeIndex: any;
133
133
  linkText: string;
134
134
  linkOnClick: () => void;
135
135
  size: string;
package/dist/components/Accordion/stories/Accordion.stories.js CHANGED
@@ -24,7 +24,7 @@ exports.Default = {
24
24
  showLink: false,
25
25
  collapseAll: false,
26
26
  hasScrollOnFocus: false,
27
- activeIndex: 0,
27
+ activeIndex: null,
28
28
  linkText: "Daha Fazla Soru Göster",
29
29
  linkOnClick: function () { return console.log("test"); },
30
30
  size: 'medium'
@@ -37,7 +37,7 @@ exports.Large = {
37
37
  showLink: false,
38
38
  collapseAll: false,
39
39
  hasScrollOnFocus: false,
40
- activeIndex: 0,
40
+ activeIndex: null,
41
41
  linkText: "Daha Fazla Soru Göster",
42
42
  linkOnClick: function () { return console.log("test"); },
43
43
  size: 'large'
@@ -50,7 +50,7 @@ exports.WithLink = {
50
50
  showLink: true,
51
51
  collapseAll: false,
52
52
  hasScrollOnFocus: false,
53
- activeIndex: 0,
53
+ activeIndex: null,
54
54
  linkText: "Daha Fazla Soru Göster",
55
55
  linkOnClick: function () { return console.log("Daha fazla soru göster tıklandı"); },
56
56
  size: 'medium'
@@ -63,7 +63,7 @@ exports.LargeWithLink = {
63
63
  showLink: true,
64
64
  collapseAll: false,
65
65
  hasScrollOnFocus: false,
66
- activeIndex: 0,
66
+ activeIndex: null,
67
67
  linkText: "Tüm Soruları Gör",
68
68
  linkOnClick: function () { return console.log("Tüm soruları gör tıklandı"); },
69
69
  size: 'large'
@@ -76,7 +76,7 @@ exports.CollapseAll = {
76
76
  showLink: false,
77
77
  collapseAll: true,
78
78
  hasScrollOnFocus: false,
79
- activeIndex: 0,
79
+ activeIndex: null,
80
80
  linkText: "Daha Fazla Soru Göster",
81
81
  linkOnClick: function () { return console.log("test"); },
82
82
  size: 'medium'
@@ -89,7 +89,7 @@ exports.LargeCollapseAll = {
89
89
  showLink: false,
90
90
  collapseAll: true,
91
91
  hasScrollOnFocus: false,
92
- activeIndex: 0,
92
+ activeIndex: null,
93
93
  linkText: "Daha Fazla Soru Göster",
94
94
  linkOnClick: function () { return console.log("test"); },
95
95
  size: 'large'
@@ -102,7 +102,7 @@ exports.CollapseAllWithLink = {
102
102
  showLink: true,
103
103
  collapseAll: true,
104
104
  hasScrollOnFocus: false,
105
- activeIndex: 0,
105
+ activeIndex: null,
106
106
  linkText: "Daha Fazla Soru Göster",
107
107
  linkOnClick: function () { return console.log("test"); },
108
108
  size: 'medium'
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "krl-alfred",
3
- "version": "2.18.11",
3
+ "version": "2.18.12",
4
4
  "files": [
5
5
  "dist"
6
6
  ],