@vuu-ui/vuu-popups 0.13.25 → 0.13.27

package/cjs/index.js

@@ -1,12 +1,10 @@
 'use strict';
 
 var useDialog = require('./dialog/useDialog.js');
-var DialogHeader = require('./dialog-header/DialogHeader.js');
 var Popup = require('./popup/Popup.js');
 var useAnchoredPosition = require('./popup/useAnchoredPosition.js');
 var PopupMenu = require('./popup-menu/PopupMenu.js');
 var Portal = require('./portal/Portal.js');
-var Prompt = require('./prompt/Prompt.js');
 var Tooltip = require('./tooltip/Tooltip.js');
 var useTooltip = require('./tooltip/useTooltip.js');
 var NotificationsProvider = require('./notifications/NotificationsProvider.js');
@@ -17,12 +15,10 @@ var ToastNotification = require('./notifications/ToastNotification.js');
 exports.DialogProvider = useDialog.DialogProvider;
 exports.useDialog = useDialog.useDialog;
 exports.useDialogContext = useDialog.useDialogContext;
-exports.DialogHeader = DialogHeader.DialogHeader;
 exports.PopupComponent = Popup.PopupComponent;
 exports.useAnchoredPosition = useAnchoredPosition.useAnchoredPosition;
 exports.PopupMenu = PopupMenu.PopupMenu;
 exports.Portal = Portal.Portal;
-exports.Prompt = Prompt.Prompt;
 exports.Tooltip = Tooltip.Tooltip;
 exports.useTooltip = useTooltip.useTooltip;
 exports.NotificationsProvider = NotificationsProvider.NotificationsProvider;

package/cjs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;"}

package/esm/index.js

@@ -1,10 +1,8 @@
 export { DialogProvider, useDialog, useDialogContext } from './dialog/useDialog.js';
-export { DialogHeader } from './dialog-header/DialogHeader.js';
 export { PopupComponent } from './popup/Popup.js';
 export { useAnchoredPosition } from './popup/useAnchoredPosition.js';
 export { PopupMenu } from './popup-menu/PopupMenu.js';
 export { Portal } from './portal/Portal.js';
-export { Prompt } from './prompt/Prompt.js';
 export { Tooltip } from './tooltip/Tooltip.js';
 export { useTooltip } from './tooltip/useTooltip.js';
 export { NotificationsProvider, useNotifications } from './notifications/NotificationsProvider.js';

package/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.13.25",
+  "version": "0.13.27",
   "description": "VUU popup components - Context Menu, Dialog etc",
   "author": "heswell",
   "license": "Apache-2.0",
@@ -7,11 +7,11 @@
     "@salt-ds/core": "1.43.0",
     "@salt-ds/styles": "0.2.1",
     "@salt-ds/window": "0.1.1",
-    "@vuu-ui/vuu-context-menu": "0.13.25",
-    "@vuu-ui/vuu-data-types": "0.13.25",
-    "@vuu-ui/vuu-layout": "0.13.25",
-    "@vuu-ui/vuu-utils": "0.13.25",
-    "@vuu-ui/vuu-ui-controls": "0.13.25"
+    "@vuu-ui/vuu-context-menu": "0.13.27",
+    "@vuu-ui/vuu-data-types": "0.13.27",
+    "@vuu-ui/vuu-layout": "0.13.27",
+    "@vuu-ui/vuu-utils": "0.13.27",
+    "@vuu-ui/vuu-ui-controls": "0.13.27"
   },
   "peerDependencies": {
     "clsx": "^2.0.0",

package/types/index.d.ts

@@ -1,8 +1,6 @@
 export * from "./dialog";
-export * from "./dialog-header";
 export * from "./popup";
 export * from "./popup-menu";
 export * from "./portal";
-export * from "./prompt";
 export * from "./tooltip";
 export * from "./notifications";

package/cjs/dialog-header/DialogHeader.css.js

@@ -1,6 +0,0 @@
-'use strict';
-
-var dialogHeaderCss = ".vuuDialogHeader {\n    --saltButton-height: 28px;\n    --saltButton-width: 28px;\n    --saltToolbar-background: transparent;\n    --saltToolbar-height: calc(var(--salt-size-base) + 5px);\n    --vuuToolbarProxy-height: 22px;\n    --salt-text-fontFamily: Nunito Sans A-Variant, sans-serif;\n\n    align-items: center;\n    display: flex;\n    color: var(--light-text-primary, #15171B);\n    flex: 0 0 var(--vuuDialogHeader-height, var()--salt-size-base);\n    font-feature-settings: 'ss02' on, 'ss01' on, 'salt' on, 'liga' off;\n    font-size: 16px;\n    font-weight: 600;\n    justify-content: space-between;\n}\n  \n.vuuDialogHeader > .Responsive-inner {\n    align-items: center;\n}\n  \n.vuuDialogHeader > .Responsive-inner > :last-child{\n    right: 2px;\n}\n  \n  ";
-
-module.exports = dialogHeaderCss;
-//# sourceMappingURL=DialogHeader.css.js.map

package/cjs/dialog-header/DialogHeader.css.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DialogHeader.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/cjs/dialog-header/DialogHeader.js

@@ -1,38 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var core = require('@salt-ds/core');
-var styles = require('@salt-ds/styles');
-var window = require('@salt-ds/window');
-var DialogHeader$1 = require('./DialogHeader.css.js');
-
-const classBase = "vuuDialogHeader";
-const DialogHeader = ({
-  hideCloseButton = false,
-  title,
-  onClose,
-  ...htmlAttributes
-}) => {
-  const targetWindow = window.useWindow();
-  styles.useComponentCssInjection({
-    testId: "vuu-dialoh-header",
-    css: DialogHeader$1,
-    window: targetWindow
-  });
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { ...htmlAttributes, className: classBase, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(core.Text, { className: "dialogHeader", children: title }),
-    !hideCloseButton && /* @__PURE__ */ jsxRuntime.jsx(
-      core.Button,
-      {
-        onClick: onClose,
-        "data-align": "end",
-        "data-icon": "close",
-        variant: "secondary"
-      },
-      "close"
-    )
-  ] });
-};
-
-exports.DialogHeader = DialogHeader;
-//# sourceMappingURL=DialogHeader.js.map

package/cjs/dialog-header/DialogHeader.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DialogHeader.js","sources":["../../../../packages/vuu-popups/src/dialog-header/DialogHeader.tsx"],"sourcesContent":["import { Button, Text } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { HTMLAttributes } from \"react\";\n\nimport dialogHeaderCss from \"./DialogHeader.css\";\n\nconst classBase = \"vuuDialogHeader\";\n\nexport interface DialogHeaderProps extends HTMLAttributes<HTMLDivElement> {\n  hideCloseButton?: boolean;\n  onClose: () => void;\n}\n\nexport const DialogHeader = ({\n  hideCloseButton = false,\n  title,\n  onClose,\n  ...htmlAttributes\n}: DialogHeaderProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-dialoh-header\",\n    css: dialogHeaderCss,\n    window: targetWindow,\n  });\n\n  return (\n    <div {...htmlAttributes} className={classBase}>\n      <Text className=\"dialogHeader\">{title}</Text>\n      {!hideCloseButton && (\n        <Button\n          key=\"close\"\n          onClick={onClose}\n          data-align=\"end\"\n          data-icon=\"close\"\n          variant=\"secondary\"\n        />\n      )}\n    </div>\n  );\n};\n"],"names":["useWindow","useComponentCssInjection","dialogHeaderCss","jsxs","jsx","Text","Button"],"mappings":";;;;;;;;AAOA,MAAM,SAAY,GAAA,iBAAA;AAOX,MAAM,eAAe,CAAC;AAAA,EAC3B,eAAkB,GAAA,KAAA;AAAA,EAClB,KAAA;AAAA,EACA,OAAA;AAAA,EACA,GAAG;AACL,CAAyB,KAAA;AACvB,EAAA,MAAM,eAAeA,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,mBAAA;AAAA,IACR,GAAK,EAAAC,cAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,uBACGC,eAAA,CAAA,KAAA,EAAA,EAAK,GAAG,cAAA,EAAgB,WAAW,SAClC,EAAA,QAAA,EAAA;AAAA,oBAACC,cAAA,CAAAC,SAAA,EAAA,EAAK,SAAU,EAAA,cAAA,EAAgB,QAAM,EAAA,KAAA,EAAA,CAAA;AAAA,IACrC,CAAC,eACA,oBAAAD,cAAA;AAAA,MAACE,WAAA;AAAA,MAAA;AAAA,QAEC,OAAS,EAAA,OAAA;AAAA,QACT,YAAW,EAAA,KAAA;AAAA,QACX,WAAU,EAAA,OAAA;AAAA,QACV,OAAQ,EAAA;AAAA,OAAA;AAAA,MAJJ;AAAA;AAKN,GAEJ,EAAA,CAAA;AAEJ;;;;"}

package/cjs/prompt/Prompt.css.js

@@ -1,6 +0,0 @@
-'use strict';
-
-var propmtCss = ".vuuPrompt {\n    --saltButton-padding: var(--prompt-padding);\n    --saltButton-width: auto;\n    --border-width: var(--vuuPrompt-borderWidth, 1px);\n    --border-color: var(--vuuPrompt-borderColor, var(--vuu-color-purple-10));\n    --prompt-padding: 16px;\n    --variant-color: inherit;\n    --vuu-icon-color: var(--vuu-color-gray-80);\n    --vuu-icon-left: 6px;\n    --vuu-icon-size: 24px;\n\n    background-color: var(--salt-container-primary-background);\n    border-color: var(--border-color);\n    border-radius:4px;\n    border-style: solid;\n    border-width: var(--border-width);\n    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);\n    margin: 0;\n    padding: 0;\n    position: absolute;\n}\n\n.vuuPrompt-warn {\n    --border-color: var(--vuu-color-yellow-20);\n    --variant-color: var(--vuu-color-yellow-20);\n}\n\n.vuuPrompt-form {\n    display: flex;\n    flex-direction: column;\n}\n\n.vuuPrompt-header {\n    align-items: center;\n    background-color: var(--variant-color);\n    display: flex;\n    flex: 0 0 32px;  \n    font-size: 16px;\n    font-weight: 700;\n    padding: 0 var(--prompt-padding);  \n}\n\n.vuuPrompt-header[data-icon]{\n    padding-left: 36px;\n}\n\n\n.vuuPrompt-text {\n    flex: 1 1 auto;\n    padding: var(--prompt-padding);\n\n}\n.vuuPrompt-buttonBar {\n    align-items: flex-end;\n    display: flex;\n    flex: 0 0 32px;\n    gap: 6px;\n    justify-content: flex-end;\n    padding: 0 var(--prompt-padding) var(--prompt-padding) var(--prompt-padding);  \n\n}";
-
-module.exports = propmtCss;
-//# sourceMappingURL=Prompt.css.js.map

package/cjs/prompt/Prompt.css.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Prompt.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/cjs/prompt/Prompt.js

@@ -1,83 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var vuuUtils = require('@vuu-ui/vuu-utils');
-var core = require('@salt-ds/core');
-var styles = require('@salt-ds/styles');
-var window = require('@salt-ds/window');
-var cx = require('clsx');
-var React = require('react');
-var useAnchoredPosition = require('../popup/useAnchoredPosition.js');
-var Prompt$1 = require('./Prompt.css.js');
-
-const classBase = "vuuPrompt";
-const AnchorBody = { current: document.body };
-const EMPTY_PROPS = {};
-const Prompt = ({
-  PopupProps = EMPTY_PROPS,
-  cancelButtonLabel = "Cancel",
-  confirmButtonLabel = "Confirm",
-  icon,
-  onCancel,
-  onConfirm,
-  style,
-  text,
-  title,
-  variant = "info",
-  ...htmlAttributes
-}) => {
-  const {
-    anchorElement = AnchorBody,
-    offsetLeft = 0,
-    offsetTop = 0,
-    placement = "below"
-  } = PopupProps;
-  const targetWindow = window.useWindow();
-  styles.useComponentCssInjection({
-    testId: "vuu-prompt",
-    css: Prompt$1,
-    window: targetWindow
-  });
-  const [themeClass, _, dataMode] = vuuUtils.useThemeAttributes();
-  const { position } = useAnchoredPosition.useAnchoredPosition({
-    anchorElement,
-    offsetLeft,
-    offsetTop,
-    placement
-  });
-  const rootRef = React.useRef(null);
-  const confirmRef = React.useRef(null);
-  React.useLayoutEffect(() => {
-    if (rootRef.current) {
-      rootRef.current.showModal();
-      if (confirmRef.current) {
-        confirmRef.current.focus();
-      }
-      if (placement.endsWith("center")) {
-        const { width } = rootRef.current.getBoundingClientRect();
-        rootRef.current.style.marginLeft = `-${width / 2}px`;
-      }
-    }
-  }, [placement]);
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "dialog",
-    {
-      ...htmlAttributes,
-      className: cx(classBase, `${classBase}-${variant}`, themeClass),
-      "data-mode": dataMode,
-      ref: rootRef,
-      style: { ...style, ...position },
-      children: /* @__PURE__ */ jsxRuntime.jsxs("form", { className: `${classBase}-form`, children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${classBase}-header`, "data-icon": icon, children: title }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${classBase}-text`, children: text }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${classBase}-buttonBar`, children: [
-          /* @__PURE__ */ jsxRuntime.jsx(core.Button, { onClick: onCancel, variant: "secondary", children: cancelButtonLabel }),
-          /* @__PURE__ */ jsxRuntime.jsx(core.Button, { onClick: onConfirm, ref: confirmRef, value: "default", children: confirmButtonLabel })
-        ] })
-      ] })
-    }
-  );
-};
-
-exports.Prompt = Prompt;
-//# sourceMappingURL=Prompt.js.map

package/cjs/prompt/Prompt.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Prompt.js","sources":["../../../../packages/vuu-popups/src/prompt/Prompt.tsx"],"sourcesContent":["import { useThemeAttributes } from \"@vuu-ui/vuu-utils\";\nimport { Button } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport { HTMLAttributes, useLayoutEffect, useRef } from \"react\";\nimport { PopupComponentProps, useAnchoredPosition } from \"../popup\";\n\nimport propmtCss from \"./Prompt.css\";\n\nconst classBase = \"vuuPrompt\";\n\nconst AnchorBody = { current: document.body };\n\nconst EMPTY_PROPS = {};\n\nexport interface PromptProps extends HTMLAttributes<HTMLDialogElement> {\n  PopupProps?: Partial<PopupComponentProps>;\n  cancelButtonLabel?: string;\n  confirmButtonLabel?: string;\n  onCancel: () => void;\n  onConfirm: () => void;\n  icon?: string;\n  text: string;\n  variant?: \"warn\" | \"error\" | \"info\";\n}\n\nexport const Prompt = ({\n  PopupProps = EMPTY_PROPS,\n  cancelButtonLabel = \"Cancel\",\n  confirmButtonLabel = \"Confirm\",\n  icon,\n  onCancel,\n  onConfirm,\n  style,\n  text,\n  title,\n  variant = \"info\",\n  ...htmlAttributes\n}: PromptProps) => {\n  const {\n    anchorElement = AnchorBody,\n    offsetLeft = 0,\n    offsetTop = 0,\n    placement = \"below\",\n  } = PopupProps;\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-prompt\",\n    css: propmtCss,\n    window: targetWindow,\n  });\n\n  const [themeClass, _, dataMode] = useThemeAttributes();\n  const { position } = useAnchoredPosition({\n    anchorElement,\n    offsetLeft,\n    offsetTop,\n    placement,\n  });\n  const rootRef = useRef<HTMLDialogElement>(null);\n  const confirmRef = useRef<HTMLButtonElement>(null);\n\n  useLayoutEffect(() => {\n    if (rootRef.current) {\n      rootRef.current.showModal();\n      if (confirmRef.current) {\n        confirmRef.current.focus();\n      }\n      if (placement.endsWith(\"center\")) {\n        const { width } = rootRef.current.getBoundingClientRect();\n        rootRef.current.style.marginLeft = `-${width / 2}px`;\n      }\n    }\n  }, [placement]);\n\n  return (\n    <dialog\n      {...htmlAttributes}\n      className={cx(classBase, `${classBase}-${variant}`, themeClass)}\n      data-mode={dataMode}\n      ref={rootRef}\n      style={{ ...style, ...position }}\n    >\n      <form className={`${classBase}-form`}>\n        <div className={`${classBase}-header`} data-icon={icon}>\n          {title}\n        </div>\n        <div className={`${classBase}-text`}>{text}</div>\n        <div className={`${classBase}-buttonBar`}>\n          <Button onClick={onCancel} variant=\"secondary\">\n            {cancelButtonLabel}\n          </Button>\n          <Button onClick={onConfirm} ref={confirmRef} value=\"default\">\n            {confirmButtonLabel}\n          </Button>\n        </div>\n      </form>\n    </dialog>\n  );\n};\n"],"names":["useWindow","useComponentCssInjection","propmtCss","useThemeAttributes","useAnchoredPosition","useRef","useLayoutEffect","jsx","jsxs","Button"],"mappings":"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"}

package/esm/dialog-header/DialogHeader.css.js

@@ -1,4 +0,0 @@
-var dialogHeaderCss = ".vuuDialogHeader {\n    --saltButton-height: 28px;\n    --saltButton-width: 28px;\n    --saltToolbar-background: transparent;\n    --saltToolbar-height: calc(var(--salt-size-base) + 5px);\n    --vuuToolbarProxy-height: 22px;\n    --salt-text-fontFamily: Nunito Sans A-Variant, sans-serif;\n\n    align-items: center;\n    display: flex;\n    color: var(--light-text-primary, #15171B);\n    flex: 0 0 var(--vuuDialogHeader-height, var()--salt-size-base);\n    font-feature-settings: 'ss02' on, 'ss01' on, 'salt' on, 'liga' off;\n    font-size: 16px;\n    font-weight: 600;\n    justify-content: space-between;\n}\n  \n.vuuDialogHeader > .Responsive-inner {\n    align-items: center;\n}\n  \n.vuuDialogHeader > .Responsive-inner > :last-child{\n    right: 2px;\n}\n  \n  ";
-
-export { dialogHeaderCss as default };
-//# sourceMappingURL=DialogHeader.css.js.map

package/esm/dialog-header/DialogHeader.css.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DialogHeader.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/esm/dialog-header/DialogHeader.js

@@ -1,36 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { Text, Button } from '@salt-ds/core';
-import { useComponentCssInjection } from '@salt-ds/styles';
-import { useWindow } from '@salt-ds/window';
-import dialogHeaderCss from './DialogHeader.css.js';
-
-const classBase = "vuuDialogHeader";
-const DialogHeader = ({
-  hideCloseButton = false,
-  title,
-  onClose,
-  ...htmlAttributes
-}) => {
-  const targetWindow = useWindow();
-  useComponentCssInjection({
-    testId: "vuu-dialoh-header",
-    css: dialogHeaderCss,
-    window: targetWindow
-  });
-  return /* @__PURE__ */ jsxs("div", { ...htmlAttributes, className: classBase, children: [
-    /* @__PURE__ */ jsx(Text, { className: "dialogHeader", children: title }),
-    !hideCloseButton && /* @__PURE__ */ jsx(
-      Button,
-      {
-        onClick: onClose,
-        "data-align": "end",
-        "data-icon": "close",
-        variant: "secondary"
-      },
-      "close"
-    )
-  ] });
-};
-
-export { DialogHeader };
-//# sourceMappingURL=DialogHeader.js.map

package/esm/dialog-header/DialogHeader.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DialogHeader.js","sources":["../../../../packages/vuu-popups/src/dialog-header/DialogHeader.tsx"],"sourcesContent":["import { Button, Text } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { HTMLAttributes } from \"react\";\n\nimport dialogHeaderCss from \"./DialogHeader.css\";\n\nconst classBase = \"vuuDialogHeader\";\n\nexport interface DialogHeaderProps extends HTMLAttributes<HTMLDivElement> {\n  hideCloseButton?: boolean;\n  onClose: () => void;\n}\n\nexport const DialogHeader = ({\n  hideCloseButton = false,\n  title,\n  onClose,\n  ...htmlAttributes\n}: DialogHeaderProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-dialoh-header\",\n    css: dialogHeaderCss,\n    window: targetWindow,\n  });\n\n  return (\n    <div {...htmlAttributes} className={classBase}>\n      <Text className=\"dialogHeader\">{title}</Text>\n      {!hideCloseButton && (\n        <Button\n          key=\"close\"\n          onClick={onClose}\n          data-align=\"end\"\n          data-icon=\"close\"\n          variant=\"secondary\"\n        />\n      )}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;AAOA,MAAM,SAAY,GAAA,iBAAA;AAOX,MAAM,eAAe,CAAC;AAAA,EAC3B,eAAkB,GAAA,KAAA;AAAA,EAClB,KAAA;AAAA,EACA,OAAA;AAAA,EACA,GAAG;AACL,CAAyB,KAAA;AACvB,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,mBAAA;AAAA,IACR,GAAK,EAAA,eAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,uBACG,IAAA,CAAA,KAAA,EAAA,EAAK,GAAG,cAAA,EAAgB,WAAW,SAClC,EAAA,QAAA,EAAA;AAAA,oBAAC,GAAA,CAAA,IAAA,EAAA,EAAK,SAAU,EAAA,cAAA,EAAgB,QAAM,EAAA,KAAA,EAAA,CAAA;AAAA,IACrC,CAAC,eACA,oBAAA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QAEC,OAAS,EAAA,OAAA;AAAA,QACT,YAAW,EAAA,KAAA;AAAA,QACX,WAAU,EAAA,OAAA;AAAA,QACV,OAAQ,EAAA;AAAA,OAAA;AAAA,MAJJ;AAAA;AAKN,GAEJ,EAAA,CAAA;AAEJ;;;;"}

package/esm/prompt/Prompt.css.js

@@ -1,4 +0,0 @@
-var propmtCss = ".vuuPrompt {\n    --saltButton-padding: var(--prompt-padding);\n    --saltButton-width: auto;\n    --border-width: var(--vuuPrompt-borderWidth, 1px);\n    --border-color: var(--vuuPrompt-borderColor, var(--vuu-color-purple-10));\n    --prompt-padding: 16px;\n    --variant-color: inherit;\n    --vuu-icon-color: var(--vuu-color-gray-80);\n    --vuu-icon-left: 6px;\n    --vuu-icon-size: 24px;\n\n    background-color: var(--salt-container-primary-background);\n    border-color: var(--border-color);\n    border-radius:4px;\n    border-style: solid;\n    border-width: var(--border-width);\n    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);\n    margin: 0;\n    padding: 0;\n    position: absolute;\n}\n\n.vuuPrompt-warn {\n    --border-color: var(--vuu-color-yellow-20);\n    --variant-color: var(--vuu-color-yellow-20);\n}\n\n.vuuPrompt-form {\n    display: flex;\n    flex-direction: column;\n}\n\n.vuuPrompt-header {\n    align-items: center;\n    background-color: var(--variant-color);\n    display: flex;\n    flex: 0 0 32px;  \n    font-size: 16px;\n    font-weight: 700;\n    padding: 0 var(--prompt-padding);  \n}\n\n.vuuPrompt-header[data-icon]{\n    padding-left: 36px;\n}\n\n\n.vuuPrompt-text {\n    flex: 1 1 auto;\n    padding: var(--prompt-padding);\n\n}\n.vuuPrompt-buttonBar {\n    align-items: flex-end;\n    display: flex;\n    flex: 0 0 32px;\n    gap: 6px;\n    justify-content: flex-end;\n    padding: 0 var(--prompt-padding) var(--prompt-padding) var(--prompt-padding);  \n\n}";
-
-export { propmtCss as default };
-//# sourceMappingURL=Prompt.css.js.map

package/esm/prompt/Prompt.css.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Prompt.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/esm/prompt/Prompt.js

@@ -1,81 +0,0 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { useThemeAttributes } from '@vuu-ui/vuu-utils';
-import { Button } from '@salt-ds/core';
-import { useComponentCssInjection } from '@salt-ds/styles';
-import { useWindow } from '@salt-ds/window';
-import cx from 'clsx';
-import { useRef, useLayoutEffect } from 'react';
-import { useAnchoredPosition } from '../popup/useAnchoredPosition.js';
-import propmtCss from './Prompt.css.js';
-
-const classBase = "vuuPrompt";
-const AnchorBody = { current: document.body };
-const EMPTY_PROPS = {};
-const Prompt = ({
-  PopupProps = EMPTY_PROPS,
-  cancelButtonLabel = "Cancel",
-  confirmButtonLabel = "Confirm",
-  icon,
-  onCancel,
-  onConfirm,
-  style,
-  text,
-  title,
-  variant = "info",
-  ...htmlAttributes
-}) => {
-  const {
-    anchorElement = AnchorBody,
-    offsetLeft = 0,
-    offsetTop = 0,
-    placement = "below"
-  } = PopupProps;
-  const targetWindow = useWindow();
-  useComponentCssInjection({
-    testId: "vuu-prompt",
-    css: propmtCss,
-    window: targetWindow
-  });
-  const [themeClass, _, dataMode] = useThemeAttributes();
-  const { position } = useAnchoredPosition({
-    anchorElement,
-    offsetLeft,
-    offsetTop,
-    placement
-  });
-  const rootRef = useRef(null);
-  const confirmRef = useRef(null);
-  useLayoutEffect(() => {
-    if (rootRef.current) {
-      rootRef.current.showModal();
-      if (confirmRef.current) {
-        confirmRef.current.focus();
-      }
-      if (placement.endsWith("center")) {
-        const { width } = rootRef.current.getBoundingClientRect();
-        rootRef.current.style.marginLeft = `-${width / 2}px`;
-      }
-    }
-  }, [placement]);
-  return /* @__PURE__ */ jsx(
-    "dialog",
-    {
-      ...htmlAttributes,
-      className: cx(classBase, `${classBase}-${variant}`, themeClass),
-      "data-mode": dataMode,
-      ref: rootRef,
-      style: { ...style, ...position },
-      children: /* @__PURE__ */ jsxs("form", { className: `${classBase}-form`, children: [
-        /* @__PURE__ */ jsx("div", { className: `${classBase}-header`, "data-icon": icon, children: title }),
-        /* @__PURE__ */ jsx("div", { className: `${classBase}-text`, children: text }),
-        /* @__PURE__ */ jsxs("div", { className: `${classBase}-buttonBar`, children: [
-          /* @__PURE__ */ jsx(Button, { onClick: onCancel, variant: "secondary", children: cancelButtonLabel }),
-          /* @__PURE__ */ jsx(Button, { onClick: onConfirm, ref: confirmRef, value: "default", children: confirmButtonLabel })
-        ] })
-      ] })
-    }
-  );
-};
-
-export { Prompt };
-//# sourceMappingURL=Prompt.js.map

package/esm/prompt/Prompt.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Prompt.js","sources":["../../../../packages/vuu-popups/src/prompt/Prompt.tsx"],"sourcesContent":["import { useThemeAttributes } from \"@vuu-ui/vuu-utils\";\nimport { Button } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport { HTMLAttributes, useLayoutEffect, useRef } from \"react\";\nimport { PopupComponentProps, useAnchoredPosition } from \"../popup\";\n\nimport propmtCss from \"./Prompt.css\";\n\nconst classBase = \"vuuPrompt\";\n\nconst AnchorBody = { current: document.body };\n\nconst EMPTY_PROPS = {};\n\nexport interface PromptProps extends HTMLAttributes<HTMLDialogElement> {\n  PopupProps?: Partial<PopupComponentProps>;\n  cancelButtonLabel?: string;\n  confirmButtonLabel?: string;\n  onCancel: () => void;\n  onConfirm: () => void;\n  icon?: string;\n  text: string;\n  variant?: \"warn\" | \"error\" | \"info\";\n}\n\nexport const Prompt = ({\n  PopupProps = EMPTY_PROPS,\n  cancelButtonLabel = \"Cancel\",\n  confirmButtonLabel = \"Confirm\",\n  icon,\n  onCancel,\n  onConfirm,\n  style,\n  text,\n  title,\n  variant = \"info\",\n  ...htmlAttributes\n}: PromptProps) => {\n  const {\n    anchorElement = AnchorBody,\n    offsetLeft = 0,\n    offsetTop = 0,\n    placement = \"below\",\n  } = PopupProps;\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-prompt\",\n    css: propmtCss,\n    window: targetWindow,\n  });\n\n  const [themeClass, _, dataMode] = useThemeAttributes();\n  const { position } = useAnchoredPosition({\n    anchorElement,\n    offsetLeft,\n    offsetTop,\n    placement,\n  });\n  const rootRef = useRef<HTMLDialogElement>(null);\n  const confirmRef = useRef<HTMLButtonElement>(null);\n\n  useLayoutEffect(() => {\n    if (rootRef.current) {\n      rootRef.current.showModal();\n      if (confirmRef.current) {\n        confirmRef.current.focus();\n      }\n      if (placement.endsWith(\"center\")) {\n        const { width } = rootRef.current.getBoundingClientRect();\n        rootRef.current.style.marginLeft = `-${width / 2}px`;\n      }\n    }\n  }, [placement]);\n\n  return (\n    <dialog\n      {...htmlAttributes}\n      className={cx(classBase, `${classBase}-${variant}`, themeClass)}\n      data-mode={dataMode}\n      ref={rootRef}\n      style={{ ...style, ...position }}\n    >\n      <form className={`${classBase}-form`}>\n        <div className={`${classBase}-header`} data-icon={icon}>\n          {title}\n        </div>\n        <div className={`${classBase}-text`}>{text}</div>\n        <div className={`${classBase}-buttonBar`}>\n          <Button onClick={onCancel} variant=\"secondary\">\n            {cancelButtonLabel}\n          </Button>\n          <Button onClick={onConfirm} ref={confirmRef} value=\"default\">\n            {confirmButtonLabel}\n          </Button>\n        </div>\n      </form>\n    </dialog>\n  );\n};\n"],"names":[],"mappings":"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"}

package/types/dialog-header/DialogHeader.d.ts

@@ -1,6 +0,0 @@
-import { HTMLAttributes } from "react";
-export interface DialogHeaderProps extends HTMLAttributes<HTMLDivElement> {
-    hideCloseButton?: boolean;
-    onClose: () => void;
-}
-export declare const DialogHeader: ({ hideCloseButton, title, onClose, ...htmlAttributes }: DialogHeaderProps) => import("react/jsx-runtime").JSX.Element;

package/types/dialog-header/index.d.ts

@@ -1 +0,0 @@
-export * from "./DialogHeader";

package/types/prompt/Prompt.d.ts

@@ -1,13 +0,0 @@
-import { HTMLAttributes } from "react";
-import { PopupComponentProps } from "../popup";
-export interface PromptProps extends HTMLAttributes<HTMLDialogElement> {
-    PopupProps?: Partial<PopupComponentProps>;
-    cancelButtonLabel?: string;
-    confirmButtonLabel?: string;
-    onCancel: () => void;
-    onConfirm: () => void;
-    icon?: string;
-    text: string;
-    variant?: "warn" | "error" | "info";
-}
-export declare const Prompt: ({ PopupProps, cancelButtonLabel, confirmButtonLabel, icon, onCancel, onConfirm, style, text, title, variant, ...htmlAttributes }: PromptProps) => import("react/jsx-runtime").JSX.Element;

package/types/prompt/index.d.ts

@@ -1 +0,0 @@
-export * from "./Prompt";