@lotte-innovate/ui-component-test 0.1.17 → 0.1.18

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.
@@ -26,6 +26,7 @@ import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
26
26
  import { cva } from 'class-variance-authority';
27
27
  import { cn } from '../../../lib/utils/utils';
28
28
  import { appearanceStyle, primaryColorStyle, weightVariants } from '../../../lib/constants';
29
+ import { useAlertDialogContext } from './AlertDialogRoot';
29
30
  export var alertDialogActionVariants = cva("inline-flex items-center justify-center px-[15px] outline-none focus:shadow-[0_0_0_2px] font-normal", {
30
31
  variants: {
31
32
  radius: {
@@ -52,8 +53,9 @@ export var alertDialogActionVariants = cva("inline-flex items-center justify-cen
52
53
  },
53
54
  });
54
55
  export var AlertDialogAction = forwardRef(function (_a, ref) {
55
- var className = _a.className, children = _a.children, radius = _a.radius, weight = _a.weight, size = _a.size, _b = _a.color, color = _b === void 0 ? 'red' : _b, _c = _a.appearance, appearance = _c === void 0 ? 'solid' : _c, props = __rest(_a, ["className", "children", "radius", "weight", "size", "color", "appearance"]);
56
+ var className = _a.className, children = _a.children, weight = _a.weight, props = __rest(_a, ["className", "children", "weight"]);
57
+ var _b = useAlertDialogContext(), size = _b.size, radius = _b.radius, _c = _b.color, color = _c === void 0 ? 'red' : _c, _d = _b.appearance, appearance = _d === void 0 ? 'solid' : _d;
56
58
  var buttonClassName = cn(alertDialogActionVariants({ radius: radius, size: size, weight: weight, color: color }), appearanceStyle(appearance, color), className);
57
59
  return (_jsx(AlertDialogPrimitive.Action, __assign({ ref: ref, className: buttonClassName }, props, { children: children })));
58
60
  });
59
- AlertDialogAction.displayName = 'AlertDialogAction';
61
+ AlertDialogAction.displayName = 'AlertDialog.Action';
@@ -25,8 +25,9 @@ import { forwardRef } from 'react';
25
25
  import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
26
26
  import { cva } from 'class-variance-authority';
27
27
  import { cn } from '../../../lib/utils/utils';
28
- import { weightVariants } from '../../../lib/constants';
29
- export var alertDialogCancelVariants = cva("inline-flex justify-center items-center text-slate-11 bg-slate-3 outline-none border-none\n dark:text-slateDark-11 dark:bg-slateDark-3 dark:hover:bg-slateDarkA-4\n active:border-none hover:cursor-pointer hover:bg-slateA-4", {
28
+ import { appearanceStyle, weightVariants } from '../../../lib/constants';
29
+ import { useAlertDialogContext } from './AlertDialogRoot';
30
+ export var alertDialogCancelVariants = cva("inline-flex justify-center items-center outline-none", {
30
31
  variants: {
31
32
  radius: {
32
33
  none: 'rounded-none',
@@ -50,7 +51,10 @@ export var alertDialogCancelVariants = cva("inline-flex justify-center items-cen
50
51
  },
51
52
  });
52
53
  export var AlertDialogCancel = forwardRef(function (_a, ref) {
53
- var className = _a.className, children = _a.children, radius = _a.radius, size = _a.size, weight = _a.weight, _b = _a.appearance, appearance = _b === void 0 ? 'solid' : _b, props = __rest(_a, ["className", "children", "radius", "size", "weight", "appearance"]);
54
- return (_jsx(AlertDialogPrimitive.Cancel, __assign({ ref: ref }, props, { className: cn(alertDialogCancelVariants({ radius: radius, size: size, weight: weight }), className), children: children })));
54
+ var className = _a.className, children = _a.children, weight = _a.weight, props = __rest(_a, ["className", "children", "weight"]);
55
+ var _b = useAlertDialogContext(), size = _b.size, radius = _b.radius, _c = _b.appearance, appearance = _c === void 0 ? 'solid' : _c;
56
+ var disabledButtonStyle = "border-none text-slate-11 bg-slate-3 \n active:bg-slate-4 active:border-none hover:cursor-pointer hover:bg-slateA-4\n dark:text-slateDark-11 dark:bg-slateDark-3 dark:hover:bg-slateDarkA-4";
57
+ var buttonClassName = cn(alertDialogCancelVariants({ radius: radius, size: size, weight: weight }), appearanceStyle(appearance, 'slate'), disabledButtonStyle, className);
58
+ return (_jsx(AlertDialogPrimitive.Cancel, __assign({ ref: ref }, props, { className: buttonClassName, children: children })));
55
59
  });
56
- AlertDialogCancel.displayName = 'AlertDialogCancel';
60
+ AlertDialogCancel.displayName = 'AlertDialog.Cancel';
@@ -26,6 +26,7 @@ import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
26
26
  import { cva } from 'class-variance-authority';
27
27
  import { cn } from '../../../lib/utils/utils';
28
28
  import { radiusVariants, scalingVariants } from '../../../lib/constants';
29
+ import { useAlertDialogContext } from './AlertDialogRoot';
29
30
  export var alertDialogContentVariants = cva("fixed max-h-[85vh] top-[50%] left-[50%] focus:outline-none\n translate-x-[-50%] translate-y-[-50%] data-[state=open]:animate-contentShow bg-white dark:bg-slateDark-1 \n shadow-[hsl(206_22%_7%_/_35%)_0px_10px_38px_-10px,_hsl(206_22%_7%_/_20%)_0px_10px_20px_-15px]", {
30
31
  variants: {
31
32
  size: {
@@ -43,7 +44,8 @@ export var alertDialogContentVariants = cva("fixed max-h-[85vh] top-[50%] left-[
43
44
  },
44
45
  });
45
46
  export var AlertDialogContent = forwardRef(function (_a, ref) {
46
- var className = _a.className, children = _a.children, radius = _a.radius, size = _a.size, scaling = _a.scaling, props = __rest(_a, ["className", "children", "radius", "size", "scaling"]);
47
+ var className = _a.className, children = _a.children, scaling = _a.scaling, props = __rest(_a, ["className", "children", "scaling"]);
48
+ var _b = useAlertDialogContext(), radius = _b.radius, size = _b.size;
47
49
  return (_jsxs(AlertDialogPrimitive.Portal, { children: [_jsx(AlertDialogPrimitive.Overlay, { className: "fixed data-[state=open]:animate-overlayShow inset-0" }), _jsx(AlertDialogPrimitive.Content, __assign({ className: cn(alertDialogContentVariants({ radius: radius, size: size, scaling: scaling }), className), ref: ref }, props, { children: children }))] }));
48
50
  });
49
- AlertDialogContent.displayName = 'AlertDialogContent';
51
+ AlertDialogContent.displayName = 'AlertDialog.Content';
@@ -25,6 +25,7 @@ import { forwardRef } from 'react';
25
25
  import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
26
26
  import { cva } from 'class-variance-authority';
27
27
  import { cn } from '../../../lib/utils/utils';
28
+ import { useAlertDialogContext } from './AlertDialogRoot';
28
29
  export var alertDialogDescriptionVariants = cva("text-slate-12 dark:text-slateDark-12 font-normal", {
29
30
  variants: {
30
31
  size: {
@@ -39,7 +40,8 @@ export var alertDialogDescriptionVariants = cva("text-slate-12 dark:text-slateDa
39
40
  },
40
41
  });
41
42
  export var AlertDialogDescription = forwardRef(function (_a, ref) {
42
- var className = _a.className, children = _a.children, size = _a.size, contentText = _a.contentText, props = __rest(_a, ["className", "children", "size", "contentText"]);
43
+ var className = _a.className, children = _a.children, contentText = _a.contentText, props = __rest(_a, ["className", "children", "contentText"]);
44
+ var size = useAlertDialogContext().size;
43
45
  return (_jsx(AlertDialogPrimitive.Description, __assign({ className: cn(alertDialogDescriptionVariants({ size: size }), className), ref: ref }, props, { children: contentText !== null && contentText !== void 0 ? contentText : children })));
44
46
  });
45
- AlertDialogDescription.displayName = 'AlertDialogDescription';
47
+ AlertDialogDescription.displayName = 'AlertDialog.Description';
@@ -0,0 +1,16 @@
1
+ import React from 'react';
2
+ import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
3
+ import { VariantProps } from 'class-variance-authority';
4
+ import { alertDialogContentVariants } from './AlertDialogContent';
5
+ import { alertDialogTitleVariants } from './AlertDialogTitle';
6
+ import { alertDialogDescriptionVariants } from './AlertDialogDescription';
7
+ import { alertDialogActionVariants } from './AlertDialogAction';
8
+ import { IAppearance, IColor } from '../../../lib/types';
9
+ export interface AlertDialogProps extends VariantProps<typeof alertDialogContentVariants>, VariantProps<typeof alertDialogTitleVariants>, VariantProps<typeof alertDialogDescriptionVariants>, VariantProps<typeof alertDialogActionVariants> {
10
+ titleText?: string;
11
+ contentText?: string;
12
+ color?: IColor;
13
+ appearance?: IAppearance;
14
+ }
15
+ export declare const useAlertDialogContext: () => AlertDialogProps;
16
+ export declare const AlertDialogRoot: React.ForwardRefExoticComponent<AlertDialogPrimitive.AlertDialogProps & AlertDialogProps & React.RefAttributes<never>>;
@@ -0,0 +1,41 @@
1
+ var __assign = (this && this.__assign) || function () {
2
+ __assign = Object.assign || function(t) {
3
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
4
+ s = arguments[i];
5
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
+ t[p] = s[p];
7
+ }
8
+ return t;
9
+ };
10
+ return __assign.apply(this, arguments);
11
+ };
12
+ var __rest = (this && this.__rest) || function (s, e) {
13
+ var t = {};
14
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
15
+ t[p] = s[p];
16
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
17
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
18
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
19
+ t[p[i]] = s[p[i]];
20
+ }
21
+ return t;
22
+ };
23
+ import { jsx as _jsx } from "react/jsx-runtime";
24
+ import { forwardRef, createContext, useContext } from 'react';
25
+ import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
26
+ var AlertDialogContext = createContext({
27
+ size: 'medium',
28
+ scaling: '100%',
29
+ color: 'red',
30
+ radius: 'medium',
31
+ appearance: 'solid',
32
+ });
33
+ export var useAlertDialogContext = function () {
34
+ return useContext(AlertDialogContext);
35
+ };
36
+ export var AlertDialogRoot = forwardRef(function (_a, ref) {
37
+ var children = _a.children, radius = _a.radius, size = _a.size, scaling = _a.scaling, color = _a.color, props = __rest(_a, ["children", "radius", "size", "scaling", "color"]);
38
+ var contextValue = { radius: radius, size: size, scaling: scaling, color: color };
39
+ return (_jsx(AlertDialogContext.Provider, { value: contextValue, children: _jsx("div", { ref: ref, children: _jsx(AlertDialogPrimitive.Root, __assign({}, props, { children: children })) }) }));
40
+ });
41
+ AlertDialogRoot.displayName = 'AlertDialog.Root';
@@ -25,6 +25,7 @@ import { forwardRef } from 'react';
25
25
  import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
26
26
  import { cva } from 'class-variance-authority';
27
27
  import { cn } from '../../../lib/utils/utils';
28
+ import { useAlertDialogContext } from './AlertDialogRoot';
28
29
  export var alertDialogTitleVariants = cva("m-0 text-slate-12 dark:text-slateDark-12 font-bold", {
29
30
  variants: {
30
31
  size: {
@@ -39,7 +40,8 @@ export var alertDialogTitleVariants = cva("m-0 text-slate-12 dark:text-slateDark
39
40
  },
40
41
  });
41
42
  export var AlertDialogTitle = forwardRef(function (_a, ref) {
42
- var className = _a.className, children = _a.children, size = _a.size, titleText = _a.titleText, props = __rest(_a, ["className", "children", "size", "titleText"]);
43
+ var className = _a.className, children = _a.children, titleText = _a.titleText, props = __rest(_a, ["className", "children", "titleText"]);
44
+ var size = useAlertDialogContext().size;
43
45
  return (_jsx(AlertDialogPrimitive.Title, __assign({ className: cn(alertDialogTitleVariants({ size: size }), className), ref: ref }, props, { children: titleText !== null && titleText !== void 0 ? titleText : children })));
44
46
  });
45
- AlertDialogTitle.displayName = 'AlertDialogTitle';
47
+ AlertDialogTitle.displayName = 'AlertDialog.Title';
@@ -52,4 +52,4 @@ export var AlertDialogTrigger = forwardRef(function (_a, ref) {
52
52
  var buttonClassName = cn(buttonVariants({ radius: radius, scaling: scaling, size: size, weight: weight, color: color }), appearanceStyle(appearance, color), className);
53
53
  return (_jsx(AlertDialogPrimitive.Trigger, __assign({ asChild: true, ref: ref, className: buttonClassName }, props, { children: children })));
54
54
  });
55
- AlertDialogTrigger.displayName = 'AlertDialogTrigger';
55
+ AlertDialogTrigger.displayName = 'AlertDialog.Trigger';
@@ -1,20 +1,11 @@
1
- import React from 'react';
2
- import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
3
- import { VariantProps } from 'class-variance-authority';
4
- import { alertDialogContentVariants } from './AlertDialogContent';
5
- import { alertDialogTitleVariants } from './AlertDialogTitle';
6
- import { alertDialogDescriptionVariants } from './AlertDialogDescription';
7
- import { IColor } from '../../../lib/types';
8
- export * from './AlertDialogTrigger';
9
- export * from './AlertDialogContent';
10
- export * from './AlertDialogTitle';
11
- export * from './AlertDialogDescription';
12
- export * from './AlertDialogCancel';
13
- export * from './AlertDialogAction';
14
- export interface AlertDialogProps extends VariantProps<typeof alertDialogContentVariants>, VariantProps<typeof alertDialogTitleVariants>, VariantProps<typeof alertDialogDescriptionVariants> {
15
- titleText?: string;
16
- contentText?: string;
17
- color?: IColor;
18
- }
19
- export declare const AlertDialog: React.ForwardRefExoticComponent<AlertDialogPrimitive.AlertDialogProps & AlertDialogProps & React.RefAttributes<never>>;
1
+ /// <reference types="react" />
2
+ declare const AlertDialog: {
3
+ Root: import("react").ForwardRefExoticComponent<import("@radix-ui/react-alert-dialog").AlertDialogProps & import("./AlertDialogRoot").AlertDialogProps & import("react").RefAttributes<never>>;
4
+ Trigger: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-alert-dialog").AlertDialogTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("./AlertDialogTrigger").ButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
5
+ Content: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-alert-dialog").AlertDialogContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("./AlertDialogContent").AlertDialogContentProps & import("react").RefAttributes<HTMLDivElement>>;
6
+ Title: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-alert-dialog").AlertDialogTitleProps & import("react").RefAttributes<HTMLHeadingElement>, "ref"> & import("./AlertDialogTitle").AlertDialogTitleProps & import("react").RefAttributes<HTMLHeadingElement>>;
7
+ Description: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-alert-dialog").AlertDialogDescriptionProps & import("react").RefAttributes<HTMLParagraphElement>, "ref"> & import("./AlertDialogDescription").AlertDialogDescriptionProps & import("react").RefAttributes<HTMLParagraphElement>>;
8
+ Cancel: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-alert-dialog").AlertDialogCancelProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("./AlertDialogCancel").AlertDialogCancelProps & import("react").RefAttributes<HTMLButtonElement>>;
9
+ Action: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-alert-dialog").AlertDialogActionProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("./AlertDialogAction").AlertDialogActionProps & import("react").RefAttributes<HTMLButtonElement>>;
10
+ };
20
11
  export default AlertDialog;
@@ -1,37 +1,17 @@
1
- var __assign = (this && this.__assign) || function () {
2
- __assign = Object.assign || function(t) {
3
- for (var s, i = 1, n = arguments.length; i < n; i++) {
4
- s = arguments[i];
5
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
- t[p] = s[p];
7
- }
8
- return t;
9
- };
10
- return __assign.apply(this, arguments);
1
+ import { AlertDialogRoot as Root } from './AlertDialogRoot';
2
+ import { AlertDialogTrigger as Trigger } from './AlertDialogTrigger';
3
+ import { AlertDialogContent as Content } from './AlertDialogContent';
4
+ import { AlertDialogTitle as Title } from './AlertDialogTitle';
5
+ import { AlertDialogDescription as Description } from './AlertDialogDescription';
6
+ import { AlertDialogCancel as Cancel } from './AlertDialogCancel';
7
+ import { AlertDialogAction as Action } from './AlertDialogAction';
8
+ var AlertDialog = {
9
+ Root: Root,
10
+ Trigger: Trigger,
11
+ Content: Content,
12
+ Title: Title,
13
+ Description: Description,
14
+ Cancel: Cancel,
15
+ Action: Action
11
16
  };
12
- var __rest = (this && this.__rest) || function (s, e) {
13
- var t = {};
14
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
15
- t[p] = s[p];
16
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
17
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
18
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
19
- t[p[i]] = s[p[i]];
20
- }
21
- return t;
22
- };
23
- import { jsx as _jsx } from "react/jsx-runtime";
24
- import { forwardRef } from 'react';
25
- import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
26
- export * from './AlertDialogTrigger';
27
- export * from './AlertDialogContent';
28
- export * from './AlertDialogTitle';
29
- export * from './AlertDialogDescription';
30
- export * from './AlertDialogCancel';
31
- export * from './AlertDialogAction';
32
- export var AlertDialog = forwardRef(function (_a, ref) {
33
- var children = _a.children, props = __rest(_a, ["children"]);
34
- return (_jsx("div", { ref: ref, children: _jsx(AlertDialogPrimitive.Root, __assign({}, props, { children: children })) }));
35
- });
36
- AlertDialog.displayName = 'AlertDialog';
37
17
  export default AlertDialog;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@lotte-innovate/ui-component-test",
3
3
  "description": "Lotte UI Library",
4
- "version": "0.1.17",
4
+ "version": "0.1.18",
5
5
  "private": false,
6
6
  "type": "module",
7
7
  "files": [