@bikdotai/bik-component-library 0.11.0-bik-layout-beta → 0.12.0-bik-layout-beta

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.
@@ -4,8 +4,8 @@ export interface MainMenu {
4
4
  key: string | number;
5
5
  displayName: string;
6
6
  icon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
7
- activeStateIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
8
- hoverStateIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
7
+ activeIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
8
+ hoverIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
9
9
  isLastSticky?: boolean;
10
10
  is2ndLastSticky?: boolean;
11
11
  children?: Menu[];
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("../../assets/icons/Bik_logo.svg.js"),n=require("react"),t=require("../../constants/Theme.js"),s=require("./SidebarStyles.js"),a=require("./SimpleSidebar.js");const l=i=>{const{icon:n,isActive:s,activeStateIcon:a,hoverStateIcon:l,isHovered:r}=i,o=n,d=a,c=l;return e.jsx(e.Fragment,{children:s?e.jsx(d,{width:20,height:20}):r?e.jsx(c,{width:20,height:20,color:t.COLORS.surface.standard}):e.jsx(o,{width:20,height:20,color:t.COLORS.surface.standard})})};exports.BikSidebar=t=>{const{allMenuList:r,activeMainMenu:o,activeSubMenu:d,onClickingMainMenu:c,onClickingSubMenu:u}=t,[v,h]=n.useState(null!=o?o:{}),[m,j]=n.useState(),[S,k]=n.useState(null!=d?d:{});return e.jsxs(s.SideBarContainer,{children:[e.jsx("div",Object.assign({className:"bik-header-logo",onClick:()=>{},onKeyDown:()=>{},"aria-hidden":"true"},{children:e.jsx(i.default,{})})),e.jsx(s.SibeBarMenuItem,{children:null==r?void 0:r.map(((i,t)=>{var s,r,o;return e.jsxs(n.Fragment,{children:[e.jsx("div",Object.assign({className:"main--sidebar",onClick:()=>{var e;j(void 0),h(i),c(i),(null===(e=null==i?void 0:i.children)||void 0===e?void 0:e.length)?k(null==i?void 0:i.children[0]):k({})},onMouseOver:()=>{j(i)},onMouseEnter:()=>{j(i)},onMouseLeave:()=>{var e;!(null===(e=null==i?void 0:i.children)||void 0===e?void 0:e.length)&&j(void 0)},onFocus:()=>{console.log(";")},"aria-hidden":"true"},{children:e.jsxs("div",Object.assign({className:`sidebar-menu-item ${(null==v?void 0:v.key)==i.key?" main-menu-active-class":""} ${i.isLastSticky?"sticky-menu-int":""} ${i.is2ndLastSticky?"sticky-menu":""}\n ${i.key==(null==m?void 0:m.key)?"sidebar-menu-item-hover":""}`},{children:[e.jsx(l,{icon:i.icon,isActive:i.key==(null==v?void 0:v.key),activeStateIcon:null!==(s=i.activeStateIcon)&&void 0!==s?s:{},hoverStateIcon:null!==(r=i.hoverStateIcon)&&void 0!==r?r:{},isHovered:i.key==(null==m?void 0:m.key)}),e.jsx("div",Object.assign({className:"menu-item-container"},{children:e.jsx("p",Object.assign({className:"menu-item-text "+((null==i?void 0:i.key)===(null==v?void 0:v.key)?"active-menu-item-text":"")},{children:i.displayName}))}))]}),t)}),t),e.jsx(e.Fragment,{children:(null===(o=null==m?void 0:m.children)||void 0===o?void 0:o.length)&&e.jsx(a.SimpleSidebar,{menuList:null==m?void 0:m.children,activeMenu:S,onMouseLeaveOnMenu:()=>j(void 0),left:88,header:m.displayName,theme:"brand",onMenuClick:e=>{k(e),h(m),j(void 0),u(e)}})})]},t)}))})]})};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("../../assets/icons/Bik_logo.svg.js"),n=require("react"),s=require("../../constants/Theme.js"),t=require("./SidebarStyles.js"),l=require("./SimpleSidebar.js");const a=i=>{const{icon:n,isActive:t,activeStateIcon:l,hoverStateIcon:a,isHovered:r}=i,o=n,d=l,c=a;return e.jsx(e.Fragment,{children:t?e.jsx(d,{width:20,height:20}):r?e.jsx(c,{width:20,height:20,color:s.COLORS.surface.standard}):e.jsx(o,{width:20,height:20,color:s.COLORS.surface.standard})})};exports.BikSidebar=s=>{const{allMenuList:r,activeMainMenu:o,activeSubMenu:d,onClickingMainMenu:c,onClickingSubMenu:u}=s,[v,h]=n.useState(null!=o?o:{}),[m,j]=n.useState(),[k,S]=n.useState(null!=d?d:{});return e.jsxs(t.SideBarContainer,{children:[e.jsx("div",Object.assign({className:"bik-header-logo",onClick:()=>{},onKeyDown:()=>{},"aria-hidden":"true"},{children:e.jsx(i.default,{})})),e.jsx(t.SibeBarMenuItem,{children:null==r?void 0:r.map(((i,s)=>{var t,r,o;return e.jsxs(n.Fragment,{children:[e.jsx("div",Object.assign({className:"main--sidebar",onClick:()=>{var e;j(void 0),h(i),c(i),(null===(e=null==i?void 0:i.children)||void 0===e?void 0:e.length)?S(null==i?void 0:i.children[0]):S({})},onMouseOver:()=>{j(i)},onMouseEnter:()=>{j(i)},onMouseLeave:()=>{var e;!(null===(e=null==i?void 0:i.children)||void 0===e?void 0:e.length)&&j(void 0)},onFocus:()=>{console.log(";")},"aria-hidden":"true"},{children:e.jsxs("div",Object.assign({className:`sidebar-menu-item ${(null==v?void 0:v.key)==i.key?" main-menu-active-class":""} ${i.isLastSticky?"sticky-menu-int":""} ${i.is2ndLastSticky?"sticky-menu":""}\n ${i.key==(null==m?void 0:m.key)?"sidebar-menu-item-hover":""}`},{children:[e.jsx(a,{icon:i.icon,isActive:i.key==(null==v?void 0:v.key),activeStateIcon:null!==(t=i.activeIcon)&&void 0!==t?t:{},hoverStateIcon:null!==(r=i.hoverIcon)&&void 0!==r?r:{},isHovered:i.key==(null==m?void 0:m.key)}),e.jsx("div",Object.assign({className:"menu-item-container"},{children:e.jsx("p",Object.assign({className:"menu-item-text "+((null==i?void 0:i.key)===(null==v?void 0:v.key)?"active-menu-item-text":"")},{children:i.displayName}))}))]}),s)}),s),e.jsx(e.Fragment,{children:(null===(o=null==m?void 0:m.children)||void 0===o?void 0:o.length)&&e.jsx(l.SimpleSidebar,{menuList:null==m?void 0:m.children,activeMenu:k,onMouseLeaveOnMenu:()=>j(void 0),left:88,header:m.displayName,theme:"brand",onMenuClick:e=>{S(e),h(m),j(void 0),u(e)}})})]},s)}))})]})};
@@ -1,10 +1,9 @@
1
- /// <reference types="react" />
2
1
  export declare const Menus: ({
3
2
  displayName: string;
4
3
  key: number;
5
4
  icon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
6
- activeStateIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
7
- hoverStateIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
5
+ activeIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
6
+ hoverIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
8
7
  children: {
9
8
  displayName: string;
10
9
  key: number;
@@ -15,8 +14,8 @@ export declare const Menus: ({
15
14
  displayName: string;
16
15
  key: number;
17
16
  icon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
18
- activeStateIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
19
- hoverStateIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
17
+ activeIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
18
+ hoverIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
20
19
  children?: undefined;
21
20
  is2ndLastSticky?: undefined;
22
21
  isLastSticky?: undefined;
@@ -24,8 +23,8 @@ export declare const Menus: ({
24
23
  displayName: string;
25
24
  key: number;
26
25
  icon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
27
- activeStateIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
28
- hoverStateIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
26
+ activeIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
27
+ hoverIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
29
28
  is2ndLastSticky: boolean;
30
29
  children?: undefined;
31
30
  isLastSticky?: undefined;
@@ -33,8 +32,8 @@ export declare const Menus: ({
33
32
  displayName: string;
34
33
  key: number;
35
34
  icon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
36
- activeStateIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
37
- hoverStateIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
35
+ activeIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
36
+ hoverIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
38
37
  isLastSticky: boolean;
39
38
  children: {
40
39
  displayName: string;
@@ -4,8 +4,8 @@ export interface MainMenu {
4
4
  key: string | number;
5
5
  displayName: string;
6
6
  icon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
7
- activeStateIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
8
- hoverStateIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
7
+ activeIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
8
+ hoverIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
9
9
  isLastSticky?: boolean;
10
10
  is2ndLastSticky?: boolean;
11
11
  children?: Menu[];
@@ -1 +1 @@
1
- import{jsxs as e,jsx as i,Fragment as n}from"react/jsx-runtime";import o from"../../assets/icons/Bik_logo.svg.js";import{useState as t,Fragment as l}from"react";import{COLORS as a}from"../../constants/Theme.js";import{SideBarContainer as c,SibeBarMenuItem as r}from"./SidebarStyles.js";import{SimpleSidebar as d}from"./SimpleSidebar.js";const s=a=>{const{allMenuList:s,activeMainMenu:u,activeSubMenu:m,onClickingMainMenu:h,onClickingSubMenu:k}=a,[y,g]=t(null!=u?u:{}),[b,M]=t(),[S,p]=t(null!=m?m:{});return e(c,{children:[i("div",Object.assign({className:"bik-header-logo",onClick:()=>{},onKeyDown:()=>{},"aria-hidden":"true"},{children:i(o,{})})),i(r,{children:null==s?void 0:s.map(((o,t)=>{var a,c,r;return e(l,{children:[i("div",Object.assign({className:"main--sidebar",onClick:()=>{var e;M(void 0),g(o),h(o),(null===(e=null==o?void 0:o.children)||void 0===e?void 0:e.length)?p(null==o?void 0:o.children[0]):p({})},onMouseOver:()=>{M(o)},onMouseEnter:()=>{M(o)},onMouseLeave:()=>{var e;!(null===(e=null==o?void 0:o.children)||void 0===e?void 0:e.length)&&M(void 0)},onFocus:()=>{console.log(";")},"aria-hidden":"true"},{children:e("div",Object.assign({className:`sidebar-menu-item ${(null==y?void 0:y.key)==o.key?" main-menu-active-class":""} ${o.isLastSticky?"sticky-menu-int":""} ${o.is2ndLastSticky?"sticky-menu":""}\n ${o.key==(null==b?void 0:b.key)?"sidebar-menu-item-hover":""}`},{children:[i(v,{icon:o.icon,isActive:o.key==(null==y?void 0:y.key),activeStateIcon:null!==(a=o.activeStateIcon)&&void 0!==a?a:{},hoverStateIcon:null!==(c=o.hoverStateIcon)&&void 0!==c?c:{},isHovered:o.key==(null==b?void 0:b.key)}),i("div",Object.assign({className:"menu-item-container"},{children:i("p",Object.assign({className:"menu-item-text "+((null==o?void 0:o.key)===(null==y?void 0:y.key)?"active-menu-item-text":"")},{children:o.displayName}))}))]}),t)}),t),i(n,{children:(null===(r=null==b?void 0:b.children)||void 0===r?void 0:r.length)&&i(d,{menuList:null==b?void 0:b.children,activeMenu:S,onMouseLeaveOnMenu:()=>M(void 0),left:88,header:b.displayName,theme:"brand",onMenuClick:e=>{p(e),g(b),M(void 0),k(e)}})})]},t)}))})]})},v=e=>{const{icon:o,isActive:t,activeStateIcon:l,hoverStateIcon:c,isHovered:r}=e,d=o,s=c;return i(n,{children:t?i(l,{width:20,height:20}):i(r?s:d,{width:20,height:20,color:a.surface.standard})})};export{s as BikSidebar};
1
+ import{jsxs as e,jsx as i,Fragment as n}from"react/jsx-runtime";import o from"../../assets/icons/Bik_logo.svg.js";import{useState as l,Fragment as t}from"react";import{COLORS as a}from"../../constants/Theme.js";import{SideBarContainer as c,SibeBarMenuItem as r}from"./SidebarStyles.js";import{SimpleSidebar as d}from"./SimpleSidebar.js";const s=a=>{const{allMenuList:s,activeMainMenu:u,activeSubMenu:m,onClickingMainMenu:h,onClickingSubMenu:k}=a,[y,g]=l(null!=u?u:{}),[b,M]=l(),[p,S]=l(null!=m?m:{});return e(c,{children:[i("div",Object.assign({className:"bik-header-logo",onClick:()=>{},onKeyDown:()=>{},"aria-hidden":"true"},{children:i(o,{})})),i(r,{children:null==s?void 0:s.map(((o,l)=>{var a,c,r;return e(t,{children:[i("div",Object.assign({className:"main--sidebar",onClick:()=>{var e;M(void 0),g(o),h(o),(null===(e=null==o?void 0:o.children)||void 0===e?void 0:e.length)?S(null==o?void 0:o.children[0]):S({})},onMouseOver:()=>{M(o)},onMouseEnter:()=>{M(o)},onMouseLeave:()=>{var e;!(null===(e=null==o?void 0:o.children)||void 0===e?void 0:e.length)&&M(void 0)},onFocus:()=>{console.log(";")},"aria-hidden":"true"},{children:e("div",Object.assign({className:`sidebar-menu-item ${(null==y?void 0:y.key)==o.key?" main-menu-active-class":""} ${o.isLastSticky?"sticky-menu-int":""} ${o.is2ndLastSticky?"sticky-menu":""}\n ${o.key==(null==b?void 0:b.key)?"sidebar-menu-item-hover":""}`},{children:[i(v,{icon:o.icon,isActive:o.key==(null==y?void 0:y.key),activeStateIcon:null!==(a=o.activeIcon)&&void 0!==a?a:{},hoverStateIcon:null!==(c=o.hoverIcon)&&void 0!==c?c:{},isHovered:o.key==(null==b?void 0:b.key)}),i("div",Object.assign({className:"menu-item-container"},{children:i("p",Object.assign({className:"menu-item-text "+((null==o?void 0:o.key)===(null==y?void 0:y.key)?"active-menu-item-text":"")},{children:o.displayName}))}))]}),l)}),l),i(n,{children:(null===(r=null==b?void 0:b.children)||void 0===r?void 0:r.length)&&i(d,{menuList:null==b?void 0:b.children,activeMenu:p,onMouseLeaveOnMenu:()=>M(void 0),left:88,header:b.displayName,theme:"brand",onMenuClick:e=>{S(e),g(b),M(void 0),k(e)}})})]},l)}))})]})},v=e=>{const{icon:o,isActive:l,activeStateIcon:t,hoverStateIcon:c,isHovered:r}=e,d=o,s=c;return i(n,{children:l?i(t,{width:20,height:20}):i(r?s:d,{width:20,height:20,color:a.surface.standard})})};export{s as BikSidebar};
@@ -1,10 +1,9 @@
1
- /// <reference types="react" />
2
1
  export declare const Menus: ({
3
2
  displayName: string;
4
3
  key: number;
5
4
  icon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
6
- activeStateIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
7
- hoverStateIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
5
+ activeIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
6
+ hoverIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
8
7
  children: {
9
8
  displayName: string;
10
9
  key: number;
@@ -15,8 +14,8 @@ export declare const Menus: ({
15
14
  displayName: string;
16
15
  key: number;
17
16
  icon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
18
- activeStateIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
19
- hoverStateIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
17
+ activeIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
18
+ hoverIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
20
19
  children?: undefined;
21
20
  is2ndLastSticky?: undefined;
22
21
  isLastSticky?: undefined;
@@ -24,8 +23,8 @@ export declare const Menus: ({
24
23
  displayName: string;
25
24
  key: number;
26
25
  icon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
27
- activeStateIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
28
- hoverStateIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
26
+ activeIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
27
+ hoverIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
29
28
  is2ndLastSticky: boolean;
30
29
  children?: undefined;
31
30
  isLastSticky?: undefined;
@@ -33,8 +32,8 @@ export declare const Menus: ({
33
32
  displayName: string;
34
33
  key: number;
35
34
  icon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
36
- activeStateIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
37
- hoverStateIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
35
+ activeIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
36
+ hoverIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
38
37
  isLastSticky: boolean;
39
38
  children: {
40
39
  displayName: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bikdotai/bik-component-library",
3
- "version": "0.11.0-bik-layout-beta",
3
+ "version": "0.12.0-bik-layout-beta",
4
4
  "description": "Bik Component Library",
5
5
  "repository": {
6
6
  "type": "git",