@linzjs/lui 26.1.0 → 26.2.0

package/CHANGELOG.md

@@ -5,6 +5,14 @@
 
 * **LuiComboSelect:** restore interface to support styling of the input element. ([#1270](https://github.com/linz/lui/issues/1270)) ([7ce6a13](https://github.com/linz/lui/commit/7ce6a137c7f16ffa3acbe4357569a6eb59ef47db))
 
+## [26.2.0](https://github.com/linz/Lui/compare/lui-v26.1.0...lui-v26.2.0) (2026-09-10)
+
+
+### Features
+
+* enable snyk ([#1410](https://github.com/linz/Lui/issues/1410)) ([457c6b0](https://github.com/linz/Lui/commit/457c6b0f8b989316c67f6b064edb2d36e52096be))
+* **LuiAccordion:** support right-aligned chevron ([#1414](https://github.com/linz/Lui/issues/1414)) ([89908f9](https://github.com/linz/Lui/commit/89908f9945df9565579699ea0a23794b96a0da4d))
+
 ## [26.1.0](https://github.com/linz/Lui/compare/lui-v26.0.0...lui-v26.1.0) (2026-09-04)
 
 

package/dist/components/LuiAccordion/LuiAccordion.d.ts

@@ -5,6 +5,7 @@ export interface ILuiAccordion {
     children: ReactNode;
     expanded?: boolean;
     iconColor?: string;
+    iconPosition?: 'left' | 'right';
     className?: string;
     style?: CSSProperties;
     onToggleExpand?: (isOpen: boolean) => void;

package/dist/index.js

@@ -34012,11 +34012,11 @@ const LuiAccordicardStatic = (props) => {
             React__default["default"].createElement(LuiIcon, { className: clsx('LuiAccordicardStatic-chevron', isOpen ? 'LuiAccordicardStatic-chevron--isOpen' : null), name: 'ic_expand_more', alt: "expand", title: "Expand and collapse panel", size: "md" }))));
 };
 
-var css_248z$j = "/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n.lui-accordion {\n  padding: 8px;\n  border-radius: 5px;\n  box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.2509803922), 0px 0px 3px 0px rgba(0, 0, 0, 0.1490196078);\n}\n.lui-accordion .chevron {\n  transition: all 0.3s ease-in-out;\n  transform: rotate(0);\n}\n.lui-accordion .chevron--isOpen {\n  transform: rotate(180deg);\n}\n.lui-accordion .accordion-heading {\n  padding: 4px;\n}\n.lui-accordion h4 {\n  padding: 4px;\n}\n.lui-accordion > summary {\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n}\n.lui-accordion > summary h4 {\n  margin-top: 0;\n  display: inline-block;\n}\n.lui-accordion > summary::marker, .lui-accordion > summary::-webkit-details-marker {\n  display: none;\n}";
+var css_248z$j = "/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n.lui-accordion {\n  padding: 8px;\n  border-radius: 5px;\n  box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.2509803922), 0px 0px 3px 0px rgba(0, 0, 0, 0.1490196078);\n}\n.lui-accordion .chevron {\n  transition: all 0.3s ease-in-out;\n  transform: rotate(0);\n}\n.lui-accordion .chevron--isOpen {\n  transform: rotate(180deg);\n}\n.lui-accordion--icon-right > summary .chevron {\n  margin-left: auto;\n}\n.lui-accordion .accordion-heading {\n  padding: 4px;\n}\n.lui-accordion h4 {\n  padding: 4px;\n}\n.lui-accordion > summary {\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n}\n.lui-accordion > summary h4 {\n  margin-top: 0;\n  display: inline-block;\n}\n.lui-accordion > summary::marker, .lui-accordion > summary::-webkit-details-marker {\n  display: none;\n}";
 styleInject(css_248z$j);
 
 const LuiAccordion = (props) => {
-    const { expanded = false, heading, children, iconColor = '#017A76', className, style = {}, onToggleExpand, } = props;
+    const { expanded = false, heading, children, iconColor = '#017A76', iconPosition = 'left', className, style = {}, onToggleExpand, } = props;
     const [open, setOpen] = React.useState(expanded);
     React__default["default"].useEffect(() => {
         setOpen(expanded);
@@ -34029,10 +34029,13 @@ const LuiAccordion = (props) => {
             onToggleExpand(!open);
         }
     };
-    return (React__default["default"].createElement("details", { style: style, className: clsx('lui-accordion', className), open: open },
+    const chevron = (React__default["default"].createElement(LuiIcon, { color: iconColor, size: "md", name: "ic_expand_more", alt: open ? 'Close' : 'Expand', "aria-label": open ? 'Expanded' : 'Closed', className: clsx('chevron', open ? 'chevron--isOpen' : null) }));
+    const headingContent = React__default["default"].isValidElement(heading) ? (heading) : (React__default["default"].createElement("h4", { className: "accordion-heading", "data-testid": `lui-accordion-heading-${open}` }, heading));
+    return (React__default["default"].createElement("details", { style: style, className: clsx('lui-accordion', `lui-accordion--icon-${iconPosition}`, className), open: open },
         React__default["default"].createElement("summary", { onClick: toggle, "data-testid": `lui-accordion-summary-${open}` },
-            React__default["default"].createElement(LuiIcon, { color: iconColor, size: "md", name: "ic_expand_more", alt: open ? 'Close' : 'Expand', "aria-label": open ? 'Expanded' : 'Closed', className: clsx('chevron', open ? 'chevron--isOpen' : null) }),
-            React__default["default"].isValidElement(heading) ? (heading) : (React__default["default"].createElement("h4", { className: "accordion-heading", "data-testid": `lui-accordion-heading-${open}` }, heading))),
+            iconPosition === 'left' && chevron,
+            headingContent,
+            iconPosition === 'right' && chevron),
         children));
 };