@designbasekorea/figma-ui 0.1.78 → 0.1.79
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/index.css +1 -1
- package/dist/index.css.map +1 -1
- package/dist/index.esm.css +1 -1
- package/dist/index.esm.css.map +1 -1
- package/dist/index.esm.js +2 -12
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +2 -12
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -104,7 +104,6 @@ FigmaHeader.displayName = 'FigmaHeader';
|
|
|
104
104
|
|
|
105
105
|
const FigmaSection = ({ title, dataCategory, iconButton, children, marginBottom, isEnabled = true, onToggle, className, enableScrollNavigation = false, headerHeight = 94, onActiveSectionChange, t, collapsible = false, defaultCollapsed = false, onCollapseChange }) => {
|
|
106
106
|
const sectionRef = React.useRef(null);
|
|
107
|
-
const contentRef = React.useRef(null);
|
|
108
107
|
const [isCollapsed, setIsCollapsed] = React.useState(defaultCollapsed);
|
|
109
108
|
const sectionStyle = marginBottom ? { marginBottom: `${marginBottom}px` } : {};
|
|
110
109
|
const classes = [
|
|
@@ -125,16 +124,6 @@ const FigmaSection = ({ title, dataCategory, iconButton, children, marginBottom,
|
|
|
125
124
|
}
|
|
126
125
|
}
|
|
127
126
|
};
|
|
128
|
-
React.useEffect(() => {
|
|
129
|
-
if (collapsible && contentRef.current) {
|
|
130
|
-
if (!isCollapsed) {
|
|
131
|
-
contentRef.current.style.maxHeight = `${contentRef.current.scrollHeight}px`;
|
|
132
|
-
}
|
|
133
|
-
else {
|
|
134
|
-
contentRef.current.style.maxHeight = '0px';
|
|
135
|
-
}
|
|
136
|
-
}
|
|
137
|
-
}, [isCollapsed, collapsible]);
|
|
138
127
|
React.useEffect(() => {
|
|
139
128
|
if (!enableScrollNavigation || !onActiveSectionChange || !sectionRef.current)
|
|
140
129
|
return;
|
|
@@ -163,7 +152,8 @@ const FigmaSection = ({ title, dataCategory, iconButton, children, marginBottom,
|
|
|
163
152
|
collapsible && (React.createElement("span", { className: `designbase-figma-section__collapse-icon ${isCollapsed ? 'designbase-figma-section__collapse-icon--collapsed' : ''}` },
|
|
164
153
|
React.createElement(icons.ChevronDownIcon, { size: 16 }))),
|
|
165
154
|
onToggle && (React.createElement(ui.Toggle, { checked: isEnabled, onChange: () => onToggle(dataCategory), size: "s" }))))),
|
|
166
|
-
React.createElement("div", {
|
|
155
|
+
React.createElement("div", { className: `designbase-figma-section__content ${!isEnabled ? 'designbase-figma-section__content--hidden' : ''} ${isCollapsed && collapsible ? 'designbase-figma-section__content--collapsed' : ''}` },
|
|
156
|
+
React.createElement("div", { className: "designbase-figma-section__content-inner" }, children))));
|
|
167
157
|
};
|
|
168
158
|
FigmaSection.displayName = 'FigmaSection';
|
|
169
159
|
const scrollToSection = (category, headerHeight = 94) => {
|