@modul/mbui 0.0.4-beta-pv-52894-c8540404 → 0.0.4-beta-pv-52894-c406e9b6
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.
- package/dist/Collapsible/AccountCollapsible.d.ts +1 -0
- package/dist/Collapsible/AccountCollapsible.js +5 -1
- package/dist/Collapsible/AccountCollapsible.js.map +1 -1
- package/dist/index.d.ts +3 -3
- package/dist/index.js +7 -1
- package/dist/index.js.map +1 -1
- package/package.json +1 -2
- package/src/@/config/index.ts +9 -56
- package/src/Collapsible/AccountCollapsible.tsx +21 -12
- package/src/assets/css/global.css +1 -0
- package/src/index.ts +18 -2
|
@@ -9,6 +9,7 @@ export declare type AccountCollapsibleHeaderProps = {
|
|
|
9
9
|
export declare type AccountCollapsibleContentItemProps = {
|
|
10
10
|
className?: string;
|
|
11
11
|
children: ReactNode;
|
|
12
|
+
asChild: boolean;
|
|
12
13
|
};
|
|
13
14
|
declare const AccountCollapsibleHeader: FC<AccountCollapsibleHeaderProps>;
|
|
14
15
|
declare const AccountCollapsibleContentItem: FC<AccountCollapsibleContentItemProps>;
|
|
@@ -6,6 +6,7 @@ const react_1 = (0, tslib_1.__importDefault)(require("react"));
|
|
|
6
6
|
const CollapsiblePrimitive = (0, tslib_1.__importStar)(require("@radix-ui/react-collapsible"));
|
|
7
7
|
const Icon_1 = require("../../src/Icon");
|
|
8
8
|
const utils_1 = require("../@/lib/utils");
|
|
9
|
+
const react_slot_1 = require("@radix-ui/react-slot");
|
|
9
10
|
const AccountCollapsible = CollapsiblePrimitive.Root;
|
|
10
11
|
exports.AccountCollapsible = AccountCollapsible;
|
|
11
12
|
const AccountCollapsibleTrigger = CollapsiblePrimitive.CollapsibleTrigger;
|
|
@@ -19,7 +20,10 @@ const AccountCollapsibleHeader = ({ label }) => {
|
|
|
19
20
|
react_1.default.createElement(Icon_1.DropdownSmallOld, null))));
|
|
20
21
|
};
|
|
21
22
|
exports.AccountCollapsibleHeader = AccountCollapsibleHeader;
|
|
22
|
-
const AccountCollapsibleContentItem = ({ children, className, ...props }) =>
|
|
23
|
+
const AccountCollapsibleContentItem = ({ children, asChild = true, className, ...props }) => {
|
|
24
|
+
const Comp = asChild ? react_slot_1.Slot : 'div';
|
|
25
|
+
return (react_1.default.createElement(Comp, { className: (0, utils_1.cn)('text-left w-full rounded-[4px] px-[12px] py-[16px] bg-btn-secondary hover:bg-btn-secondary-hover focus:bg-btn-secondary-focus active:bg-btn-secondary-active border-btn-secondary hover:border-btn-secondary-hover focus:border-btn-secondary-focus active:border-btn-secondary-active', className), ...props }, children));
|
|
26
|
+
};
|
|
23
27
|
exports.AccountCollapsibleContentItem = AccountCollapsibleContentItem;
|
|
24
28
|
AccountCollapsible.displayName = 'AccountCollaspible';
|
|
25
29
|
AccountCollapsibleTrigger.displayName = 'AccountCollaspibleTrigger';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AccountCollapsible.js","sourceRoot":"","sources":["../../src/Collapsible/AccountCollapsible.tsx"],"names":[],"mappings":";;;;AAAA,+DAA4C;AAC5C,+FAAmE;AACnE,yCAAiD;AACjD,0CAAmC;
|
|
1
|
+
{"version":3,"file":"AccountCollapsible.js","sourceRoot":"","sources":["../../src/Collapsible/AccountCollapsible.tsx"],"names":[],"mappings":";;;;AAAA,+DAA4C;AAC5C,+FAAmE;AACnE,yCAAiD;AACjD,0CAAmC;AACnC,qDAA2C;AAE3C,MAAM,kBAAkB,GAAG,oBAAoB,CAAC,IAAI,CAAA;AAoDnD,gDAAkB;AAlDnB,MAAM,yBAAyB,GAAG,oBAAoB,CAAC,kBAAkB,CAAA;AAoDxE,8DAAyB;AAlD1B,MAAM,yBAAyB,GAAG,oBAAoB,CAAC,kBAAkB,CAAA;AAmDxE,8DAAyB;AAxC1B,MAAM,wBAAwB,GAAsC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACjF,OAAO,CACN,uCAAK,SAAS,EAAC,0CAA0C;QACxD,uCAAK,SAAS,EAAC,uCAAuC,IAAE,KAAK,CAAO;QACpE,8BAAC,yBAAyB,IAAC,SAAS,EAAC,2DAA2D;YAC/F,8BAAC,uBAAgB,OAAG,CACO,CACvB,CACN,CAAA;AACF,CAAC,CAAA;AA6BA,4DAAwB;AA5BzB,MAAM,6BAA6B,GAA2C,CAAC,EAC9E,QAAQ,EACR,OAAO,GAAE,IAAI,EACb,SAAS,EACT,GAAG,KAAK,EACR,EAAE,EAAE;IACJ,MAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC,iBAAI,CAAC,CAAC,CAAC,KAAK,CAAA;IACnC,OAAO,CACN,8BAAC,IAAI,IACJ,SAAS,EAAE,IAAA,UAAE,EACZ,wRAAwR,EACxR,SAAS,CACT,KACG,KAAK,IAER,QAAQ,CACH,CACP,CAAA;AACF,CAAC,CAAA;AAaA,sEAA6B;AAX9B,kBAAkB,CAAC,WAAW,GAAG,oBAAoB,CAAA;AACrD,yBAAyB,CAAC,WAAW,GAAG,2BAA2B,CAAA;AACnE,wBAAwB,CAAC,WAAW,GAAG,0BAA0B,CAAA;AACjE,yBAAyB,CAAC,WAAW,GAAG,2BAA2B,CAAA;AACnE,6BAA6B,CAAC,WAAW,GAAG,+BAA+B,CAAA"}
|
package/dist/index.d.ts
CHANGED
|
@@ -6,10 +6,10 @@ import Logo from "./Logo";
|
|
|
6
6
|
import { InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator } from "./Input-OTP";
|
|
7
7
|
import { BottomNavigation } from "./BottomNavigation";
|
|
8
8
|
import * as Icon from "./Icon";
|
|
9
|
-
import { Collapsible } from "./Collapsible";
|
|
10
|
-
import { AccountCollapsible } from "./Collapsible";
|
|
9
|
+
import { Collapsible, CollapsibleTrigger, CollapsibleContent } from "./Collapsible";
|
|
10
|
+
import { AccountCollapsible, AccountCollapsibleHeader, AccountCollapsibleTrigger, AccountCollapsibleContent, AccountCollapsibleContentItem } from "./Collapsible";
|
|
11
11
|
import { Button } from "./Button";
|
|
12
12
|
import { Input } from "./Base/Input";
|
|
13
13
|
import { Audio } from "./Audio";
|
|
14
14
|
import { cn } from "./@/lib/utils";
|
|
15
|
-
export { Tooltip, Tabs, Slider, Popover, Logo, InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator, Collapsible, AccountCollapsible, Button, Input, Audio, cn, BottomNavigation, Icon, };
|
|
15
|
+
export { Tooltip, Tabs, Slider, Popover, Logo, InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator, Collapsible, CollapsibleTrigger, CollapsibleContent, AccountCollapsible, AccountCollapsibleHeader, AccountCollapsibleTrigger, AccountCollapsibleContent, AccountCollapsibleContentItem, Button, Input, Audio, cn, BottomNavigation, Icon, };
|
package/dist/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.Icon = exports.BottomNavigation = exports.cn = exports.Audio = exports.Input = exports.Button = exports.AccountCollapsible = exports.Collapsible = exports.InputOTPSeparator = exports.InputOTPSlot = exports.InputOTPGroup = exports.InputOTP = exports.Logo = exports.Popover = exports.Slider = exports.Tabs = exports.Tooltip = void 0;
|
|
3
|
+
exports.Icon = exports.BottomNavigation = exports.cn = exports.Audio = exports.Input = exports.Button = exports.AccountCollapsibleContentItem = exports.AccountCollapsibleContent = exports.AccountCollapsibleTrigger = exports.AccountCollapsibleHeader = exports.AccountCollapsible = exports.CollapsibleContent = exports.CollapsibleTrigger = exports.Collapsible = exports.InputOTPSeparator = exports.InputOTPSlot = exports.InputOTPGroup = exports.InputOTP = exports.Logo = exports.Popover = exports.Slider = exports.Tabs = exports.Tooltip = void 0;
|
|
4
4
|
const tslib_1 = require("tslib");
|
|
5
5
|
const Tooltip_1 = require("./Tooltip");
|
|
6
6
|
Object.defineProperty(exports, "Tooltip", { enumerable: true, get: function () { return Tooltip_1.Tooltip; } });
|
|
@@ -23,8 +23,14 @@ const Icon = (0, tslib_1.__importStar)(require("./Icon"));
|
|
|
23
23
|
exports.Icon = Icon;
|
|
24
24
|
const Collapsible_1 = require("./Collapsible");
|
|
25
25
|
Object.defineProperty(exports, "Collapsible", { enumerable: true, get: function () { return Collapsible_1.Collapsible; } });
|
|
26
|
+
Object.defineProperty(exports, "CollapsibleTrigger", { enumerable: true, get: function () { return Collapsible_1.CollapsibleTrigger; } });
|
|
27
|
+
Object.defineProperty(exports, "CollapsibleContent", { enumerable: true, get: function () { return Collapsible_1.CollapsibleContent; } });
|
|
26
28
|
const Collapsible_2 = require("./Collapsible");
|
|
27
29
|
Object.defineProperty(exports, "AccountCollapsible", { enumerable: true, get: function () { return Collapsible_2.AccountCollapsible; } });
|
|
30
|
+
Object.defineProperty(exports, "AccountCollapsibleHeader", { enumerable: true, get: function () { return Collapsible_2.AccountCollapsibleHeader; } });
|
|
31
|
+
Object.defineProperty(exports, "AccountCollapsibleTrigger", { enumerable: true, get: function () { return Collapsible_2.AccountCollapsibleTrigger; } });
|
|
32
|
+
Object.defineProperty(exports, "AccountCollapsibleContent", { enumerable: true, get: function () { return Collapsible_2.AccountCollapsibleContent; } });
|
|
33
|
+
Object.defineProperty(exports, "AccountCollapsibleContentItem", { enumerable: true, get: function () { return Collapsible_2.AccountCollapsibleContentItem; } });
|
|
28
34
|
const Button_1 = require("./Button");
|
|
29
35
|
Object.defineProperty(exports, "Button", { enumerable: true, get: function () { return Button_1.Button; } });
|
|
30
36
|
const Input_1 = require("./Base/Input");
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;AAAA,uCAAoC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;AAAA,uCAAoC;AA0BnC,wFA1BQ,iBAAO,OA0BR;AAzBR,iCAA8B;AA0B7B,qFA1BQ,WAAI,OA0BR;AAzBL,qCAAkC;AA0BjC,uFA1BQ,eAAM,OA0BR;AAzBP,uCAAoC;AA0BnC,wFA1BQ,iBAAO,OA0BR;AAzBR,+DAA0B;AA0BzB,eA1BM,cAAI,CA0BN;AAzBL,2CAAuF;AA0BtF,yFA1BQ,oBAAQ,OA0BR;AACR,8FA3BkB,yBAAa,OA2BlB;AACb,6FA5BiC,wBAAY,OA4BjC;AACZ,kGA7B+C,6BAAiB,OA6B/C;AA5BlB,yDAAsD;AAyCrD,iGAzCQ,mCAAgB,OAyCR;AAxCjB,0DAA+B;AAyC9B,oBAAI;AAxCL,+CAIuB;AAuBtB,4FA1BA,yBAAW,OA0BA;AACX,mGA1BA,gCAAkB,OA0BA;AAClB,mGA1BA,gCAAkB,OA0BA;AAxBnB,+CAMuB;AAmBtB,mGAxBA,gCAAkB,OAwBA;AAClB,yGAxBA,sCAAwB,OAwBA;AACxB,0GAxBA,uCAAyB,OAwBA;AACzB,0GAxBA,uCAAyB,OAwBA;AACzB,8GAxBA,2CAA6B,OAwBA;AAtB9B,qCAAkC;AAuBjC,uFAvBQ,eAAM,OAuBR;AAtBP,wCAAqC;AAuBpC,sFAvBQ,aAAK,OAuBR;AAtBN,mCAAgC;AAuB/B,sFAvBQ,aAAK,OAuBR;AAtBN,yCAAmC;AAuBlC,mFAvBQ,UAAE,OAuBR"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@modul/mbui",
|
|
3
|
-
"version": "0.0.4-beta-pv-52894-
|
|
3
|
+
"version": "0.0.4-beta-pv-52894-c406e9b6",
|
|
4
4
|
"packageManager": "yarn@3.5.1",
|
|
5
5
|
"main": "./dist/index.js",
|
|
6
6
|
"types": "./dist/index.d.ts",
|
|
@@ -21,7 +21,6 @@
|
|
|
21
21
|
"dist"
|
|
22
22
|
],
|
|
23
23
|
"dependencies": {
|
|
24
|
-
"@modul/mbui": "0.0.4-beta-pv-52894-64e40ad1",
|
|
25
24
|
"@radix-ui/react-accordion": "^1.2.0",
|
|
26
25
|
"@radix-ui/react-collapsible": "1.1.0",
|
|
27
26
|
"@radix-ui/react-dropdown-menu": "2.1.1",
|
package/src/@/config/index.ts
CHANGED
|
@@ -26,62 +26,15 @@ export default {
|
|
|
26
26
|
transparent: 'transparent',
|
|
27
27
|
current: 'currentColor',
|
|
28
28
|
},
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
// },
|
|
39
|
-
|
|
40
|
-
// border: {
|
|
41
|
-
// 'btn-primary-outline': '2px solid red'
|
|
42
|
-
// },
|
|
43
|
-
|
|
44
|
-
// colors: {
|
|
45
|
-
// border: 'hsl(var(--border))',
|
|
46
|
-
// input: 'hsl(var(--input))',
|
|
47
|
-
// ring: 'hsl(var(--ring))',
|
|
48
|
-
// background: 'hsl(var(--background))',
|
|
49
|
-
// foreground: 'hsl(var(--foreground))',
|
|
50
|
-
// primary: {
|
|
51
|
-
// DEFAULT: 'hsl(var(--primary))',
|
|
52
|
-
// foreground: 'hsl(var(--primary-foreground))',
|
|
53
|
-
// },
|
|
54
|
-
// secondary: {
|
|
55
|
-
// DEFAULT: 'hsl(var(--secondary))',
|
|
56
|
-
// foreground: 'hsl(var(--secondary-foreground))',
|
|
57
|
-
// },
|
|
58
|
-
// destructive: {
|
|
59
|
-
// DEFAULT: 'hsl(var(--destructive))',
|
|
60
|
-
// foreground: 'hsl(var(--destructive-foreground))',
|
|
61
|
-
// },
|
|
62
|
-
// muted: {
|
|
63
|
-
// DEFAULT: 'hsl(var(--muted))',
|
|
64
|
-
// foreground: 'hsl(var(--muted-foreground))',
|
|
65
|
-
// },
|
|
66
|
-
// accent: {
|
|
67
|
-
// DEFAULT: 'hsl(var(--accent))',
|
|
68
|
-
// foreground: 'hsl(var(--accent-foreground))',
|
|
69
|
-
// },
|
|
70
|
-
// popover: {
|
|
71
|
-
// DEFAULT: 'hsl(var(--popover))',
|
|
72
|
-
// foreground: 'hsl(var(--popover-foreground))',
|
|
73
|
-
// },
|
|
74
|
-
// card: {
|
|
75
|
-
// DEFAULT: 'hsl(var(--card))',
|
|
76
|
-
// foreground: 'hsl(var(--card-foreground))',
|
|
77
|
-
// },
|
|
78
|
-
// },
|
|
79
|
-
// borderRadius: {
|
|
80
|
-
// lg: `var(--radius)`,
|
|
81
|
-
// md: `calc(var(--radius) - 2px)`,
|
|
82
|
-
// sm: 'calc(var(--radius) - 4px)',
|
|
83
|
-
// },
|
|
84
|
-
|
|
29
|
+
textColor: {
|
|
30
|
+
...button.textColor
|
|
31
|
+
},
|
|
32
|
+
backgroundColor: {
|
|
33
|
+
primary: {
|
|
34
|
+
DEFAULT: 'var(--primary-bg)'
|
|
35
|
+
},
|
|
36
|
+
...button.backgroundColor
|
|
37
|
+
},
|
|
85
38
|
keyframes: {
|
|
86
39
|
'accordion-down': {
|
|
87
40
|
from: { height: '0' },
|
|
@@ -2,6 +2,7 @@ import React, { FC, ReactNode } from 'react'
|
|
|
2
2
|
import * as CollapsiblePrimitive from '@radix-ui/react-collapsible'
|
|
3
3
|
import { DropdownSmallOld } from '../../src/Icon'
|
|
4
4
|
import { cn } from '../@/lib/utils'
|
|
5
|
+
import { Slot } from '@radix-ui/react-slot'
|
|
5
6
|
|
|
6
7
|
const AccountCollapsible = CollapsiblePrimitive.Root
|
|
7
8
|
|
|
@@ -15,6 +16,7 @@ export type AccountCollapsibleHeaderProps = {
|
|
|
15
16
|
export type AccountCollapsibleContentItemProps = {
|
|
16
17
|
className?: string
|
|
17
18
|
children: ReactNode
|
|
19
|
+
asChild: boolean
|
|
18
20
|
}
|
|
19
21
|
|
|
20
22
|
const AccountCollapsibleHeader: FC<AccountCollapsibleHeaderProps> = ({ label }) => {
|
|
@@ -27,18 +29,25 @@ const AccountCollapsibleHeader: FC<AccountCollapsibleHeaderProps> = ({ label })
|
|
|
27
29
|
</div>
|
|
28
30
|
)
|
|
29
31
|
}
|
|
30
|
-
const AccountCollapsibleContentItem: FC<AccountCollapsibleContentItemProps> = ({
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
32
|
+
const AccountCollapsibleContentItem: FC<AccountCollapsibleContentItemProps> = ({
|
|
33
|
+
children,
|
|
34
|
+
asChild =true,
|
|
35
|
+
className,
|
|
36
|
+
...props
|
|
37
|
+
}) => {
|
|
38
|
+
const Comp = asChild ? Slot : 'div'
|
|
39
|
+
return (
|
|
40
|
+
<Comp
|
|
41
|
+
className={cn(
|
|
42
|
+
'text-left w-full rounded-[4px] px-[12px] py-[16px] bg-btn-secondary hover:bg-btn-secondary-hover focus:bg-btn-secondary-focus active:bg-btn-secondary-active border-btn-secondary hover:border-btn-secondary-hover focus:border-btn-secondary-focus active:border-btn-secondary-active',
|
|
43
|
+
className
|
|
44
|
+
)}
|
|
45
|
+
{...props}
|
|
46
|
+
>
|
|
47
|
+
{children}
|
|
48
|
+
</Comp>
|
|
49
|
+
)
|
|
50
|
+
}
|
|
42
51
|
|
|
43
52
|
AccountCollapsible.displayName = 'AccountCollaspible'
|
|
44
53
|
AccountCollapsibleTrigger.displayName = 'AccountCollaspibleTrigger'
|
package/src/index.ts
CHANGED
|
@@ -6,8 +6,18 @@ import Logo from "./Logo";
|
|
|
6
6
|
import { InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator } from "./Input-OTP";
|
|
7
7
|
import { BottomNavigation } from "./BottomNavigation";
|
|
8
8
|
import * as Icon from "./Icon";
|
|
9
|
-
import {
|
|
10
|
-
|
|
9
|
+
import {
|
|
10
|
+
Collapsible,
|
|
11
|
+
CollapsibleTrigger,
|
|
12
|
+
CollapsibleContent
|
|
13
|
+
} from "./Collapsible";
|
|
14
|
+
import {
|
|
15
|
+
AccountCollapsible,
|
|
16
|
+
AccountCollapsibleHeader,
|
|
17
|
+
AccountCollapsibleTrigger,
|
|
18
|
+
AccountCollapsibleContent,
|
|
19
|
+
AccountCollapsibleContentItem,
|
|
20
|
+
} from "./Collapsible";
|
|
11
21
|
import { Button } from "./Button";
|
|
12
22
|
import { Input } from "./Base/Input";
|
|
13
23
|
import { Audio } from "./Audio";
|
|
@@ -24,7 +34,13 @@ export {
|
|
|
24
34
|
InputOTPSlot,
|
|
25
35
|
InputOTPSeparator,
|
|
26
36
|
Collapsible,
|
|
37
|
+
CollapsibleTrigger,
|
|
38
|
+
CollapsibleContent,
|
|
27
39
|
AccountCollapsible,
|
|
40
|
+
AccountCollapsibleHeader,
|
|
41
|
+
AccountCollapsibleTrigger,
|
|
42
|
+
AccountCollapsibleContent,
|
|
43
|
+
AccountCollapsibleContentItem,
|
|
28
44
|
Button,
|
|
29
45
|
Input,
|
|
30
46
|
Audio,
|