react-restyle-components 0.2.99 → 0.3.1

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 (8) hide show
  1. package/lib/src/core-components/src/atoms/collapsible/collapsible.component.d.ts +3 -1
  2. package/lib/src/core-components/src/atoms/collapsible/collapsible.component.d.ts.map +1 -1
  3. package/lib/src/core-components/src/atoms/collapsible/collapsible.component.js +8 -2
  4. package/lib/src/core-components/src/molecules/modal/modal.component.d.ts +3 -1
  5. package/lib/src/core-components/src/molecules/modal/modal.component.d.ts.map +1 -1
  6. package/lib/src/core-components/src/molecules/modal/modal.component.js +2 -2
  7. package/lib/src/core-components/src/molecules/modal-confirm/modal-confirm.component.d.ts.map +1 -1
  8. package/package.json +1 -1
package/lib/src/core-components/src/atoms/collapsible/collapsible.component.d.ts CHANGED
@@ -3,8 +3,10 @@ interface CollapsibleProps {
3
3
  label: string;
4
4
  labelClassName?: string;
5
5
  className?: string;
6
+ onExpand?: (label: string) => void;
7
+ onCollapse?: (label: string) => void;
6
8
  children: React.ReactNode;
7
9
  }
8
- export declare const Collapsible: ({ label, labelClassName, className, children, }: CollapsibleProps) => import("react/jsx-runtime").JSX.Element;
10
+ export declare const Collapsible: ({ label, labelClassName, className, onExpand, onCollapse, children, }: CollapsibleProps) => import("react/jsx-runtime").JSX.Element;
9
11
  export {};
10
12
  //# sourceMappingURL=collapsible.component.d.ts.map
package/lib/src/core-components/src/atoms/collapsible/collapsible.component.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"collapsible.component.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/atoms/collapsible/collapsible.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAItC,UAAU,gBAAgB;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AACD,eAAO,MAAM,WAAW,oDAKrB,gBAAgB,4CA6ClB,CAAC"}
1
+ {"version":3,"file":"collapsible.component.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/atoms/collapsible/collapsible.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAItC,UAAU,gBAAgB;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AACD,eAAO,MAAM,WAAW,0EAOrB,gBAAgB,4CAkDlB,CAAC"}
package/lib/src/core-components/src/atoms/collapsible/collapsible.component.js CHANGED
@@ -2,10 +2,16 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { useState } from 'react';
3
3
  import s from '../../tc.module.css';
4
4
  import { cn } from '../../utils';
5
- export const Collapsible = ({ label, labelClassName, className, children, }) => {
5
+ export const Collapsible = ({ label, labelClassName, className, onExpand, onCollapse, children, }) => {
6
6
  const [open, setOPen] = useState(false);
7
7
  const toggle = () => {
8
+ if (open) {
9
+ onCollapse?.(label);
10
+ }
11
+ else {
12
+ onExpand?.(label);
13
+ }
8
14
  setOPen(!open);
9
15
  };
10
- return (_jsxs("div", { className: cn(s.flx, s['flx-col']), children: [_jsx("button", { className: cn(s.flx, s['items-center'], s['w-full'], s['p-1'], s['my-1'], s['text-base'], s['text-left'], s['bg-gray-200'], s['border-0'], s['transition'], s['focus:outline-none'], s['rounded-sm'], s['rounded-b-none'], labelClassName), type: "button", onClick: toggle, children: label?.toUpperCase() }), open && (_jsx("div", { className: cn(s['p-2'], s['bg-gray-200'], s['-my-2'], s['mb-1'], className), children: children }))] }));
16
+ return (_jsxs("div", { className: cn(s.flx, s['flx-col'], s['w-full']), children: [_jsx("button", { className: cn(s.flx, s['items-center'], s['w-full'], s['p-1'], s['my-1'], s['text-base'], s['text-left'], s['bg-gray-200'], s['border-0'], s['transition'], s['focus:outline-none'], s['rounded-sm'], s['rounded-b-none'], labelClassName), type: "button", onClick: toggle, children: label?.toUpperCase() }), open && (_jsx("div", { className: cn(s['p-2'], s['bg-gray-200'], s['-my-2'], s['mb-1'], className), children: children }))] }));
11
17
  };
package/lib/src/core-components/src/molecules/modal/modal.component.d.ts CHANGED
@@ -2,9 +2,11 @@ import React from 'react';
2
2
  export interface ModalProps {
3
3
  visible: boolean;
4
4
  title: string;
5
+ className?: string;
6
+ style?: React.CSSProperties;
5
7
  onClose?: () => void;
6
8
  isAutoClose?: boolean;
7
9
  children?: React.ReactNode;
8
10
  }
9
- export declare const Modal: ({ visible, title, onClose, isAutoClose, children, }: ModalProps) => import("react/jsx-runtime").JSX.Element;
11
+ export declare const Modal: ({ visible, title, className, style, onClose, isAutoClose, children, }: ModalProps) => import("react/jsx-runtime").JSX.Element;
10
12
  //# sourceMappingURL=modal.component.d.ts.map
package/lib/src/core-components/src/molecules/modal/modal.component.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"modal.component.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/molecules/modal/modal.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAIvC,MAAM,WAAW,UAAU;IACzB,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,KAAK,wDAMf,UAAU,4CAyHZ,CAAC"}
1
+ {"version":3,"file":"modal.component.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/molecules/modal/modal.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAIvC,MAAM,WAAW,UAAU;IACzB,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,KAAK,0EAQf,UAAU,4CA2HZ,CAAC"}
package/lib/src/core-components/src/molecules/modal/modal.component.js CHANGED
@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
2
2
  import React, { useEffect } from 'react';
3
3
  import s from '../../tc.module.css';
4
4
  import { cn } from '../../utils';
5
- export const Modal = ({ visible, title = '', onClose, isAutoClose = false, children, }) => {
5
+ export const Modal = ({ visible, title = '', className = '', style = {}, onClose, isAutoClose = false, children, }) => {
6
6
  const [showModal, setShowModal] = React.useState(visible);
7
7
  useEffect(() => {
8
8
  setShowModal(visible);
@@ -12,7 +12,7 @@ export const Modal = ({ visible, title = '', onClose, isAutoClose = false, child
12
12
  }, 1000);
13
13
  }
14
14
  }, [visible]);
15
- return (_jsx(_Fragment, { children: showModal && (_jsxs(_Fragment, { children: [_jsx("div", { className: cn(s['flex'], s['justify-center'], s['items-center'], s['overflow-x-hidden'], s['overflow-y-auto'], s['fixed'], s['inset-0'], s['z-50'], s['outline-none'], s['focus:outline-none']), children: _jsx("div", { className: cn(s['relative'], s['w-auto'], s['my-5'], s['mx-auto'], s['max-w-7xl']), children: _jsxs("div", { className: cn(s['border-0'], s['rounded-lg'], s['shadow-lg'], s['relative'], s['flex'], s['flex-col'], s['bg-white'], s['outline-none'], s['focus:outline-none']), children: [_jsxs("div", { className: cn(s['flex'], s['items-start'], s['justify-between'], s['p-2'], s['border-b'], s['border-solid'], s['border-gray-300'], s['rounded-t']), children: [_jsx("h3", { className: cn(s['text-xl'], s['font-semibold']), children: title }), _jsx("button", { className: cn(s['p-1'], s['border-0'], s['text-black'], s['opacity-1'], s['ml-6'], s['float-right'], s['text-3xl'], s['leading-none'], s['font-semibold'], s['outline-none'], s['focus:outline-none']), onClick: () => {
15
+ return (_jsx(_Fragment, { children: showModal && (_jsxs(_Fragment, { children: [_jsx("div", { className: cn(s['flex'], s['justify-center'], s['items-center'], s['overflow-x-hidden'], s['overflow-y-auto'], s['fixed'], s['inset-0'], s['z-50'], s['outline-none'], s['focus:outline-none'], className), style: style, children: _jsx("div", { className: cn(s['relative'], s['w-auto'], s['my-5'], s['mx-auto'], s['max-w-7xl']), children: _jsxs("div", { className: cn(s['border-0'], s['rounded-lg'], s['shadow-lg'], s['relative'], s['flex'], s['flex-col'], s['bg-white'], s['outline-none'], s['focus:outline-none']), children: [_jsxs("div", { className: cn(s['flex'], s['items-start'], s['justify-between'], s['p-2'], s['border-b'], s['border-solid'], s['border-gray-300'], s['rounded-t']), children: [_jsx("h3", { className: cn(s['text-xl'], s['font-semibold']), children: title }), _jsx("button", { className: cn(s['p-1'], s['border-0'], s['text-black'], s['opacity-1'], s['ml-6'], s['float-right'], s['text-3xl'], s['leading-none'], s['font-semibold'], s['outline-none'], s['focus:outline-none']), onClick: () => {
16
16
  onClose && onClose();
17
17
  setShowModal(false);
18
18
  }, children: _jsx("span", { className: cn(s['text-black'], s['h-6'], s['w-6'], s['text-2xl'], s['block'], s['outline-none'], s['focus:outline-none']), children: "\u00D7" }) })] }), _jsx("div", { className: cn(s['flex'], s['p-2'], s['w-auto'], s['h-auto']), children: children })] }) }) }), _jsx("div", { className: cn(s['opacity-25'], s['fixed'], s['inset-0'], s['z-40'], s['bg-black']) })] })) }));
package/lib/src/core-components/src/molecules/modal-confirm/modal-confirm.component.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"modal-confirm.component.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/molecules/modal-confirm/modal-confirm.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoC,MAAM,OAAO,CAAC;AAMzD,MAAM,WAAW,iBAAiB;IAChC,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;IAClC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,eAAO,MAAM,YAAY,8FAUtB,iBAAiB,4CA0LnB,CAAC"}
1
+ {"version":3,"file":"modal-confirm.component.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/molecules/modal-confirm/modal-confirm.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAMjD,MAAM,WAAW,iBAAiB;IAChC,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;IAClC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,eAAO,MAAM,YAAY,8FAUtB,iBAAiB,4CA0LnB,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-restyle-components",
3
- "version": "0.2.99",
3
+ "version": "0.3.1",
4
4
  "private": false,
5
5
  "description": "Easy use restyle components",
6
6
  "author": {