@lightsparkdev/ui 0.0.7 → 0.0.9

package/dist/components/LightTooltip.d.cts

@@ -0,0 +1,9 @@
+import react__default, { ComponentProps } from 'react';
+import { Tooltip } from 'react-tooltip';
+
+type TooltipProps = Omit<ComponentProps<typeof Tooltip>, "id"> & {
+    id?: string | undefined;
+};
+declare function LightTooltip(props: TooltipProps): react__default.ReactPortal | null;
+
+export { LightTooltip };

package/dist/components/LightTooltip.d.ts

@@ -0,0 +1,9 @@
+import react__default, { ComponentProps } from 'react';
+import { Tooltip } from 'react-tooltip';
+
+type TooltipProps = Omit<ComponentProps<typeof Tooltip>, "id"> & {
+    id?: string | undefined;
+};
+declare function LightTooltip(props: TooltipProps): react__default.ReactPortal | null;
+
+export { LightTooltip };

package/dist/components/LightTooltip.js

@@ -0,0 +1,12 @@
+import {
+  LightTooltip
+} from "../chunk-3EVAP5JT.js";
+import "../chunk-55OQPFLF.js";
+import "../chunk-JK4BP73A.js";
+import "../chunk-2VBDEO6M.js";
+import "../chunk-E4EXM4SY.js";
+import "../chunk-JSGRNWSB.js";
+import "../chunk-CIGAQ47A.js";
+export {
+  LightTooltip
+};

package/dist/components/LightboxImage.cjs

@@ -53,13 +53,13 @@ var z = {
   navAction: 101,
   smNavAction: 100,
   // keep under navDropdown
-  tooltip: 160,
   notificationBanner: 170,
   qrReaderVideo: 180,
   qrReaderOverlay: 181,
   modalOverlay: 190,
   modalContainer: 191,
   dropdown: 192,
+  tooltip: 193,
   toast: 200
 };
 

package/dist/components/LightboxImage.js

@@ -1,8 +1,8 @@
 "use client";
 import {
   LightboxImage
-} from "../chunk-SVQELXFK.js";
-import "../chunk-CLU2FRJZ.js";
+} from "../chunk-Z5TPS2BO.js";
+import "../chunk-55OQPFLF.js";
 import "../chunk-CIGAQ47A.js";
 export {
   LightboxImage

package/dist/components/LightsparkProvider.cjs

@@ -1295,68 +1295,53 @@ function useThemeBg() {
 // src/styles/global.tsx
 var import_react5 = require("@emotion/react");
 var import_react6 = require("react");
-var import_react_tooltip2 = require("react-tooltip/dist/react-tooltip.css");
+var import_react_tooltip = require("react-tooltip/dist/react-tooltip.css");
 var import_fonts = require("../static/fonts.css");
 
 // src/styles/common.tsx
 var import_react4 = require("@emotion/react");
 var import_styled = __toESM(require("@emotion/styled"), 1);
-var import_react_tooltip = require("react-tooltip");
-
-// src/styles/z-index.tsx
-var z = {
-  card: 1,
-  fieldError: 1,
-  textInput: 2,
-  select: 3,
-  selectFocused: 4,
-  walletActionPreviewTopGradient: 1,
-  headerContainer: 99,
-  smBanner: 99,
-  headerTop: 100,
-  navMenu: 100,
-  smNavMenu: 100,
-  navAction: 101,
-  smNavAction: 100,
-  // keep under navDropdown
-  tooltip: 160,
-  notificationBanner: 170,
-  qrReaderVideo: 180,
-  qrReaderOverlay: 181,
-  modalOverlay: 190,
-  modalContainer: 191,
-  dropdown: 192,
-  toast: 200
-};
-
-// src/styles/common.tsx
 var rootFontSizePx = 12;
 var rootFontSizeRems = rootFontSizePx / 16;
 var standardLineHeightEms = 1.21;
-var standardContentInsetPx = 32;
-var standardContentInsetMdPx = 24;
-var standardContentInsetSmPx = 16;
-var smContentInset = import_react4.css`
-  ${bp.sm(`
-    margin-left: auto;
-    margin-right: auto;
-    width: calc(100% - ${standardContentInsetSmPx * 2}px);
-  `)}
-`;
-var minSmMaxLgContentInset = import_react4.css`
-  ${bp.minSmMaxLg(`
-    width: calc(100% - ${standardContentInsetMdPx * 2}px);
-  `)}
-`;
-var standardContentInset = import_react4.css`
-  margin-left: auto;
-  margin-right: auto;
-  width: calc(100% - ${standardContentInsetPx * 2}px);
-  max-width: 1280px;
-
-  ${smContentInset}
-  ${minSmMaxLgContentInset}
-`;
+function buildStandardContentInset(smPx, minSmMaxLgPx, lgPx) {
+  const smCSS = import_react4.css`
+    ${bp.sm(`
+      margin-left: auto;
+      margin-right: auto;
+      width: calc(100% - ${smPx * 2}px);
+    `)}
+  `;
+  const minSmMaxLgCSS = import_react4.css`
+    ${bp.minSmMaxLg(`
+      margin-left: auto;
+      margin-right: auto;
+      width: calc(100% - ${minSmMaxLgPx * 2}px);
+    `)}
+  `;
+  const lgCSS = import_react4.css`
+    ${bp.lg(`
+      margin-left: auto;
+      margin-right: auto;
+      width: calc(100% - ${lgPx * 2}px);
+      max-width: 1280px;
+    `)}
+  `;
+  return {
+    smPx,
+    minSmMaxLgPx,
+    lgPx,
+    smCSS,
+    minSmMaxLgCSS,
+    lgCSS,
+    css: import_react4.css`
+      ${lgCSS}
+      ${smCSS}
+      ${minSmMaxLgCSS}
+    `
+  };
+}
+var standardContentInset = buildStandardContentInset(16, 24, 32);
 var standardCardShadow = import_react4.css`
   box-shadow:
     0px 4px 10px 0px rgba(0, 0, 0, 0.08),
@@ -1376,9 +1361,6 @@ var Subtext = import_styled.default.div`
 var darkGradientBg = import_react4.css`
   background: ${darkGradient};
 `;
-var StyledTooltip = (0, import_styled.default)(import_react_tooltip.Tooltip)`
-  z-index: ${z.modalOverlay};
-`;
 
 // src/styles/constants.ts
 var cssVars = {
@@ -1479,6 +1461,8 @@ function GlobalStyles() {
     :root {
       ${cssVars.docHeight}: 100vh;
       --rt-opacity: 1 !important;
+      --rt-transition-show-delay: 0.15s !important;
+      --rt-transition-closing-delay: 0.2s !important;
     }
 
     html {

package/dist/components/LightsparkProvider.js

@@ -1,13 +1,12 @@
 import {
   LightsparkProvider
-} from "../chunk-2WYVO6B2.js";
-import "../chunk-T33SBHYI.js";
+} from "../chunk-H3RW6JSU.js";
+import "../chunk-KMR5C25B.js";
 import "../chunk-IJVWYT5G.js";
-import "../chunk-RFGKH3R6.js";
+import "../chunk-JK4BP73A.js";
 import "../chunk-2VBDEO6M.js";
 import "../chunk-E4EXM4SY.js";
 import "../chunk-JSGRNWSB.js";
-import "../chunk-CLU2FRJZ.js";
 import "../chunk-CIGAQ47A.js";
 export {
   LightsparkProvider

package/dist/components/Loading.cjs

@@ -80,7 +80,6 @@ var import_react5 = require("react");
 // src/styles/common.tsx
 var import_react4 = require("@emotion/react");
 var import_styled = __toESM(require("@emotion/styled"), 1);
-var import_react_tooltip = require("react-tooltip");
 
 // src/styles/breakpoints.tsx
 var import_react = require("@emotion/react");
@@ -1286,59 +1285,47 @@ function hexToRGB(hex) {
   ] : [0, 0, 0];
 }
 
-// src/styles/z-index.tsx
-var z = {
-  card: 1,
-  fieldError: 1,
-  textInput: 2,
-  select: 3,
-  selectFocused: 4,
-  walletActionPreviewTopGradient: 1,
-  headerContainer: 99,
-  smBanner: 99,
-  headerTop: 100,
-  navMenu: 100,
-  smNavMenu: 100,
-  navAction: 101,
-  smNavAction: 100,
-  // keep under navDropdown
-  tooltip: 160,
-  notificationBanner: 170,
-  qrReaderVideo: 180,
-  qrReaderOverlay: 181,
-  modalOverlay: 190,
-  modalContainer: 191,
-  dropdown: 192,
-  toast: 200
-};
-
 // src/styles/common.tsx
 var rootFontSizePx = 12;
 var rootFontSizeRems = rootFontSizePx / 16;
-var standardContentInsetPx = 32;
-var standardContentInsetMdPx = 24;
-var standardContentInsetSmPx = 16;
-var smContentInset = import_react4.css`
-  ${bp.sm(`
-    margin-left: auto;
-    margin-right: auto;
-    width: calc(100% - ${standardContentInsetSmPx * 2}px);
-  `)}
-`;
-var minSmMaxLgContentInset = import_react4.css`
-  ${bp.minSmMaxLg(`
-    width: calc(100% - ${standardContentInsetMdPx * 2}px);
-  `)}
-`;
-var standardContentInset = import_react4.css`
-  margin-left: auto;
-  margin-right: auto;
-  width: calc(100% - ${standardContentInsetPx * 2}px);
-  max-width: 1280px;
-
-  ${smContentInset}
-  ${minSmMaxLgContentInset}
-`;
+function buildStandardContentInset(smPx, minSmMaxLgPx, lgPx) {
+  const smCSS = import_react4.css`
+    ${bp.sm(`
+      margin-left: auto;
+      margin-right: auto;
+      width: calc(100% - ${smPx * 2}px);
+    `)}
+  `;
+  const minSmMaxLgCSS = import_react4.css`
+    ${bp.minSmMaxLg(`
+      margin-left: auto;
+      margin-right: auto;
+      width: calc(100% - ${minSmMaxLgPx * 2}px);
+    `)}
+  `;
+  const lgCSS = import_react4.css`
+    ${bp.lg(`
+      margin-left: auto;
+      margin-right: auto;
+      width: calc(100% - ${lgPx * 2}px);
+      max-width: 1280px;
+    `)}
+  `;
+  return {
+    smPx,
+    minSmMaxLgPx,
+    lgPx,
+    smCSS,
+    minSmMaxLgCSS,
+    lgCSS,
+    css: import_react4.css`
+      ${lgCSS}
+      ${smCSS}
+      ${minSmMaxLgCSS}
+    `
+  };
+}
+var standardContentInset = buildStandardContentInset(16, 24, 32);
 var standardCardShadow = import_react4.css`
   box-shadow:
     0px 4px 10px 0px rgba(0, 0, 0, 0.08),
@@ -1358,9 +1345,6 @@ var Subtext = import_styled.default.div`
 var darkGradientBg = import_react4.css`
   background: ${darkGradient};
 `;
-var StyledTooltip = (0, import_styled.default)(import_react_tooltip.Tooltip)`
-  z-index: ${z.modalOverlay};
-`;
 
 // src/utils/strings.tsx
 function isString(str) {

package/dist/components/Loading.js

@@ -1,14 +1,13 @@
 import {
   Loading,
   LoadingWrapper
-} from "../chunk-NGS4OSWT.js";
-import "../chunk-NZJCJJH5.js";
+} from "../chunk-J4FJQ3FN.js";
+import "../chunk-RWIZ7Q74.js";
 import "../chunk-LAMQKQU3.js";
-import "../chunk-RFGKH3R6.js";
+import "../chunk-JK4BP73A.js";
 import "../chunk-2VBDEO6M.js";
 import "../chunk-E4EXM4SY.js";
 import "../chunk-JSGRNWSB.js";
-import "../chunk-CLU2FRJZ.js";
 import "../chunk-CIGAQ47A.js";
 export {
   Loading,