@particle-network/ui-react 0.0.1

package/dist/components/UXDropdown/dropdown-item.d.ts

@@ -0,0 +1,3 @@
+import { DropdownItem } from '@heroui/dropdown';
+declare const UXDropdownItem: typeof DropdownItem;
+export default UXDropdownItem;

package/dist/components/UXDropdown/dropdown-item.js

@@ -0,0 +1,306 @@
+import { DropdownItem } from "@heroui/dropdown";
+import { extendVariants } from "@heroui/system-rsc";
+const classes = {
+    variants: {
+        variant: {
+            solid: {
+                base: ''
+            },
+            bordered: {
+                base: 'border-medium border-transparent bg-transparent'
+            },
+            light: {
+                base: 'bg-transparent'
+            },
+            faded: {
+                base: 'border-small border-transparent hover:border-default data-[hover=true]:bg-default-100'
+            },
+            flat: {
+                base: '!outline-none min-h-8 px-md rounded-small text-foreground-300 !outline-none data-[selected=true]:text-foreground gap-1',
+                title: 'text-tiny font-medium',
+                selectedIcon: '[&>svg>polyline]:stroke-2'
+            },
+            shadow: {
+                base: 'data-[hover=true]:shadow-lg'
+            }
+        },
+        color: {
+            default: {},
+            primary: {},
+            secondary: {},
+            success: {},
+            warning: {},
+            danger: {}
+        },
+        isDisabled: {
+            true: {
+                base: 'opacity-disabled pointer-events-none'
+            }
+        },
+        disableAnimation: {
+            true: {},
+            false: {}
+        }
+    },
+    defaultVariants: {
+        variant: 'flat',
+        color: 'default'
+    },
+    compoundVariants: [
+        {
+            variant: 'solid',
+            color: 'default',
+            class: {
+                base: 'data-[hover=true]:bg-default data-[hover=true]:text-default-foreground'
+            }
+        },
+        {
+            variant: 'solid',
+            color: 'primary',
+            class: {
+                base: 'data-[hover=true]:bg-primary data-[hover=true]:text-primary-foreground'
+            }
+        },
+        {
+            variant: 'solid',
+            color: 'secondary',
+            class: {
+                base: 'data-[hover=true]:bg-secondary data-[hover=true]:text-secondary-foreground'
+            }
+        },
+        {
+            variant: 'solid',
+            color: 'success',
+            class: {
+                base: 'data-[hover=true]:bg-success data-[hover=true]:text-success-foreground'
+            }
+        },
+        {
+            variant: 'solid',
+            color: 'warning',
+            class: {
+                base: 'data-[hover=true]:bg-warning data-[hover=true]:text-warning-foreground'
+            }
+        },
+        {
+            variant: 'solid',
+            color: 'danger',
+            class: {
+                base: 'data-[hover=true]:bg-danger data-[hover=true]:text-danger-foreground'
+            }
+        },
+        {
+            variant: 'shadow',
+            color: 'default',
+            class: {
+                base: 'data-[hover=true]:shadow-default/50 data-[hover=true]:bg-default data-[hover=true]:text-default-foreground'
+            }
+        },
+        {
+            variant: 'shadow',
+            color: 'primary',
+            class: {
+                base: 'data-[hover=true]:shadow-primary/30 data-[hover=true]:bg-primary data-[hover=true]:text-primary-foreground'
+            }
+        },
+        {
+            variant: 'shadow',
+            color: 'secondary',
+            class: {
+                base: 'data-[hover=true]:shadow-secondary/30 data-[hover=true]:bg-secondary data-[hover=true]:text-secondary-foreground'
+            }
+        },
+        {
+            variant: 'shadow',
+            color: 'success',
+            class: {
+                base: 'data-[hover=true]:shadow-success/30 data-[hover=true]:bg-success data-[hover=true]:text-success-foreground'
+            }
+        },
+        {
+            variant: 'shadow',
+            color: 'warning',
+            class: {
+                base: 'data-[hover=true]:shadow-warning/30 data-[hover=true]:bg-warning data-[hover=true]:text-warning-foreground'
+            }
+        },
+        {
+            variant: 'shadow',
+            color: 'danger',
+            class: {
+                base: 'data-[hover=true]:shadow-danger/30 data-[hover=true]:bg-danger data-[hover=true]:text-danger-foreground'
+            }
+        },
+        {
+            variant: 'bordered',
+            color: 'default',
+            class: {
+                base: 'data-[hover=true]:border-default'
+            }
+        },
+        {
+            variant: 'bordered',
+            color: 'primary',
+            class: {
+                base: 'data-[hover=true]:border-primary data-[hover=true]:text-primary'
+            }
+        },
+        {
+            variant: 'bordered',
+            color: 'secondary',
+            class: {
+                base: 'data-[hover=true]:border-secondary data-[hover=true]:text-secondary'
+            }
+        },
+        {
+            variant: 'bordered',
+            color: 'success',
+            class: {
+                base: 'data-[hover=true]:border-success data-[hover=true]:text-success'
+            }
+        },
+        {
+            variant: 'bordered',
+            color: 'warning',
+            class: {
+                base: 'data-[hover=true]:border-warning data-[hover=true]:text-warning'
+            }
+        },
+        {
+            variant: 'bordered',
+            color: 'danger',
+            class: {
+                base: 'data-[hover=true]:border-danger data-[hover=true]:text-danger'
+            }
+        },
+        {
+            variant: 'flat',
+            color: 'default',
+            class: {
+                base: 'data-[hover=true]:bg-background-200 data-[hover=true]:text-default-foreground'
+            }
+        },
+        {
+            variant: 'flat',
+            color: 'primary',
+            class: {
+                base: 'data-[hover=true]:bg-primary/20 data-[hover=true]:text-primary'
+            }
+        },
+        {
+            variant: 'flat',
+            color: 'secondary',
+            class: {
+                base: 'data-[hover=true]:bg-secondary/20 data-[hover=true]:text-secondary'
+            }
+        },
+        {
+            variant: 'flat',
+            color: 'success',
+            class: {
+                base: 'data-[hover=true]:bg-success/20 data-[hover=true]:text-success '
+            }
+        },
+        {
+            variant: 'flat',
+            color: 'warning',
+            class: {
+                base: 'data-[hover=true]:bg-warning/20 data-[hover=true]:text-warning'
+            }
+        },
+        {
+            variant: 'flat',
+            color: 'danger',
+            class: {
+                base: 'data-[hover=true]:bg-danger/20 data-[hover=true]:text-danger'
+            }
+        },
+        {
+            variant: 'faded',
+            color: 'default',
+            class: {
+                base: 'data-[hover=true]:text-default-foreground'
+            }
+        },
+        {
+            variant: 'faded',
+            color: 'primary',
+            class: {
+                base: 'data-[hover=true]:text-primary'
+            }
+        },
+        {
+            variant: 'faded',
+            color: 'secondary',
+            class: {
+                base: 'data-[hover=true]:text-secondary'
+            }
+        },
+        {
+            variant: 'faded',
+            color: 'success',
+            class: {
+                base: 'data-[hover=true]:text-success'
+            }
+        },
+        {
+            variant: 'faded',
+            color: 'warning',
+            class: {
+                base: 'data-[hover=true]:text-warning'
+            }
+        },
+        {
+            variant: 'faded',
+            color: 'danger',
+            class: {
+                base: 'data-[hover=true]:text-danger'
+            }
+        },
+        {
+            variant: 'light',
+            color: 'default',
+            class: {
+                base: 'data-[hover=true]:text-default-500'
+            }
+        },
+        {
+            variant: 'light',
+            color: 'primary',
+            class: {
+                base: 'data-[hover=true]:text-primary'
+            }
+        },
+        {
+            variant: 'light',
+            color: 'secondary',
+            class: {
+                base: 'data-[hover=true]:text-secondary'
+            }
+        },
+        {
+            variant: 'light',
+            color: 'success',
+            class: {
+                base: 'data-[hover=true]:text-success'
+            }
+        },
+        {
+            variant: 'light',
+            color: 'warning',
+            class: {
+                base: 'data-[hover=true]:text-warning'
+            }
+        },
+        {
+            variant: 'light',
+            color: 'danger',
+            class: {
+                base: 'data-[hover=true]:text-danger'
+            }
+        }
+    ]
+};
+const UXDropdownItem = extendVariants(DropdownItem, classes);
+const dropdown_item = UXDropdownItem;
+export { dropdown_item as default };

package/dist/components/UXDropdown/dropdown-menu.d.ts

@@ -0,0 +1,3 @@
+import { type DropdownMenuProps } from '@heroui/dropdown';
+declare const UXDropdownMenu: import("react").ForwardRefExoticComponent<Omit<DropdownMenuProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export default UXDropdownMenu;

package/dist/components/UXDropdown/dropdown-menu.js

@@ -0,0 +1,25 @@
+import { jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { DropdownMenu } from "@heroui/dropdown";
+const UXDropdownMenu = /*#__PURE__*/ forwardRef((props, ref)=>{
+    const { classNames = {}, ...restProps } = props;
+    const { base, list, ...restClassNames } = classNames;
+    return /*#__PURE__*/ jsx(DropdownMenu, {
+        ref: ref,
+        classNames: {
+            base: [
+                'p-0 gap-0 max-h-[400px] overflow-y-auto no-scrollbar',
+                base
+            ],
+            list: [
+                'gap-0 [&_[data-slot="heading"]]:text-small [&_[data-slot="heading"]]:font-medium',
+                list
+            ],
+            ...restClassNames
+        },
+        ...restProps
+    });
+});
+UXDropdownMenu.displayName = 'UX.DropdownMenu';
+const dropdown_menu = UXDropdownMenu;
+export { dropdown_menu as default };

package/dist/components/UXDropdown/dropdown-section.d.ts

@@ -0,0 +1 @@
+export { DropdownSection as UXDropdownSection, type DropdownSectionProps as UXDropdownSectionProps, } from '@heroui/dropdown';

package/dist/components/UXDropdown/dropdown-section.js

@@ -0,0 +1,2 @@
+import { DropdownSection } from "@heroui/dropdown";
+export { DropdownSection as UXDropdownSection };

package/dist/components/UXDropdown/dropdown.d.ts

@@ -0,0 +1,4 @@
+import { type DropdownProps } from '@heroui/dropdown';
+export type UXDropdownProps = DropdownProps;
+declare const UXDropdown: import("react").ForwardRefExoticComponent<Omit<DropdownProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export default UXDropdown;

package/dist/components/UXDropdown/dropdown.js

@@ -0,0 +1,21 @@
+import { jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { Dropdown } from "@heroui/dropdown";
+const UXDropdown = /*#__PURE__*/ forwardRef((props, ref)=>{
+    const { classNames = {}, ...restProps } = props;
+    const { content, ...restClassNames } = classNames;
+    return /*#__PURE__*/ jsx(Dropdown, {
+        ref: ref,
+        classNames: {
+            content: [
+                'text-tiny p-2.5 text-foreground-300 rounded-medium  no-scrollbar',
+                content
+            ],
+            ...restClassNames
+        },
+        ...restProps
+    });
+});
+UXDropdown.displayName = 'UX.Dropdown';
+const dropdown = UXDropdown;
+export { dropdown as default };

package/dist/components/UXDropdown/index.d.ts

@@ -0,0 +1,6 @@
+export type { UXDropdownProps } from './dropdown';
+export { default as UXDropdown } from './dropdown';
+export { default as UXDropdownItem } from './dropdown-item';
+export { default as UXDropdownMenu } from './dropdown-menu';
+export * from './dropdown-section';
+export { DropdownTrigger as UXDropdownTrigger } from '@heroui/dropdown';

package/dist/components/UXDropdown/index.js

@@ -0,0 +1,6 @@
+import dropdown from "./dropdown.js";
+import dropdown_item from "./dropdown-item.js";
+import dropdown_menu from "./dropdown-menu.js";
+import { DropdownTrigger } from "@heroui/dropdown";
+export * from "./dropdown-section.js";
+export { dropdown as UXDropdown, dropdown_item as UXDropdownItem, dropdown_menu as UXDropdownMenu, DropdownTrigger as UXDropdownTrigger };

package/dist/components/UXHint/index.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { type UXTooltipProps } from '..';
+export type UXHintProps = UXTooltipProps & {
+    buttonClassName?: string;
+    iconClassName?: string;
+};
+declare const UXHint: React.FC<UXHintProps>;
+export default UXHint;

package/dist/components/UXHint/index.js

@@ -0,0 +1,22 @@
+import { jsx } from "react/jsx-runtime";
+import "react";
+import { UXButton, UXTooltip } from "../index.js";
+import { QuestionIcon } from "../../icons/index.js";
+const UXHint_UXHint = (props)=>{
+    const { content, children, buttonClassName, iconClassName, ...restProps } = props;
+    return /*#__PURE__*/ jsx(UXTooltip, {
+        content: content || children,
+        ...restProps,
+        children: /*#__PURE__*/ jsx(UXButton, {
+            variant: "text",
+            color: "secondary",
+            className: buttonClassName,
+            children: /*#__PURE__*/ jsx(QuestionIcon, {
+                className: iconClassName
+            })
+        })
+    });
+};
+UXHint_UXHint.displayName = 'UX.Hint';
+const UXHint = UXHint_UXHint;
+export { UXHint as default };