@apexcura/ui-components 0.0.16-Beta49 → 0.0.16-Beta50

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 (3) hide show
  1. package/dist/index.js +16 -11
  2. package/dist/index.mjs +16 -11
  3. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -617,7 +617,7 @@ var icons = {
617
617
  fill: "#D9363E"
618
618
  }
619
619
  )),
620
- profile: /* @__PURE__ */ import_react13.default.createElement("svg", { viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react13.default.createElement("path", { d: "M17 19.5C18.3411 19.5 19.5979 18.3735 19.2664 16.9062C19.1476 16.3806 18.9841 15.8647 18.7769 15.3645C18.2994 14.2119 17.5997 13.1646 16.7175 12.2825C15.8354 11.4003 14.7881 10.7006 13.6355 10.2231C12.4829 9.74572 11.2476 9.5 10 9.5C8.75244 9.5 7.5171 9.74572 6.36451 10.2231C5.21191 10.7006 4.16464 11.4003 3.28249 12.2825C2.40033 13.1646 1.70056 14.2119 1.22314 15.3645C1.01594 15.8647 0.852378 16.3806 0.733607 16.9062C0.402069 18.3735 1.65891 19.5 3 19.5L10 19.5H17Z", fill: "#505050" }), /* @__PURE__ */ import_react13.default.createElement("circle", { cx: "10", cy: "6", r: "5.5", fill: "#505050" })),
620
+ profile: /* @__PURE__ */ import_react13.default.createElement("svg", { viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react13.default.createElement("path", { d: "M17 19.5C18.3411 19.5 19.5979 18.3735 19.2664 16.9062C19.1476 16.3806 18.9841 15.8647 18.7769 15.3645C18.2994 14.2119 17.5997 13.1646 16.7175 12.2825C15.8354 11.4003 14.7881 10.7006 13.6355 10.2231C12.4829 9.74572 11.2476 9.5 10 9.5C8.75244 9.5 7.5171 9.74572 6.36451 10.2231C5.21191 10.7006 4.16464 11.4003 3.28249 12.2825C2.40033 13.1646 1.70056 14.2119 1.22314 15.3645C1.01594 15.8647 0.852378 16.3806 0.733607 16.9062C0.402069 18.3735 1.65891 19.5 3 19.5L10 19.5H17Z", fill: "#505050", stroke: "white" }), /* @__PURE__ */ import_react13.default.createElement("circle", { cx: "10", cy: "6", r: "5.5", fill: "#505050", stroke: "white" })),
621
621
  call: /* @__PURE__ */ import_react13.default.createElement("svg", { width: "18", height: "18", viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react13.default.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M0 2.57143C0 1.15127 1.15127 0 2.57143 0H3.74711C4.48457 0 5.1274 0.501906 5.30627 1.21735L6.25409 5.00865C6.41092 5.63597 6.17652 6.29618 5.65922 6.68416L4.5504 7.51577C4.43526 7.60213 4.41023 7.72858 4.44257 7.81687C5.41587 10.4738 7.52615 12.5841 10.1831 13.5574C10.2714 13.5898 10.3979 13.5647 10.4842 13.4496L11.3158 12.3408C11.7038 11.8235 12.364 11.5891 12.9913 11.7459L16.7826 12.6937C17.4981 12.8726 18 13.5154 18 14.2529V15.4286C18 16.8487 16.8487 18 15.4286 18H13.5C6.04416 18 0 11.9558 0 4.5V2.57143Z", fill: "#505050" }))
622
622
  };
623
623
 
@@ -778,7 +778,9 @@ var import_antd11 = require("antd");
778
778
  var { Sider } = import_antd11.Layout;
779
779
  var Sidebar = (props) => {
780
780
  const [collapsed, setCollapsed] = (0, import_react16.useState)(false);
781
- const handleChange = (item) => {
781
+ const [selectedIndex, setSelectedIndex] = (0, import_react16.useState)(null);
782
+ const handleChange = (item, index) => {
783
+ setSelectedIndex(index);
782
784
  if (props.onChange) {
783
785
  props.onChange(item);
784
786
  }
@@ -786,10 +788,19 @@ var Sidebar = (props) => {
786
788
  function getItem(label, key, icon, children, item) {
787
789
  return {
788
790
  key,
789
- icon: icon ? /* @__PURE__ */ import_react16.default.createElement("span", { className: props.iconsClassName }, icon) : null,
791
+ icon: icon ? /* @__PURE__ */ import_react16.default.createElement(
792
+ "span",
793
+ {
794
+ className: props.iconsClassName,
795
+ style: selectedIndex === key ? {
796
+ filter: "brightness(0) saturate(100%) invert(22%) sepia(87%) saturate(7476%) hue-rotate(209deg) brightness(97%) contrast(107%)"
797
+ } : {}
798
+ },
799
+ icon
800
+ ) : null,
790
801
  children,
791
802
  label,
792
- onClick: children ? void 0 : () => handleChange(item)
803
+ onClick: children ? void 0 : () => handleChange(item, key.toString())
793
804
  // Only set onClick for leaf nodes
794
805
  };
795
806
  }
@@ -817,13 +828,7 @@ var Sidebar = (props) => {
817
828
  },
818
829
  /* @__PURE__ */ import_react16.default.createElement("div", { className: "demo-logo-vertical" }),
819
830
  /* @__PURE__ */ import_react16.default.createElement("img", { src: props.img, alt: "", className: props.imgClassName }),
820
- /* @__PURE__ */ import_react16.default.createElement(
821
- import_antd11.Menu,
822
- {
823
- mode: "inline",
824
- items
825
- }
826
- )
831
+ /* @__PURE__ */ import_react16.default.createElement(import_antd11.Menu, { mode: "inline", items, selectedKeys: [selectedIndex] })
827
832
  ));
828
833
  };
829
834
 
package/dist/index.mjs CHANGED
@@ -546,7 +546,7 @@ var icons = {
546
546
  fill: "#D9363E"
547
547
  }
548
548
  )),
549
- profile: /* @__PURE__ */ React12.createElement("svg", { viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ React12.createElement("path", { d: "M17 19.5C18.3411 19.5 19.5979 18.3735 19.2664 16.9062C19.1476 16.3806 18.9841 15.8647 18.7769 15.3645C18.2994 14.2119 17.5997 13.1646 16.7175 12.2825C15.8354 11.4003 14.7881 10.7006 13.6355 10.2231C12.4829 9.74572 11.2476 9.5 10 9.5C8.75244 9.5 7.5171 9.74572 6.36451 10.2231C5.21191 10.7006 4.16464 11.4003 3.28249 12.2825C2.40033 13.1646 1.70056 14.2119 1.22314 15.3645C1.01594 15.8647 0.852378 16.3806 0.733607 16.9062C0.402069 18.3735 1.65891 19.5 3 19.5L10 19.5H17Z", fill: "#505050" }), /* @__PURE__ */ React12.createElement("circle", { cx: "10", cy: "6", r: "5.5", fill: "#505050" })),
549
+ profile: /* @__PURE__ */ React12.createElement("svg", { viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ React12.createElement("path", { d: "M17 19.5C18.3411 19.5 19.5979 18.3735 19.2664 16.9062C19.1476 16.3806 18.9841 15.8647 18.7769 15.3645C18.2994 14.2119 17.5997 13.1646 16.7175 12.2825C15.8354 11.4003 14.7881 10.7006 13.6355 10.2231C12.4829 9.74572 11.2476 9.5 10 9.5C8.75244 9.5 7.5171 9.74572 6.36451 10.2231C5.21191 10.7006 4.16464 11.4003 3.28249 12.2825C2.40033 13.1646 1.70056 14.2119 1.22314 15.3645C1.01594 15.8647 0.852378 16.3806 0.733607 16.9062C0.402069 18.3735 1.65891 19.5 3 19.5L10 19.5H17Z", fill: "#505050", stroke: "white" }), /* @__PURE__ */ React12.createElement("circle", { cx: "10", cy: "6", r: "5.5", fill: "#505050", stroke: "white" })),
550
550
  call: /* @__PURE__ */ React12.createElement("svg", { width: "18", height: "18", viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ React12.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M0 2.57143C0 1.15127 1.15127 0 2.57143 0H3.74711C4.48457 0 5.1274 0.501906 5.30627 1.21735L6.25409 5.00865C6.41092 5.63597 6.17652 6.29618 5.65922 6.68416L4.5504 7.51577C4.43526 7.60213 4.41023 7.72858 4.44257 7.81687C5.41587 10.4738 7.52615 12.5841 10.1831 13.5574C10.2714 13.5898 10.3979 13.5647 10.4842 13.4496L11.3158 12.3408C11.7038 11.8235 12.364 11.5891 12.9913 11.7459L16.7826 12.6937C17.4981 12.8726 18 13.5154 18 14.2529V15.4286C18 16.8487 16.8487 18 15.4286 18H13.5C6.04416 18 0 11.9558 0 4.5V2.57143Z", fill: "#505050" }))
551
551
  };
552
552
 
@@ -707,7 +707,9 @@ import { Layout, Menu } from "antd";
707
707
  var { Sider } = Layout;
708
708
  var Sidebar = (props) => {
709
709
  const [collapsed, setCollapsed] = useState5(false);
710
- const handleChange = (item) => {
710
+ const [selectedIndex, setSelectedIndex] = useState5(null);
711
+ const handleChange = (item, index) => {
712
+ setSelectedIndex(index);
711
713
  if (props.onChange) {
712
714
  props.onChange(item);
713
715
  }
@@ -715,10 +717,19 @@ var Sidebar = (props) => {
715
717
  function getItem(label, key, icon, children, item) {
716
718
  return {
717
719
  key,
718
- icon: icon ? /* @__PURE__ */ React15.createElement("span", { className: props.iconsClassName }, icon) : null,
720
+ icon: icon ? /* @__PURE__ */ React15.createElement(
721
+ "span",
722
+ {
723
+ className: props.iconsClassName,
724
+ style: selectedIndex === key ? {
725
+ filter: "brightness(0) saturate(100%) invert(22%) sepia(87%) saturate(7476%) hue-rotate(209deg) brightness(97%) contrast(107%)"
726
+ } : {}
727
+ },
728
+ icon
729
+ ) : null,
719
730
  children,
720
731
  label,
721
- onClick: children ? void 0 : () => handleChange(item)
732
+ onClick: children ? void 0 : () => handleChange(item, key.toString())
722
733
  // Only set onClick for leaf nodes
723
734
  };
724
735
  }
@@ -746,13 +757,7 @@ var Sidebar = (props) => {
746
757
  },
747
758
  /* @__PURE__ */ React15.createElement("div", { className: "demo-logo-vertical" }),
748
759
  /* @__PURE__ */ React15.createElement("img", { src: props.img, alt: "", className: props.imgClassName }),
749
- /* @__PURE__ */ React15.createElement(
750
- Menu,
751
- {
752
- mode: "inline",
753
- items
754
- }
755
- )
760
+ /* @__PURE__ */ React15.createElement(Menu, { mode: "inline", items, selectedKeys: [selectedIndex] })
756
761
  ));
757
762
  };
758
763
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@apexcura/ui-components",
3
- "version": "0.0.16-Beta49",
3
+ "version": "0.0.16-Beta50",
4
4
  "description": "Apex cura React components library",
5
5
  "keywords": [
6
6
  "apex cura",