@fuf-stack/pixels 0.37.1 → 0.38.0
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/Popover/index.cjs +2 -2
- package/dist/Popover/index.d.cts +4 -2
- package/dist/Popover/index.d.ts +4 -2
- package/dist/Popover/index.js +1 -1
- package/dist/{Popover-Db9vCWrz.d.cts → Popover-B2-09nsy.d.ts} +5 -2
- package/dist/{Popover-Db9vCWrz.d.ts → Popover-DAYvOjOY.d.cts} +5 -2
- package/dist/{chunk-C4H5ZCTV.cjs → chunk-EAJGISR6.cjs} +13 -3
- package/dist/chunk-EAJGISR6.cjs.map +1 -0
- package/dist/{chunk-7H67WTTJ.js → chunk-MOIIBJ6O.js} +13 -3
- package/dist/chunk-MOIIBJ6O.js.map +1 -0
- package/dist/index.cjs +2 -2
- package/dist/index.d.cts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +1 -1
- package/package.json +3 -3
- package/dist/chunk-7H67WTTJ.js.map +0 -1
- package/dist/chunk-C4H5ZCTV.cjs.map +0 -1
package/dist/Popover/index.cjs
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
2
2
|
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var _chunkEAJGISR6cjs = require('../chunk-EAJGISR6.cjs');
|
|
5
5
|
require('../chunk-TX2VP4J7.cjs');
|
|
6
6
|
require('../chunk-D4TLDLEX.cjs');
|
|
7
7
|
|
|
8
8
|
|
|
9
9
|
|
|
10
|
-
exports.Popover =
|
|
10
|
+
exports.Popover = _chunkEAJGISR6cjs.Popover_default; exports.default = _chunkEAJGISR6cjs.Popover_default2;
|
|
11
11
|
//# sourceMappingURL=index.cjs.map
|
package/dist/Popover/index.d.cts
CHANGED
|
@@ -1,11 +1,13 @@
|
|
|
1
|
-
import { _ as _default } from '../Popover-
|
|
2
|
-
export { P as PopoverProps } from '../Popover-
|
|
1
|
+
import { _ as _default } from '../Popover-DAYvOjOY.cjs';
|
|
2
|
+
export { P as PopoverProps } from '../Popover-DAYvOjOY.cjs';
|
|
3
3
|
import 'react/jsx-runtime';
|
|
4
4
|
import 'tailwind-variants/dist/config.js';
|
|
5
5
|
import 'tailwind-variants';
|
|
6
6
|
import '@fuf-stack/pixel-utils';
|
|
7
7
|
import '@heroui/popover';
|
|
8
8
|
import 'react';
|
|
9
|
+
import '../Button-BGekDPvO.cjs';
|
|
10
|
+
import '@heroui/button';
|
|
9
11
|
|
|
10
12
|
|
|
11
13
|
|
package/dist/Popover/index.d.ts
CHANGED
|
@@ -1,11 +1,13 @@
|
|
|
1
|
-
import { _ as _default } from '../Popover-
|
|
2
|
-
export { P as PopoverProps } from '../Popover-
|
|
1
|
+
import { _ as _default } from '../Popover-B2-09nsy.js';
|
|
2
|
+
export { P as PopoverProps } from '../Popover-B2-09nsy.js';
|
|
3
3
|
import 'react/jsx-runtime';
|
|
4
4
|
import 'tailwind-variants/dist/config.js';
|
|
5
5
|
import 'tailwind-variants';
|
|
6
6
|
import '@fuf-stack/pixel-utils';
|
|
7
7
|
import '@heroui/popover';
|
|
8
8
|
import 'react';
|
|
9
|
+
import '../Button-BGekDPvO.js';
|
|
10
|
+
import '@heroui/button';
|
|
9
11
|
|
|
10
12
|
|
|
11
13
|
|
package/dist/Popover/index.js
CHANGED
|
@@ -4,6 +4,7 @@ import * as tailwind_variants from 'tailwind-variants';
|
|
|
4
4
|
import { TVProps, TVClassName } from '@fuf-stack/pixel-utils';
|
|
5
5
|
import { PopoverProps as PopoverProps$1 } from '@heroui/popover';
|
|
6
6
|
import { ReactNode } from 'react';
|
|
7
|
+
import { a as ButtonProps } from './Button-BGekDPvO.js';
|
|
7
8
|
|
|
8
9
|
declare const popoverVariants: tailwind_variants.TVReturnType<{
|
|
9
10
|
[key: string]: {
|
|
@@ -100,12 +101,14 @@ interface PopoverProps extends VariantProps {
|
|
|
100
101
|
shouldBlockScroll?: boolean;
|
|
101
102
|
/** HTML data-testid attribute used in e2e tests */
|
|
102
103
|
testId?: string;
|
|
103
|
-
/**
|
|
104
|
+
/** Popover title */
|
|
104
105
|
title?: ReactNode;
|
|
106
|
+
/** When defined a Button will be rendered as trigger (with provided props) instead of unstyled html button */
|
|
107
|
+
triggerButtonProps?: Pick<ButtonProps, 'ariaLabel' | 'className' | 'color' | 'disableAnimation' | 'disabled' | 'icon' | 'size' | 'testId' | 'variant'>;
|
|
105
108
|
}
|
|
106
109
|
/**
|
|
107
110
|
* Popover component based on [HeroUI Card](https://www.heroui.com//docs/components/popover)
|
|
108
111
|
*/
|
|
109
|
-
declare const _default: ({ children, className: _className, content, contentTestId, footer, openControlled, placement, portalContainer, shouldBlockScroll, testId, title, }: PopoverProps) => react_jsx_runtime.JSX.Element;
|
|
112
|
+
declare const _default: ({ children, className: _className, content, contentTestId, footer, openControlled, placement, portalContainer, shouldBlockScroll, testId, title, triggerButtonProps, }: PopoverProps) => react_jsx_runtime.JSX.Element;
|
|
110
113
|
|
|
111
114
|
export { type PopoverProps as P, _default as _ };
|
|
@@ -4,6 +4,7 @@ import * as tailwind_variants from 'tailwind-variants';
|
|
|
4
4
|
import { TVProps, TVClassName } from '@fuf-stack/pixel-utils';
|
|
5
5
|
import { PopoverProps as PopoverProps$1 } from '@heroui/popover';
|
|
6
6
|
import { ReactNode } from 'react';
|
|
7
|
+
import { a as ButtonProps } from './Button-BGekDPvO.cjs';
|
|
7
8
|
|
|
8
9
|
declare const popoverVariants: tailwind_variants.TVReturnType<{
|
|
9
10
|
[key: string]: {
|
|
@@ -100,12 +101,14 @@ interface PopoverProps extends VariantProps {
|
|
|
100
101
|
shouldBlockScroll?: boolean;
|
|
101
102
|
/** HTML data-testid attribute used in e2e tests */
|
|
102
103
|
testId?: string;
|
|
103
|
-
/**
|
|
104
|
+
/** Popover title */
|
|
104
105
|
title?: ReactNode;
|
|
106
|
+
/** When defined a Button will be rendered as trigger (with provided props) instead of unstyled html button */
|
|
107
|
+
triggerButtonProps?: Pick<ButtonProps, 'ariaLabel' | 'className' | 'color' | 'disableAnimation' | 'disabled' | 'icon' | 'size' | 'testId' | 'variant'>;
|
|
105
108
|
}
|
|
106
109
|
/**
|
|
107
110
|
* Popover component based on [HeroUI Card](https://www.heroui.com//docs/components/popover)
|
|
108
111
|
*/
|
|
109
|
-
declare const _default: ({ children, className: _className, content, contentTestId, footer, openControlled, placement, portalContainer, shouldBlockScroll, testId, title, }: PopoverProps) => react_jsx_runtime.JSX.Element;
|
|
112
|
+
declare const _default: ({ children, className: _className, content, contentTestId, footer, openControlled, placement, portalContainer, shouldBlockScroll, testId, title, triggerButtonProps, }: PopoverProps) => react_jsx_runtime.JSX.Element;
|
|
110
113
|
|
|
111
114
|
export { type PopoverProps as P, _default as _ };
|
|
@@ -7,6 +7,7 @@ var _chunkTX2VP4J7cjs = require('./chunk-TX2VP4J7.cjs');
|
|
|
7
7
|
var _chunkD4TLDLEXcjs = require('./chunk-D4TLDLEX.cjs');
|
|
8
8
|
|
|
9
9
|
// src/Popover/Popover.tsx
|
|
10
|
+
var _button = require('@heroui/button');
|
|
10
11
|
var _popover = require('@heroui/popover');
|
|
11
12
|
var _pixelutils = require('@fuf-stack/pixel-utils');
|
|
12
13
|
var _jsxruntime = require('react/jsx-runtime');
|
|
@@ -30,7 +31,8 @@ var Popover_default = ({
|
|
|
30
31
|
portalContainer = void 0,
|
|
31
32
|
shouldBlockScroll = void 0,
|
|
32
33
|
testId = void 0,
|
|
33
|
-
title = void 0
|
|
34
|
+
title = void 0,
|
|
35
|
+
triggerButtonProps = void 0
|
|
34
36
|
}) => {
|
|
35
37
|
const variants = popoverVariants();
|
|
36
38
|
const className = _pixelutils.variantsToClassNames.call(void 0, variants, _className, "trigger");
|
|
@@ -45,7 +47,15 @@ var Popover_default = ({
|
|
|
45
47
|
showArrow: true
|
|
46
48
|
}, openControlled ? { isOpen: openControlled.open, onOpenChange: openControlled.setOpen } : {}), {
|
|
47
49
|
children: [
|
|
48
|
-
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, _popover.PopoverTrigger, { "data-testid": testId, children:
|
|
50
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, _popover.PopoverTrigger, { "data-testid": testId, children: triggerButtonProps ? (
|
|
51
|
+
// TODO: currently we have to use @heroui/button because
|
|
52
|
+
// passing ref does not work (even with forwardRef in Button)
|
|
53
|
+
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
54
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, _button.Button, _chunkD4TLDLEXcjs.__spreadProps.call(void 0, _chunkD4TLDLEXcjs.__spreadValues.call(void 0, {}, triggerButtonProps), { children }))
|
|
55
|
+
) : (
|
|
56
|
+
// eslint-disable-next-line react/button-has-type
|
|
57
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, "button", { children })
|
|
58
|
+
) }),
|
|
49
59
|
/* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _popover.PopoverContent, { "data-testid": contentTestId, children: [
|
|
50
60
|
title && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: className.header, children: [
|
|
51
61
|
title,
|
|
@@ -69,4 +79,4 @@ var Popover_default2 = Popover_default;
|
|
|
69
79
|
|
|
70
80
|
|
|
71
81
|
exports.Popover_default = Popover_default; exports.Popover_default2 = Popover_default2;
|
|
72
|
-
//# sourceMappingURL=chunk-
|
|
82
|
+
//# sourceMappingURL=chunk-EAJGISR6.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/pixels/dist/chunk-EAJGISR6.cjs","../src/Popover/Popover.tsx","../src/Popover/index.ts"],"names":["Popover_default"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/pixels/dist/chunk-EAJGISR6.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { PopoverProps as HeroPopoverProps } from '@heroui/popover';\nimport type { ReactNode } from 'react';\nimport type { ButtonProps } from '../Button';\n\nimport { Button } from '@heroui/button';\nimport { Popover, PopoverContent, PopoverTrigger } from '@heroui/popover';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport ScrollShadow from '../ScrollShadow/ScrollShadow';\n\n// popover styling variants\nexport const popoverVariants = tv({\n slots: {\n body: 'w-full px-2.5 py-1',\n content: 'flex max-h-[80vh] flex-col p-0',\n footer: 'w-full px-2.5 py-1',\n header: 'w-full px-2.5 py-1',\n trigger: '',\n },\n});\n\ntype VariantProps = TVProps<typeof popoverVariants>;\ntype ClassName = TVClassName<typeof popoverVariants>;\n\nexport interface PopoverProps extends VariantProps {\n /** child components */\n children?: ReactNode;\n /** CSS class name */\n className?: ClassName;\n /** content of the popover */\n content: ReactNode;\n /** HTML data-testid attribute used in e2e tests */\n contentTestId?: string;\n /** popover footer */\n footer?: ReactNode;\n /** use as controlled component */\n openControlled?: { open: boolean; setOpen: (open: boolean) => void };\n /** placement of the popover relative to its trigger reference */\n placement?: HeroPopoverProps['placement'];\n /** The container element in which the overlay portal will be placed. */\n portalContainer?: HeroPopoverProps['portalContainer'];\n /** Whether to block scrolling outside the popover */\n shouldBlockScroll?: boolean;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n /** Popover title */\n title?: ReactNode;\n /** When defined a Button will be rendered as trigger (with provided props) instead of unstyled html button */\n triggerButtonProps?: Pick<\n ButtonProps,\n | 'ariaLabel'\n | 'className'\n | 'color'\n | 'disableAnimation'\n | 'disabled'\n | 'icon'\n | 'size'\n | 'testId'\n | 'variant'\n >;\n}\n\n/**\n * Popover component based on [HeroUI Card](https://www.heroui.com//docs/components/popover)\n */\nexport default ({\n children = null,\n className: _className = undefined,\n content,\n contentTestId = undefined,\n footer = undefined,\n openControlled = undefined,\n placement = 'top',\n portalContainer = undefined,\n shouldBlockScroll = undefined,\n testId = undefined,\n title = undefined,\n triggerButtonProps = undefined,\n}: PopoverProps) => {\n // className from slots\n const variants = popoverVariants();\n const className = variantsToClassNames(variants, _className, 'trigger');\n\n return (\n <Popover\n classNames={className}\n placement={placement}\n portalContainer={portalContainer}\n radius=\"sm\"\n shouldBlockScroll={shouldBlockScroll}\n showArrow\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...(openControlled\n ? { isOpen: openControlled.open, onOpenChange: openControlled.setOpen }\n : {})}\n >\n <PopoverTrigger data-testid={testId}>\n {/* NOTE: type and aria properties are injected by PopoverTrigger */}\n {triggerButtonProps ? (\n // TODO: currently we have to use @heroui/button because\n // passing ref does not work (even with forwardRef in Button)\n // eslint-disable-next-line react/jsx-props-no-spreading\n <Button {...triggerButtonProps}>{children}</Button>\n ) : (\n // eslint-disable-next-line react/button-has-type\n <button>{children}</button>\n )}\n </PopoverTrigger>\n <PopoverContent data-testid={contentTestId}>\n {title && (\n <div className={className.header}>\n {title}\n <hr />\n </div>\n )}\n <ScrollShadow className={className.body}>{content}</ScrollShadow>\n {footer && (\n <div className={className.footer}>\n <hr />\n {footer}\n </div>\n )}\n </PopoverContent>\n </Popover>\n );\n};\n","import Popover from './Popover';\n\nexport type { PopoverProps } from './Popover';\n\nexport { Popover };\n\nexport default Popover;\n"]}
|
|
@@ -7,6 +7,7 @@ import {
|
|
|
7
7
|
} from "./chunk-J7N2552D.js";
|
|
8
8
|
|
|
9
9
|
// src/Popover/Popover.tsx
|
|
10
|
+
import { Button } from "@heroui/button";
|
|
10
11
|
import { Popover, PopoverContent, PopoverTrigger } from "@heroui/popover";
|
|
11
12
|
import { tv, variantsToClassNames } from "@fuf-stack/pixel-utils";
|
|
12
13
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
@@ -30,7 +31,8 @@ var Popover_default = ({
|
|
|
30
31
|
portalContainer = void 0,
|
|
31
32
|
shouldBlockScroll = void 0,
|
|
32
33
|
testId = void 0,
|
|
33
|
-
title = void 0
|
|
34
|
+
title = void 0,
|
|
35
|
+
triggerButtonProps = void 0
|
|
34
36
|
}) => {
|
|
35
37
|
const variants = popoverVariants();
|
|
36
38
|
const className = variantsToClassNames(variants, _className, "trigger");
|
|
@@ -45,7 +47,15 @@ var Popover_default = ({
|
|
|
45
47
|
showArrow: true
|
|
46
48
|
}, openControlled ? { isOpen: openControlled.open, onOpenChange: openControlled.setOpen } : {}), {
|
|
47
49
|
children: [
|
|
48
|
-
/* @__PURE__ */ jsx(PopoverTrigger, { "data-testid": testId, children:
|
|
50
|
+
/* @__PURE__ */ jsx(PopoverTrigger, { "data-testid": testId, children: triggerButtonProps ? (
|
|
51
|
+
// TODO: currently we have to use @heroui/button because
|
|
52
|
+
// passing ref does not work (even with forwardRef in Button)
|
|
53
|
+
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
54
|
+
/* @__PURE__ */ jsx(Button, __spreadProps(__spreadValues({}, triggerButtonProps), { children }))
|
|
55
|
+
) : (
|
|
56
|
+
// eslint-disable-next-line react/button-has-type
|
|
57
|
+
/* @__PURE__ */ jsx("button", { children })
|
|
58
|
+
) }),
|
|
49
59
|
/* @__PURE__ */ jsxs(PopoverContent, { "data-testid": contentTestId, children: [
|
|
50
60
|
title && /* @__PURE__ */ jsxs("div", { className: className.header, children: [
|
|
51
61
|
title,
|
|
@@ -69,4 +79,4 @@ export {
|
|
|
69
79
|
Popover_default,
|
|
70
80
|
Popover_default2
|
|
71
81
|
};
|
|
72
|
-
//# sourceMappingURL=chunk-
|
|
82
|
+
//# sourceMappingURL=chunk-MOIIBJ6O.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/Popover/Popover.tsx","../src/Popover/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { PopoverProps as HeroPopoverProps } from '@heroui/popover';\nimport type { ReactNode } from 'react';\nimport type { ButtonProps } from '../Button';\n\nimport { Button } from '@heroui/button';\nimport { Popover, PopoverContent, PopoverTrigger } from '@heroui/popover';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport ScrollShadow from '../ScrollShadow/ScrollShadow';\n\n// popover styling variants\nexport const popoverVariants = tv({\n slots: {\n body: 'w-full px-2.5 py-1',\n content: 'flex max-h-[80vh] flex-col p-0',\n footer: 'w-full px-2.5 py-1',\n header: 'w-full px-2.5 py-1',\n trigger: '',\n },\n});\n\ntype VariantProps = TVProps<typeof popoverVariants>;\ntype ClassName = TVClassName<typeof popoverVariants>;\n\nexport interface PopoverProps extends VariantProps {\n /** child components */\n children?: ReactNode;\n /** CSS class name */\n className?: ClassName;\n /** content of the popover */\n content: ReactNode;\n /** HTML data-testid attribute used in e2e tests */\n contentTestId?: string;\n /** popover footer */\n footer?: ReactNode;\n /** use as controlled component */\n openControlled?: { open: boolean; setOpen: (open: boolean) => void };\n /** placement of the popover relative to its trigger reference */\n placement?: HeroPopoverProps['placement'];\n /** The container element in which the overlay portal will be placed. */\n portalContainer?: HeroPopoverProps['portalContainer'];\n /** Whether to block scrolling outside the popover */\n shouldBlockScroll?: boolean;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n /** Popover title */\n title?: ReactNode;\n /** When defined a Button will be rendered as trigger (with provided props) instead of unstyled html button */\n triggerButtonProps?: Pick<\n ButtonProps,\n | 'ariaLabel'\n | 'className'\n | 'color'\n | 'disableAnimation'\n | 'disabled'\n | 'icon'\n | 'size'\n | 'testId'\n | 'variant'\n >;\n}\n\n/**\n * Popover component based on [HeroUI Card](https://www.heroui.com//docs/components/popover)\n */\nexport default ({\n children = null,\n className: _className = undefined,\n content,\n contentTestId = undefined,\n footer = undefined,\n openControlled = undefined,\n placement = 'top',\n portalContainer = undefined,\n shouldBlockScroll = undefined,\n testId = undefined,\n title = undefined,\n triggerButtonProps = undefined,\n}: PopoverProps) => {\n // className from slots\n const variants = popoverVariants();\n const className = variantsToClassNames(variants, _className, 'trigger');\n\n return (\n <Popover\n classNames={className}\n placement={placement}\n portalContainer={portalContainer}\n radius=\"sm\"\n shouldBlockScroll={shouldBlockScroll}\n showArrow\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...(openControlled\n ? { isOpen: openControlled.open, onOpenChange: openControlled.setOpen }\n : {})}\n >\n <PopoverTrigger data-testid={testId}>\n {/* NOTE: type and aria properties are injected by PopoverTrigger */}\n {triggerButtonProps ? (\n // TODO: currently we have to use @heroui/button because\n // passing ref does not work (even with forwardRef in Button)\n // eslint-disable-next-line react/jsx-props-no-spreading\n <Button {...triggerButtonProps}>{children}</Button>\n ) : (\n // eslint-disable-next-line react/button-has-type\n <button>{children}</button>\n )}\n </PopoverTrigger>\n <PopoverContent data-testid={contentTestId}>\n {title && (\n <div className={className.header}>\n {title}\n <hr />\n </div>\n )}\n <ScrollShadow className={className.body}>{content}</ScrollShadow>\n {footer && (\n <div className={className.footer}>\n <hr />\n {footer}\n </div>\n )}\n </PopoverContent>\n </Popover>\n );\n};\n","import Popover from './Popover';\n\nexport type { PopoverProps } from './Popover';\n\nexport { Popover };\n\nexport default Popover;\n"],"mappings":";;;;;;;;;AAKA,SAAS,cAAc;AACvB,SAAS,SAAS,gBAAgB,sBAAsB;AAExD,SAAS,IAAI,4BAA4B;AAgG/B,cAQA,YARA;AA3FH,IAAM,kBAAkB,GAAG;AAAA,EAChC,OAAO;AAAA,IACL,MAAM;AAAA,IACN,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,SAAS;AAAA,EACX;AACF,CAAC;AA8CD,IAAO,kBAAQ,CAAC;AAAA,EACd,WAAW;AAAA,EACX,WAAW,aAAa;AAAA,EACxB;AAAA,EACA,gBAAgB;AAAA,EAChB,SAAS;AAAA,EACT,iBAAiB;AAAA,EACjB,YAAY;AAAA,EACZ,kBAAkB;AAAA,EAClB,oBAAoB;AAAA,EACpB,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,qBAAqB;AACvB,MAAoB;AAElB,QAAM,WAAW,gBAAgB;AACjC,QAAM,YAAY,qBAAqB,UAAU,YAAY,SAAS;AAEtE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,YAAY;AAAA,MACZ;AAAA,MACA;AAAA,MACA,QAAO;AAAA,MACP;AAAA,MACA,WAAS;AAAA,OAEJ,iBACD,EAAE,QAAQ,eAAe,MAAM,cAAc,eAAe,QAAQ,IACpE,CAAC,IAVN;AAAA,MAYC;AAAA,4BAAC,kBAAe,eAAa,QAE1B;AAAA;AAAA;AAAA;AAAA,UAIC,oBAAC,yCAAW,qBAAX,EAAgC,WAAS;AAAA;AAAA;AAAA,UAG1C,oBAAC,YAAQ,UAAS;AAAA,WAEtB;AAAA,QACA,qBAAC,kBAAe,eAAa,eAC1B;AAAA,mBACC,qBAAC,SAAI,WAAW,UAAU,QACvB;AAAA;AAAA,YACD,oBAAC,QAAG;AAAA,aACN;AAAA,UAEF,oBAAC,wBAAa,WAAW,UAAU,MAAO,mBAAQ;AAAA,UACjD,UACC,qBAAC,SAAI,WAAW,UAAU,QACxB;AAAA,gCAAC,QAAG;AAAA,YACH;AAAA,aACH;AAAA,WAEJ;AAAA;AAAA;AAAA,EACF;AAEJ;;;ACzHA,IAAOA,mBAAQ;","names":["Popover_default"]}
|
package/dist/index.cjs
CHANGED
|
@@ -43,7 +43,7 @@ var _chunkKBYU4ZF2cjs = require('./chunk-KBYU4ZF2.cjs');
|
|
|
43
43
|
var _chunkPEUUQMJScjs = require('./chunk-PEUUQMJS.cjs');
|
|
44
44
|
|
|
45
45
|
|
|
46
|
-
var
|
|
46
|
+
var _chunkEAJGISR6cjs = require('./chunk-EAJGISR6.cjs');
|
|
47
47
|
require('./chunk-TX2VP4J7.cjs');
|
|
48
48
|
|
|
49
49
|
|
|
@@ -105,5 +105,5 @@ require('./chunk-D4TLDLEX.cjs');
|
|
|
105
105
|
|
|
106
106
|
|
|
107
107
|
|
|
108
|
-
exports.Accordion = _chunk2P5WWVQ6cjs.Accordion_default; exports.Alert = _chunk33S6NRVIcjs.Alert_default; exports.Avatar = _chunk77J7NZYBcjs.Avatar_default; exports.AvatarGroup = _chunkLIZGYO24cjs.AvatarGroup_default; exports.Badge = _chunkJSANDW3Wcjs.Badge_default; exports.Breadcrumb = _chunkZZOEFQWQcjs.Breadcrumb_default; exports.Button = _chunk4X43AGXEcjs.Button_default; exports.ButtonGroup = _chunkY3RSI2KVcjs.ButtonGroup_default; exports.Card = _chunkMHZAWSFJcjs.Card_default; exports.Drawer = _chunk7RVUB6I5cjs.Drawer_default; exports.Json = _chunkZASS525Kcjs.Json_default; exports.Label = _chunk2XYKRMUNcjs.Label_default; exports.Menu = _chunkKBYU4ZF2cjs.Menu_default; exports.Modal = _chunkPEUUQMJScjs.Modal_default; exports.Popover =
|
|
108
|
+
exports.Accordion = _chunk2P5WWVQ6cjs.Accordion_default; exports.Alert = _chunk33S6NRVIcjs.Alert_default; exports.Avatar = _chunk77J7NZYBcjs.Avatar_default; exports.AvatarGroup = _chunkLIZGYO24cjs.AvatarGroup_default; exports.Badge = _chunkJSANDW3Wcjs.Badge_default; exports.Breadcrumb = _chunkZZOEFQWQcjs.Breadcrumb_default; exports.Button = _chunk4X43AGXEcjs.Button_default; exports.ButtonGroup = _chunkY3RSI2KVcjs.ButtonGroup_default; exports.Card = _chunkMHZAWSFJcjs.Card_default; exports.Drawer = _chunk7RVUB6I5cjs.Drawer_default; exports.Json = _chunkZASS525Kcjs.Json_default; exports.Label = _chunk2XYKRMUNcjs.Label_default; exports.Menu = _chunkKBYU4ZF2cjs.Menu_default; exports.Modal = _chunkPEUUQMJScjs.Modal_default; exports.Popover = _chunkEAJGISR6cjs.Popover_default; exports.Table = _chunkA4MJ5V64cjs.Table_default; exports.Tabs = _chunkJUHSESWBcjs.Tabs_default; exports.Tooltip = _chunk25AJSW5Ecjs.Tooltip_default; exports.accordionVariants = _chunk2P5WWVQ6cjs.accordionVariants; exports.alertVariants = _chunk33S6NRVIcjs.alertVariants; exports.breadcrumbVariants = _chunkZZOEFQWQcjs.breadcrumbVariants; exports.buttonVariants = _chunk4X43AGXEcjs.buttonVariants; exports.cardVariants = _chunkMHZAWSFJcjs.cardVariants; exports.drawerBackdrops = _chunk7RVUB6I5cjs.drawerBackdrops; exports.drawerPlacements = _chunk7RVUB6I5cjs.drawerPlacements; exports.drawerRadii = _chunk7RVUB6I5cjs.drawerRadii; exports.drawerSizes = _chunk7RVUB6I5cjs.drawerSizes; exports.drawerVariants = _chunk7RVUB6I5cjs.drawerVariants; exports.modalVariants = _chunkPEUUQMJScjs.modalVariants; exports.tableVariants = _chunkA4MJ5V64cjs.tableVariants; exports.tabsVariants = _chunkJUHSESWBcjs.tabsVariants; exports.useDebounce = _chunkMWNBYTRNcjs.useDebounce; exports.useLocalStorage = _chunkMWNBYTRNcjs.useLocalStorage;
|
|
109
109
|
//# sourceMappingURL=index.cjs.map
|
package/dist/index.d.cts
CHANGED
|
@@ -12,7 +12,7 @@ export { J as Json, a as JsonProps } from './Json-ngM0f9n2.cjs';
|
|
|
12
12
|
export { L as Label, a as LabelProps } from './Label-BH0taC2T.cjs';
|
|
13
13
|
export { M as Menu, b as MenuItem, a as MenuProps, c as MenuSection } from './Menu-C7lpY7pY.cjs';
|
|
14
14
|
export { M as Modal, a as ModalProps, m as modalVariants } from './Modal-DI5ZdS_3.cjs';
|
|
15
|
-
export { _ as Popover, P as PopoverProps } from './Popover-
|
|
15
|
+
export { _ as Popover, P as PopoverProps } from './Popover-DAYvOjOY.cjs';
|
|
16
16
|
export { T as Table, c as TableColumnProps, a as TableProps, b as TableRowProps, V as VariantProps, t as tableVariants } from './Table-D19f5nrd.cjs';
|
|
17
17
|
export { b as TabProps, T as Tabs, a as TabsProps, t as tabsVariants } from './Tabs-xUYwXMX9.cjs';
|
|
18
18
|
export { T as Tooltip, b as TooltipPlacement, a as TooltipProps } from './Tooltip-Bu71AKvn.cjs';
|
package/dist/index.d.ts
CHANGED
|
@@ -12,7 +12,7 @@ export { J as Json, a as JsonProps } from './Json-ngM0f9n2.js';
|
|
|
12
12
|
export { L as Label, a as LabelProps } from './Label-BH0taC2T.js';
|
|
13
13
|
export { M as Menu, b as MenuItem, a as MenuProps, c as MenuSection } from './Menu-C7lpY7pY.js';
|
|
14
14
|
export { M as Modal, a as ModalProps, m as modalVariants } from './Modal-DI5ZdS_3.js';
|
|
15
|
-
export { _ as Popover, P as PopoverProps } from './Popover-
|
|
15
|
+
export { _ as Popover, P as PopoverProps } from './Popover-B2-09nsy.js';
|
|
16
16
|
export { T as Table, c as TableColumnProps, a as TableProps, b as TableRowProps, V as VariantProps, t as tableVariants } from './Table-D19f5nrd.js';
|
|
17
17
|
export { b as TabProps, T as Tabs, a as TabsProps, t as tabsVariants } from './Tabs-xUYwXMX9.js';
|
|
18
18
|
export { T as Tooltip, b as TooltipPlacement, a as TooltipProps } from './Tooltip-Bu71AKvn.js';
|
package/dist/index.js
CHANGED
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"name": "@fuf-stack/pixels",
|
|
3
3
|
"description": "fuf core react component library",
|
|
4
4
|
"author": "Hannes Tiede",
|
|
5
|
-
"version": "0.
|
|
5
|
+
"version": "0.38.0",
|
|
6
6
|
"type": "module",
|
|
7
7
|
"main": "./dist/index.cjs",
|
|
8
8
|
"module": "./dist/index.js",
|
|
@@ -178,9 +178,9 @@
|
|
|
178
178
|
"react": "19.0.0",
|
|
179
179
|
"react-dom": "19.0.0",
|
|
180
180
|
"@repo/tailwind-config": "0.0.1",
|
|
181
|
-
"@repo/
|
|
181
|
+
"@repo/storybook-config": "0.0.1",
|
|
182
182
|
"@repo/tsup-config": "0.0.1",
|
|
183
|
-
"@repo/
|
|
183
|
+
"@repo/vite-config": "0.0.1"
|
|
184
184
|
},
|
|
185
185
|
"scripts": {
|
|
186
186
|
"build": "tsup --config node_modules/@repo/tsup-config/config.ts --dts-resolve",
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/Popover/Popover.tsx","../src/Popover/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { PopoverProps as HeroPopoverProps } from '@heroui/popover';\nimport type { ReactNode } from 'react';\n\nimport { Popover, PopoverContent, PopoverTrigger } from '@heroui/popover';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport ScrollShadow from '../ScrollShadow/ScrollShadow';\n\n// popover styling variants\nexport const popoverVariants = tv({\n slots: {\n body: 'w-full px-2.5 py-1',\n content: 'flex max-h-[80vh] flex-col p-0',\n footer: 'w-full px-2.5 py-1',\n header: 'w-full px-2.5 py-1',\n trigger: '',\n },\n});\n\ntype VariantProps = TVProps<typeof popoverVariants>;\ntype ClassName = TVClassName<typeof popoverVariants>;\n\nexport interface PopoverProps extends VariantProps {\n /** child components */\n children?: ReactNode;\n /** CSS class name */\n className?: ClassName;\n /** content of the popover */\n content: ReactNode;\n /** HTML data-testid attribute used in e2e tests */\n contentTestId?: string;\n /** popover footer */\n footer?: ReactNode;\n /** use as controlled component */\n openControlled?: { open: boolean; setOpen: (open: boolean) => void };\n /** placement of the popover relative to its trigger reference */\n placement?: HeroPopoverProps['placement'];\n /** The container element in which the overlay portal will be placed. */\n portalContainer?: HeroPopoverProps['portalContainer'];\n /** Whether to block scrolling outside the popover */\n shouldBlockScroll?: boolean;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n /** popover title */\n title?: ReactNode;\n}\n\n/**\n * Popover component based on [HeroUI Card](https://www.heroui.com//docs/components/popover)\n */\nexport default ({\n children = null,\n className: _className = undefined,\n content,\n contentTestId = undefined,\n footer = undefined,\n openControlled = undefined,\n placement = 'top',\n portalContainer = undefined,\n shouldBlockScroll = undefined,\n testId = undefined,\n title = undefined,\n}: PopoverProps) => {\n // className from slots\n const variants = popoverVariants();\n const className = variantsToClassNames(variants, _className, 'trigger');\n\n return (\n <Popover\n classNames={className}\n placement={placement}\n portalContainer={portalContainer}\n radius=\"sm\"\n shouldBlockScroll={shouldBlockScroll}\n showArrow\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...(openControlled\n ? { isOpen: openControlled.open, onOpenChange: openControlled.setOpen }\n : {})}\n >\n <PopoverTrigger data-testid={testId}>\n {/* NOTE: type and aria properties are injected by PopoverTrigger */}\n {/* eslint-disable-next-line react/button-has-type */}\n <button>{children}</button>\n </PopoverTrigger>\n <PopoverContent data-testid={contentTestId}>\n {title && (\n <div className={className.header}>\n {title}\n <hr />\n </div>\n )}\n <ScrollShadow className={className.body}>{content}</ScrollShadow>\n {footer && (\n <div className={className.footer}>\n <hr />\n {footer}\n </div>\n )}\n </PopoverContent>\n </Popover>\n );\n};\n","import Popover from './Popover';\n\nexport type { PopoverProps } from './Popover';\n\nexport { Popover };\n\nexport default Popover;\n"],"mappings":";;;;;;;;;AAIA,SAAS,SAAS,gBAAgB,sBAAsB;AAExD,SAAS,IAAI,4BAA4B;AA+EjC,cAIE,YAJF;AA1ED,IAAM,kBAAkB,GAAG;AAAA,EAChC,OAAO;AAAA,IACL,MAAM;AAAA,IACN,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,SAAS;AAAA,EACX;AACF,CAAC;AAiCD,IAAO,kBAAQ,CAAC;AAAA,EACd,WAAW;AAAA,EACX,WAAW,aAAa;AAAA,EACxB;AAAA,EACA,gBAAgB;AAAA,EAChB,SAAS;AAAA,EACT,iBAAiB;AAAA,EACjB,YAAY;AAAA,EACZ,kBAAkB;AAAA,EAClB,oBAAoB;AAAA,EACpB,SAAS;AAAA,EACT,QAAQ;AACV,MAAoB;AAElB,QAAM,WAAW,gBAAgB;AACjC,QAAM,YAAY,qBAAqB,UAAU,YAAY,SAAS;AAEtE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,YAAY;AAAA,MACZ;AAAA,MACA;AAAA,MACA,QAAO;AAAA,MACP;AAAA,MACA,WAAS;AAAA,OAEJ,iBACD,EAAE,QAAQ,eAAe,MAAM,cAAc,eAAe,QAAQ,IACpE,CAAC,IAVN;AAAA,MAYC;AAAA,4BAAC,kBAAe,eAAa,QAG3B,8BAAC,YAAQ,UAAS,GACpB;AAAA,QACA,qBAAC,kBAAe,eAAa,eAC1B;AAAA,mBACC,qBAAC,SAAI,WAAW,UAAU,QACvB;AAAA;AAAA,YACD,oBAAC,QAAG;AAAA,aACN;AAAA,UAEF,oBAAC,wBAAa,WAAW,UAAU,MAAO,mBAAQ;AAAA,UACjD,UACC,qBAAC,SAAI,WAAW,UAAU,QACxB;AAAA,gCAAC,QAAG;AAAA,YACH;AAAA,aACH;AAAA,WAEJ;AAAA;AAAA;AAAA,EACF;AAEJ;;;AClGA,IAAOA,mBAAQ;","names":["Popover_default"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/pixels/dist/chunk-C4H5ZCTV.cjs","../src/Popover/Popover.tsx","../src/Popover/index.ts"],"names":["Popover_default"],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACE;AACA;AACF,wDAA6B;AAC7B;AACA;ACJA,0CAAwD;AAExD,oDAAyC;AA+EjC,+CAAA;AA1ED,IAAM,gBAAA,EAAkB,4BAAA;AAAG,EAChC,KAAA,EAAO;AAAA,IACL,IAAA,EAAM,oBAAA;AAAA,IACN,OAAA,EAAS,gCAAA;AAAA,IACT,MAAA,EAAQ,oBAAA;AAAA,IACR,MAAA,EAAQ,oBAAA;AAAA,IACR,OAAA,EAAS;AAAA,EACX;AACF,CAAC,CAAA;AAiCD,IAAO,gBAAA,EAAQ,CAAC;AAAA,EACd,SAAA,EAAW,IAAA;AAAA,EACX,SAAA,EAAW,WAAA,EAAa,KAAA,CAAA;AAAA,EACxB,OAAA;AAAA,EACA,cAAA,EAAgB,KAAA,CAAA;AAAA,EAChB,OAAA,EAAS,KAAA,CAAA;AAAA,EACT,eAAA,EAAiB,KAAA,CAAA;AAAA,EACjB,UAAA,EAAY,KAAA;AAAA,EACZ,gBAAA,EAAkB,KAAA,CAAA;AAAA,EAClB,kBAAA,EAAoB,KAAA,CAAA;AAAA,EACpB,OAAA,EAAS,KAAA,CAAA;AAAA,EACT,MAAA,EAAQ,KAAA;AACV,CAAA,EAAA,GAAoB;AAElB,EAAA,MAAM,SAAA,EAAW,eAAA,CAAgB,CAAA;AACjC,EAAA,MAAM,UAAA,EAAY,8CAAA,QAAqB,EAAU,UAAA,EAAY,SAAS,CAAA;AAEtE,EAAA,uBACE,8BAAA;AAAA,IAAC,gBAAA;AAAA,IAAA,6CAAA,8CAAA;AAAA,MACC,UAAA,EAAY,SAAA;AAAA,MACZ,SAAA;AAAA,MACA,eAAA;AAAA,MACA,MAAA,EAAO,IAAA;AAAA,MACP,iBAAA;AAAA,MACA,SAAA,EAAS;AAAA,IAAA,CAAA,EAEJ,eAAA,EACD,EAAE,MAAA,EAAQ,cAAA,CAAe,IAAA,EAAM,YAAA,EAAc,cAAA,CAAe,QAAQ,EAAA,EACpE,CAAC,CAAA,CAAA,EAVN;AAAA,MAYC,QAAA,EAAA;AAAA,wBAAA,6BAAA,uBAAC,EAAA,EAAe,aAAA,EAAa,MAAA,EAG3B,QAAA,kBAAA,6BAAA,QAAC,EAAA,EAAQ,SAAA,CAAS,EAAA,CACpB,CAAA;AAAA,wBACA,8BAAA,uBAAC,EAAA,EAAe,aAAA,EAAa,aAAA,EAC1B,QAAA,EAAA;AAAA,UAAA,MAAA,mBACC,8BAAA,KAAC,EAAA,EAAI,SAAA,EAAW,SAAA,CAAU,MAAA,EACvB,QAAA,EAAA;AAAA,YAAA,KAAA;AAAA,4BACD,6BAAA,IAAC,EAAA,CAAA,CAAG;AAAA,UAAA,EAAA,CACN,CAAA;AAAA,0BAEF,6BAAA,sCAAC,EAAA,EAAa,SAAA,EAAW,SAAA,CAAU,IAAA,EAAO,QAAA,EAAA,QAAA,CAAQ,CAAA;AAAA,UACjD,OAAA,mBACC,8BAAA,KAAC,EAAA,EAAI,SAAA,EAAW,SAAA,CAAU,MAAA,EACxB,QAAA,EAAA;AAAA,4BAAA,6BAAA,IAAC,EAAA,CAAA,CAAG,CAAA;AAAA,YACH;AAAA,UAAA,EAAA,CACH;AAAA,QAAA,EAAA,CAEJ;AAAA,MAAA;AAAA,IAAA,CAAA;AAAA,EACF,CAAA;AAEJ,CAAA;ADzCA;AACA;AE1DA,IAAOA,iBAAAA,EAAQ,eAAA;AF4Df;AACA;AACE;AACA;AACF,uFAAC","file":"/home/runner/work/pixels/pixels/packages/pixels/dist/chunk-C4H5ZCTV.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { PopoverProps as HeroPopoverProps } from '@heroui/popover';\nimport type { ReactNode } from 'react';\n\nimport { Popover, PopoverContent, PopoverTrigger } from '@heroui/popover';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport ScrollShadow from '../ScrollShadow/ScrollShadow';\n\n// popover styling variants\nexport const popoverVariants = tv({\n slots: {\n body: 'w-full px-2.5 py-1',\n content: 'flex max-h-[80vh] flex-col p-0',\n footer: 'w-full px-2.5 py-1',\n header: 'w-full px-2.5 py-1',\n trigger: '',\n },\n});\n\ntype VariantProps = TVProps<typeof popoverVariants>;\ntype ClassName = TVClassName<typeof popoverVariants>;\n\nexport interface PopoverProps extends VariantProps {\n /** child components */\n children?: ReactNode;\n /** CSS class name */\n className?: ClassName;\n /** content of the popover */\n content: ReactNode;\n /** HTML data-testid attribute used in e2e tests */\n contentTestId?: string;\n /** popover footer */\n footer?: ReactNode;\n /** use as controlled component */\n openControlled?: { open: boolean; setOpen: (open: boolean) => void };\n /** placement of the popover relative to its trigger reference */\n placement?: HeroPopoverProps['placement'];\n /** The container element in which the overlay portal will be placed. */\n portalContainer?: HeroPopoverProps['portalContainer'];\n /** Whether to block scrolling outside the popover */\n shouldBlockScroll?: boolean;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n /** popover title */\n title?: ReactNode;\n}\n\n/**\n * Popover component based on [HeroUI Card](https://www.heroui.com//docs/components/popover)\n */\nexport default ({\n children = null,\n className: _className = undefined,\n content,\n contentTestId = undefined,\n footer = undefined,\n openControlled = undefined,\n placement = 'top',\n portalContainer = undefined,\n shouldBlockScroll = undefined,\n testId = undefined,\n title = undefined,\n}: PopoverProps) => {\n // className from slots\n const variants = popoverVariants();\n const className = variantsToClassNames(variants, _className, 'trigger');\n\n return (\n <Popover\n classNames={className}\n placement={placement}\n portalContainer={portalContainer}\n radius=\"sm\"\n shouldBlockScroll={shouldBlockScroll}\n showArrow\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...(openControlled\n ? { isOpen: openControlled.open, onOpenChange: openControlled.setOpen }\n : {})}\n >\n <PopoverTrigger data-testid={testId}>\n {/* NOTE: type and aria properties are injected by PopoverTrigger */}\n {/* eslint-disable-next-line react/button-has-type */}\n <button>{children}</button>\n </PopoverTrigger>\n <PopoverContent data-testid={contentTestId}>\n {title && (\n <div className={className.header}>\n {title}\n <hr />\n </div>\n )}\n <ScrollShadow className={className.body}>{content}</ScrollShadow>\n {footer && (\n <div className={className.footer}>\n <hr />\n {footer}\n </div>\n )}\n </PopoverContent>\n </Popover>\n );\n};\n","import Popover from './Popover';\n\nexport type { PopoverProps } from './Popover';\n\nexport { Popover };\n\nexport default Popover;\n"]}
|