@seeqdev/qomponents 0.0.205 → 0.0.207
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/index.esm.js +6 -5
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +6 -5
- package/dist/index.js.map +1 -1
- package/dist/styles.css +6 -9
- package/package.json +2 -2
package/dist/index.js
CHANGED
|
@@ -14603,12 +14603,13 @@ var classnames = {exports: {}};
|
|
|
14603
14603
|
var classnamesExports = classnames.exports;
|
|
14604
14604
|
var classNames = /*@__PURE__*/getDefaultExportFromCjs(classnamesExports);
|
|
14605
14605
|
|
|
14606
|
+
const CSS_TRANSITION_DURATION = process.env.NODE_ENV === 'test' ? 0 : 300; // Disable animations during testing
|
|
14606
14607
|
const Dialog = Root$4;
|
|
14607
14608
|
const DialogPortal = Portal$1;
|
|
14608
14609
|
const DialogClose = Close;
|
|
14609
|
-
const DialogContent = React.forwardRef(({ className, 'aria-describedby': ariaDescribedBy, children, ...props }, ref) => (jsxRuntime.jsxs(DialogPortal, { children: [jsxRuntime.jsx("div", { className: "tw:select-none tw:fixed tw:w-full tw:h-full tw:opacity-50 tw:inset-0 tw:z-[1009] tw:bg-sq-dark-background\n
|
|
14610
|
-
|
|
14611
|
-
|
|
14610
|
+
const DialogContent = React.forwardRef(({ className = '', 'aria-describedby': ariaDescribedBy, children, ...props }, ref) => (jsxRuntime.jsxs(DialogPortal, { children: [jsxRuntime.jsx("div", { className: "tw:select-none tw:fixed tw:w-full tw:h-full tw:opacity-50 tw:inset-0 tw:z-[1009] tw:bg-sq-dark-background\n tw:data-[state=open]:animate-in tw:data-[state=closed]:animate-out tw:data-[state=closed]:fade-out-0\n tw:data-[state=open]:fade-in-0" }), jsxRuntime.jsxs(Content$2, { ref: ref, "aria-describedby": ariaDescribedBy, className: `tw:fixed tw:left-[50%] tw:top-0 tw:my-6 tw:translate-x-[-50%] tw:z-[1010] tw:grid
|
|
14611
|
+
tw:gap-4 tw:border tw:bg-sq-white tw:dark:bg-sq-dark-background tw:duration-${CSS_TRANSITION_DURATION}
|
|
14612
|
+
tw:shadow-lg tw:rounded-lg ${className}`, ...props, children: [jsxRuntime.jsx(DialogTitle$1, { className: "tw:hidden" }), children] })] })));
|
|
14612
14613
|
DialogContent.displayName = Content$2.displayName;
|
|
14613
14614
|
const DialogHeader = (props) => (jsxRuntime.jsx("div", { className: "tw:w-full tw:justify-between", children: jsxRuntime.jsx("div", { ...props }) }));
|
|
14614
14615
|
DialogHeader.displayName = 'DialogHeader';
|
|
@@ -14651,12 +14652,12 @@ const Modal = ({ titleIcon, title = 'Modal title example', titleSuffixLabel, sub
|
|
|
14651
14652
|
titleIconElement = (jsxRuntime.jsx(Icon, { icon: titleIcon, testId: "modalTitleIcon", extraClassNames: "tw:flex tw:text-xl tw:mt-1" }));
|
|
14652
14653
|
}
|
|
14653
14654
|
else {
|
|
14654
|
-
titleIconElement = jsxRuntime.jsx("div", { className: "tw:mt-
|
|
14655
|
+
titleIconElement = jsxRuntime.jsx("div", { className: "tw:mt-2", children: titleIcon });
|
|
14655
14656
|
}
|
|
14656
14657
|
}
|
|
14657
14658
|
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [titleIcon && titleIconPosition === 'left' ? jsxRuntime.jsx("div", { className: "tw:flex tw:mr-2", children: titleIconElement }) : jsxRuntime.jsx(jsxRuntime.Fragment, {}), jsxRuntime.jsx(DialogTitle, { asChild: true, children: isTitleEditable ? (jsxRuntime.jsxs("div", { className: "tw:flex tw:w-full tw:items-center", children: [jsxRuntime.jsx(TextField, { extraClassNames: inputExtraClassNames, value: title, type: "text", testId: "modalTitle", onChange: onTitleChanged, placeholder: titlePlaceholder, required: titleRequired, showError: !!titleError }), titleError && jsxRuntime.jsx("p", { className: "tw:text-sq-danger tw:min-w-fit tw:pl-2 tw:mb-0", children: titleError })] })) : ((customHeader ?? (jsxRuntime.jsxs("div", { "data-testid": "modalTitle", className: "modal-title", children: [jsxRuntime.jsxs("div", { className: "tw:flex tw:items-center", children: [jsxRuntime.jsx("h3", { children: title }), titleSuffixLabel && jsxRuntime.jsx("span", { className: "tw:text-xl tw:pl-0.5", children: titleSuffixLabel })] }), subtitle && (jsxRuntime.jsx("div", { className: "tw:italic tw:text-sm tw:text-left tw:mt-1", "data-testid": "modal-subtitle", children: subtitle }))] })))) }), titleIcon && titleIconPosition === 'right' ? jsxRuntime.jsx("div", { className: "tw:flex tw:ml-4", children: titleIconElement }) : jsxRuntime.jsx(jsxRuntime.Fragment, {})] }));
|
|
14658
14659
|
};
|
|
14659
|
-
return open ? (jsxRuntime.jsx(Dialog, { open: true, onOpenChange: onClose, modal: keepFocusInsideModal, children: jsxRuntime.jsxs(DialogContent, { onPointerDownOutside: (e) => (onPointerDownOutside ? onPointerDownOutside(e) : e.preventDefault()), onInteractOutside: (e) => (onInteractOutside ? onInteractOutside(e) : e.preventDefault()), "data-testid": testId, "aria-describedby": ariaDescribedBy, className: classNames(`modalContent tw:w-full tw:
|
|
14660
|
+
return open ? (jsxRuntime.jsx(Dialog, { open: true, onOpenChange: onClose, modal: keepFocusInsideModal, children: jsxRuntime.jsxs(DialogContent, { onPointerDownOutside: (e) => (onPointerDownOutside ? onPointerDownOutside(e) : e.preventDefault()), onInteractOutside: (e) => (onInteractOutside ? onInteractOutside(e) : e.preventDefault()), "data-testid": testId, "aria-describedby": ariaDescribedBy, className: classNames(`modalContent tw:w-full tw:shadow-none tw:dark:text-sq-dark-text tw:gap-0! tw:border-0 tw:dark:border tw:dark:border-gray-500`, {
|
|
14660
14661
|
'tw:max-w-xs': size === 'xs',
|
|
14661
14662
|
'tw:max-w-sm': size === 'sm',
|
|
14662
14663
|
'tw:max-w-md': size === 'md',
|