chore: Refactor Accordion component and update package version

Author: agjs

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@programmer_network/yail",
-  "version": "1.0.186",
+  "version": "1.0.187",
   "description": "Programmer Network's official UI library for React",
   "author": "Aleksandar Grbic - (https://programmer.network)",
   "publishConfig": {

src/Components/Accordion/index.tsx

@@ -18,10 +18,10 @@ import { AccordionOrderType, IAccordionProps } from "./types";
 const Accordion: FC<IAccordionProps> = ({
   className,
   sections,
-  onSorted,
   sectionTitleClassName,
   onSectionItemClick,
   onSectionClick,
+  onSorted,
   onSelected,
   onAddSection,
   addSectionLabel,
@@ -68,7 +68,7 @@ const Accordion: FC<IAccordionProps> = ({
     e.preventDefault();
     e.stopPropagation();
     if (draggedId != null && draggedOverId != null) {
-      onSorted(
+      onSorted?.(
         AccordionOrderType.SECTIONS,
         ArrayUtils.reorder(
           sections,
@@ -183,7 +183,7 @@ const Accordion: FC<IAccordionProps> = ({
                     setSelectedItemId(item.id);
                   }}
                   onDragged={(items: IDraggableListItem[]) => {
-                    onSorted(
+                    onSorted?.(
                       AccordionOrderType.LECTURES,
                       [
                         ...sections.map(s =>

src/Components/Accordion/types.ts

@@ -23,7 +23,7 @@ export interface IAccordionProps {
   className?: string;
   sections: ISection[];
   sectionTitleClassName?: string;
-  onSorted: (
+  onSorted?: (
     type: AccordionOrderType,
     sections: ISection[],
     section: { sectionId: number; items: IDraggableListItem[] }

src/Components/Button/Button.stories.tsx

@@ -87,6 +87,19 @@ export const WithIconClassName: Story = {
   }
 };
 
+export const LoadingWithIcon: Story = {
+  args: {
+    children: "Button",
+    outlined: true,
+    isLoading: true,
+    className: "button--green",
+    icon: {
+      iconName: "IconBomb",
+      iconPosition: "left"
+    }
+  }
+};
+
 export const Red: Story = {
   args: {
     children: "Button",

src/Components/Button/index.tsx

@@ -56,7 +56,7 @@ const Button: React.FC<IButtonProps> = (
         <span
           className={classNames({
             "yl-flex yl-gap-1 yl-items-center": icon?.iconName,
-            invisible: isLoading
+            "yl-invisible": isLoading
           })}
         >
           {!isLoading && icon?.iconName && icon.iconPosition === "left" && (