@purr-react-tailwindcss/components.hamburger-menu 0.0.1 → 0.0.2

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.
@@ -1,4 +1,4 @@
1
1
  import { default as React } from 'react';
2
2
  import { IHamburgerMenuProps } from './_types';
3
3
 
4
- export declare const HamburgerMenu: React.MemoExoticComponent<({ isStandalone, active, classes, onClick, htmlAttributes, }: IHamburgerMenuProps) => React.JSX.Element>;
4
+ export declare const HamburgerMenu: React.MemoExoticComponent<({ isStandalone, active, onClick, htmlAttributes, firstBarHTMLAttributes, secondBarHTMLAttributes, thirdBarHTMLAttributes, }: IHamburgerMenuProps) => React.JSX.Element>;
package/dist/_types.d.ts CHANGED
@@ -1,23 +1,12 @@
1
- import { ClassValue } from 'clsx';
2
1
  import { ButtonHTMLAttributes } from 'react';
3
2
  import { IExtendable } from '@purr-core/utils.definitions';
4
3
 
5
- export interface IHamburgerMenuClasses {
6
- container?: ClassValue;
7
- firstBar?: ClassValue;
8
- secondBar?: ClassValue;
9
- thirdBar?: ClassValue;
10
- }
11
- export interface IHamburgerMenuBuiltClasses {
12
- container?: string;
13
- firstBar?: string;
14
- secondBar?: string;
15
- thirdBar?: string;
16
- }
17
4
  export interface IHamburgerMenuProps {
18
5
  onClick?: (active: boolean) => void;
19
6
  active?: boolean;
20
- classes?: IHamburgerMenuClasses;
21
- htmlAttributes?: ButtonHTMLAttributes<HTMLButtonElement> & IExtendable;
22
7
  isStandalone?: boolean;
8
+ htmlAttributes?: ButtonHTMLAttributes<HTMLButtonElement> & IExtendable;
9
+ firstBarHTMLAttributes?: ButtonHTMLAttributes<HTMLSpanElement> & IExtendable;
10
+ secondBarHTMLAttributes?: ButtonHTMLAttributes<HTMLSpanElement> & IExtendable;
11
+ thirdBarHTMLAttributes?: ButtonHTMLAttributes<HTMLSpanElement> & IExtendable;
23
12
  }
package/dist/index.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("clsx"),d=require("react"),h=require("@purr-core/hooks.sync-state-with-props"),u=d.memo(({isStandalone:o=!0,active:m=!1,classes:r,onClick:a,htmlAttributes:i})=>{const{currentValue:t,setCurrentValue:b}=h(m,o),g=()=>{b(!t),a==null||a(!t)};return e.jsxs("button",{className:n("bg-transparent","outline-none","border-none","hamburger-menu",t&&"hamburger-menu--active",r==null?void 0:r.container),onClick:g,...i,children:[e.jsx("span",{className:n("block","w-8","h-1","bg-white","my-1","transition-all","rounded",t&&"transform translate-y-2 -rotate-45","hamburger-menu__bar",r==null?void 0:r.firstBar)}),e.jsx("span",{className:n("block","w-8","h-1","bg-white","my-1","transition-all","rounded",t&&"opacity-0","hamburger-menu__bar",r==null?void 0:r.secondBar)}),e.jsx("span",{className:n("block","w-8","h-1","bg-white","my-1","transition-all","rounded",t&&"transform -translate-y-2 rotate-45","hamburger-menu__bar",r==null?void 0:r.thirdBar)})]})});u.displayName="HamburgerMenu";exports.HamburgerMenu=u;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),t=require("clsx"),g=require("react"),h=require("@purr-core/hooks.sync-state-with-props"),n=g.memo(({isStandalone:s=!0,active:u=!1,onClick:a,htmlAttributes:o,firstBarHTMLAttributes:m,secondBarHTMLAttributes:l,thirdBarHTMLAttributes:i})=>{const{currentValue:e,setCurrentValue:b}=h(u,s),c=()=>{b(!e),a==null||a(!e)};return r.jsxs("button",{className:t("bg-transparent","outline-none","border-none","hamburger-menu",e&&"hamburger-menu--active"),onClick:c,...o,children:[r.jsx("span",{className:t("block","w-8","h-1","bg-white","my-1","transition-all","rounded",e&&"translate-y-2 -rotate-45 transform","hamburger-menu__bar"),...m}),r.jsx("span",{className:t("block","w-8","h-1","bg-white","my-1","transition-all","rounded",e&&"opacity-0","hamburger-menu__bar"),...l}),r.jsx("span",{className:t("block","w-8","h-1","bg-white","my-1","transition-all","rounded",e&&"-translate-y-2 rotate-45 transform","hamburger-menu__bar"),...i})]})});n.displayName="HamburgerMenu";exports.HamburgerMenu=n;
package/dist/index.js CHANGED
@@ -1,36 +1,37 @@
1
- import { jsxs as h, jsx as o } from "react/jsx-runtime";
2
- import n from "clsx";
3
- import { memo as d } from "react";
1
+ import { jsxs as c, jsx as t } from "react/jsx-runtime";
2
+ import r from "clsx";
3
+ import { memo as h } from "react";
4
4
  import g from "@purr-core/hooks.sync-state-with-props";
5
- const p = d(
5
+ const p = h(
6
6
  ({
7
- isStandalone: a = !0,
8
- active: m = !1,
9
- classes: r,
10
- onClick: e,
11
- htmlAttributes: u
7
+ isStandalone: n = !0,
8
+ active: s = !1,
9
+ onClick: a,
10
+ htmlAttributes: m,
11
+ firstBarHTMLAttributes: o,
12
+ secondBarHTMLAttributes: u,
13
+ thirdBarHTMLAttributes: l
12
14
  }) => {
13
- const { currentValue: t, setCurrentValue: i } = g(m, a), b = () => {
14
- i(!t), e == null || e(!t);
15
+ const { currentValue: e, setCurrentValue: b } = g(s, n), i = () => {
16
+ b(!e), a == null || a(!e);
15
17
  };
16
- return /* @__PURE__ */ h(
18
+ return /* @__PURE__ */ c(
17
19
  "button",
18
20
  {
19
- className: n(
21
+ className: r(
20
22
  "bg-transparent",
21
23
  "outline-none",
22
24
  "border-none",
23
25
  "hamburger-menu",
24
- t && "hamburger-menu--active",
25
- r == null ? void 0 : r.container
26
+ e && "hamburger-menu--active"
26
27
  ),
27
- onClick: b,
28
- ...u,
28
+ onClick: i,
29
+ ...m,
29
30
  children: [
30
- /* @__PURE__ */ o(
31
+ /* @__PURE__ */ t(
31
32
  "span",
32
33
  {
33
- className: n(
34
+ className: r(
34
35
  "block",
35
36
  "w-8",
36
37
  "h-1",
@@ -38,16 +39,16 @@ const p = d(
38
39
  "my-1",
39
40
  "transition-all",
40
41
  "rounded",
41
- t && "transform translate-y-2 -rotate-45",
42
- "hamburger-menu__bar",
43
- r == null ? void 0 : r.firstBar
44
- )
42
+ e && "translate-y-2 -rotate-45 transform",
43
+ "hamburger-menu__bar"
44
+ ),
45
+ ...o
45
46
  }
46
47
  ),
47
- /* @__PURE__ */ o(
48
+ /* @__PURE__ */ t(
48
49
  "span",
49
50
  {
50
- className: n(
51
+ className: r(
51
52
  "block",
52
53
  "w-8",
53
54
  "h-1",
@@ -55,16 +56,16 @@ const p = d(
55
56
  "my-1",
56
57
  "transition-all",
57
58
  "rounded",
58
- t && "opacity-0",
59
- "hamburger-menu__bar",
60
- r == null ? void 0 : r.secondBar
61
- )
59
+ e && "opacity-0",
60
+ "hamburger-menu__bar"
61
+ ),
62
+ ...u
62
63
  }
63
64
  ),
64
- /* @__PURE__ */ o(
65
+ /* @__PURE__ */ t(
65
66
  "span",
66
67
  {
67
- className: n(
68
+ className: r(
68
69
  "block",
69
70
  "w-8",
70
71
  "h-1",
@@ -72,10 +73,10 @@ const p = d(
72
73
  "my-1",
73
74
  "transition-all",
74
75
  "rounded",
75
- t && "transform -translate-y-2 rotate-45",
76
- "hamburger-menu__bar",
77
- r == null ? void 0 : r.thirdBar
78
- )
76
+ e && "-translate-y-2 rotate-45 transform",
77
+ "hamburger-menu__bar"
78
+ ),
79
+ ...l
79
80
  }
80
81
  )
81
82
  ]
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@purr-react-tailwindcss/components.hamburger-menu",
3
- "version": "0.0.1",
3
+ "version": "0.0.2",
4
4
  "type": "module",
5
5
  "main": "dist/index.cjs",
6
6
  "module": "dist/index.js",
@@ -24,8 +24,8 @@
24
24
  "typescript": "*",
25
25
  "react": "*",
26
26
  "clsx": "*",
27
- "@purr-core/utils.definitions": "0.0.5",
28
- "@purr-core/hooks.sync-state-with-props": "0.0.3"
27
+ "@purr-core/utils.definitions": "0.0.6",
28
+ "@purr-core/hooks.sync-state-with-props": "0.0.4"
29
29
  },
30
30
  "author": "@DinhThienPhuc",
31
31
  "license": "ISC",