@cfx-dev/ui-components 4.5.9 → 4.5.10

package/dist/assets/css/Flyout.css

@@ -1 +1 @@
-.cfxui__Flyout__root__eba04{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none}.cfxui__Flyout__root__eba04 .cfxui__Flyout__backdrop__57f9e{position:fixed;top:0;right:0;bottom:0;left:0;background-color:var(--color-overlay-backdrop-background);opacity:0;pointer-events:none}.cfxui__Flyout__root__eba04 .cfxui__Flyout__mask__72713{--mask-right: var(--viewport-right, initial);--mask-right-offset: calc(var(--mask-right, initial) - var(--offset-large));position:fixed;top:0;right:0;bottom:0;left:0;mask:linear-gradient(90deg,black 0%,black var(--mask-right-offset, initial),transparent var(--mask-right, initial),transparent 100%);opacity:0;pointer-events:none}.cfxui__Flyout__root__eba04 .cfxui__Flyout__holder__d80b5{--offset-flyout: calc((100vh - (var(--height) - var(--offset-safezone) * 2) * 1) * .5 - var(--offset-large));position:fixed;top:var(--offset-flyout, initial);right:0;bottom:var(--offset-flyout, initial);padding:calc((100vh - (var(--height) - var(--offset-safezone) * 2) * 1) * .5 - var(--offset-flyout, initial)) calc((100vw - (var(--width) - var(--offset-safezone) * 2) * 1) * .5) calc((100vh - (var(--height) - var(--offset-safezone) * 2) * 1) * .5 - var(--offset-flyout, initial)) var(--offset-xlarge);border-radius:var(--border-radius-normal);border-top-right-radius:0;border-bottom-right-radius:0;box-shadow:0 0 0 2px var(--color-flyout-holder-border) inset,var(--shadow-large, initial);--backdrop-color: var(--color-flyout-holder-blur-background);--over-backdrop-color: var(--backdrop-color, transparent);--over-backdrop-image-blur: var(--backdrop-image-blur, url(data:image/png;base64,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));background-color:var(--over-backdrop-color, initial);background-image:linear-gradient(var(--over-backdrop-color, initial),var(--over-backdrop-color, initial)),linear-gradient(var(--color-backdrop-shader),var(--color-backdrop-shader)),var(--over-backdrop-image-blur, initial),var(--over-backdrop-image-blur, initial);background-blend-mode:normal,normal,overlay;background-size:cover,cover,cover,cover;background-attachment:scroll,scroll,fixed,fixed;opacity:0;transform:translate(20px);pointer-events:none}.cfxui__Flyout__root__eba04 .cfxui__Flyout__holder__d80b5 .cfxui__Flyout__content__04e42{width:100%;height:100%;overflow:hidden}.cfxui__Flyout__root__eba04.cfxui__Flyout__size-normal__e1165 .cfxui__Flyout__holder__d80b5{left:32vw}.cfxui__Flyout__root__eba04.cfxui__Flyout__size-small__038a5 .cfxui__Flyout__holder__d80b5{left:48vw}.cfxui__Flyout__root__eba04.cfxui__Flyout__size-xsmall__839e8 .cfxui__Flyout__holder__d80b5{left:64vw}.cfxui__Flyout__root__eba04.cfxui__Flyout__active__14a29 .cfxui__Flyout__backdrop__57f9e{opacity:1;pointer-events:all;animation:cfxui__Flyout__backdrop-appearance__d9564 .2s ease}.cfxui__Flyout__root__eba04.cfxui__Flyout__active__14a29 .cfxui__Flyout__mask__72713{opacity:1}.cfxui__Flyout__root__eba04.cfxui__Flyout__active__14a29 .cfxui__Flyout__holder__d80b5{opacity:1;transform:translate(0);pointer-events:all;animation:cfxui__Flyout__holder-appearance__e818c .2s ease}.cfxui__Flyout__root__eba04 .cfxui__Flyout__header__40009{display:flex;align-items:center;justify-content:space-between;gap:var(--offset-normal)}.cfxui__Flyout__root__eba04 .cfxui__Flyout__header__40009 .cfxui__Flyout__title__b235a{flex-grow:1;width:1px;display:flex;align-items:center;gap:var(--offset-normal);font-size:var(--font-size-xxlarge)}@keyframes cfxui__Flyout__holder-appearance__e818c{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes cfxui__Flyout__backdrop-appearance__d9564{0%{opacity:0}to{opacity:1}}
+.cfxui__Flyout__root__eba04{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none}.cfxui__Flyout__root__eba04 .cfxui__Flyout__backdrop__57f9e{position:fixed;top:0;right:0;bottom:0;left:0;background-color:var(--color-overlay-backdrop-background);opacity:0;pointer-events:none}.cfxui__Flyout__root__eba04 .cfxui__Flyout__mask__72713{--mask-right: var(--viewport-right, initial);--mask-right-offset: calc(var(--mask-right, initial) - var(--offset-large));position:fixed;top:0;right:0;bottom:0;left:0;mask:linear-gradient(90deg,black 0%,black var(--mask-right-offset, initial),transparent var(--mask-right, initial),transparent 100%);opacity:0;pointer-events:none}.cfxui__Flyout__root__eba04 .cfxui__Flyout__holder__d80b5{--offset-flyout: calc((100vh - (var(--height) - var(--offset-safezone) * 2) * 1) * .5 - var(--offset-large));position:fixed;top:var(--offset-flyout, initial);right:0;bottom:var(--offset-flyout, initial);padding:calc((100vh - (var(--height) - var(--offset-safezone) * 2) * 1) * .5 - var(--offset-flyout, initial)) calc((100vw - (var(--width) - var(--offset-safezone) * 2) * 1) * .5) calc((100vh - (var(--height) - var(--offset-safezone) * 2) * 1) * .5 - var(--offset-flyout, initial)) var(--offset-xlarge);border-radius:var(--border-radius-normal);border-top-right-radius:0;border-bottom-right-radius:0;box-shadow:0 0 0 2px var(--color-flyout-holder-border) inset,var(--shadow-large, initial);--backdrop-color: var(--color-flyout-holder-blur-background);--over-backdrop-color: var(--backdrop-color, transparent);--over-backdrop-image-blur: var(--backdrop-image-blur, url(data:image/png;base64,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));background-color:var(--over-backdrop-color, initial);background-image:linear-gradient(var(--over-backdrop-color, initial),var(--over-backdrop-color, initial)),linear-gradient(var(--color-backdrop-shader),var(--color-backdrop-shader)),var(--over-backdrop-image-blur, initial),var(--over-backdrop-image-blur, initial);background-blend-mode:normal,normal,overlay;background-size:cover,cover,cover,cover;background-attachment:scroll,scroll,fixed,fixed;opacity:0;transform:translate(20px);pointer-events:none}.cfxui__Flyout__root__eba04 .cfxui__Flyout__holder__d80b5 .cfxui__Flyout__content__04e42{width:100%;height:100%;overflow:hidden}.cfxui__Flyout__root__eba04.cfxui__Flyout__size-normal__e1165 .cfxui__Flyout__holder__d80b5{left:32vw}.cfxui__Flyout__root__eba04.cfxui__Flyout__size-small__038a5 .cfxui__Flyout__holder__d80b5{left:48vw}.cfxui__Flyout__root__eba04.cfxui__Flyout__size-xsmall__839e8 .cfxui__Flyout__holder__d80b5{left:64vw}.cfxui__Flyout__root__eba04.cfxui__Flyout__size-xxsmall__33712 .cfxui__Flyout__holder__d80b5{left:80vw;padding:calc(var(--quant) * 5) calc(var(--quant) * 3.75)}.cfxui__Flyout__root__eba04.cfxui__Flyout__theme-filter__1fcce .cfxui__Flyout__holder__d80b5{background:rgba(var(--color-bg),1);border:none;box-shadow:none;top:0;bottom:0}.cfxui__Flyout__root__eba04.cfxui__Flyout__active__14a29 .cfxui__Flyout__backdrop__57f9e{opacity:1;pointer-events:all;animation:cfxui__Flyout__backdrop-appearance__d9564 .2s ease}.cfxui__Flyout__root__eba04.cfxui__Flyout__active__14a29 .cfxui__Flyout__mask__72713{opacity:1}.cfxui__Flyout__root__eba04.cfxui__Flyout__active__14a29 .cfxui__Flyout__holder__d80b5{opacity:1;transform:translate(0);pointer-events:all;animation:cfxui__Flyout__holder-appearance__e818c .2s ease}.cfxui__Flyout__root__eba04 .cfxui__Flyout__header__40009{display:flex;align-items:center;justify-content:space-between;gap:var(--offset-normal)}.cfxui__Flyout__root__eba04 .cfxui__Flyout__header__40009 .cfxui__Flyout__title__b235a{flex-grow:1;width:1px;display:flex;align-items:center;gap:var(--offset-normal);font-size:var(--font-size-xxlarge)}@keyframes cfxui__Flyout__holder-appearance__e818c{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes cfxui__Flyout__backdrop-appearance__d9564{0%{opacity:0}to{opacity:1}}

package/dist/components/Flyout/Flyout.d.ts

@@ -1,9 +1,11 @@
 import { default as React } from 'react';
 
 export declare const FLYOUT_OUTLET_ID = "flyout-outlet";
-export type FlyoutSize = 'normal' | 'small' | 'xsmall';
+export type FlyoutSize = 'normal' | 'small' | 'xsmall' | 'xxsmall';
+export type FlyoutTheme = 'default' | 'filter';
 export interface FlyoutProps {
     disabled?: boolean;
+    theme?: FlyoutTheme;
     size?: FlyoutSize;
     onClose?(): void;
     children?: React.ReactNode;

package/dist/components/Flyout/Flyout.js

@@ -1,63 +1,66 @@
-import { jsx as e, jsxs as i } from "react/jsx-runtime";
-import d from "react";
-import { F as f } from "../../Combination-N-vN9BB-.js";
-import p from "../Button/Button.js";
-import { clsx as l } from "../../utils/clsx.js";
+import { jsx as o, jsxs as i } from "react/jsx-runtime";
+import f from "react";
+import { F as p } from "../../Combination-N-vN9BB-.js";
+import h from "../Button/Button.js";
+import { clsx as r } from "../../utils/clsx.js";
 import "../../utils/links.js";
-import { Interactive as h } from "../Interactive/Interactive.js";
+import { Interactive as x } from "../Interactive/Interactive.js";
 import { noop as y } from "../../utils/functional.js";
 import "../../utils/hooks/useGlobalKeyboardEvent.js";
 import { useKeyboardClose as F } from "../../utils/hooks/useKeyboardClose.js";
-import { useOutlet as x } from "../../utils/hooks/useOutlet.js";
-const k = "cfxui__Flyout__root__eba04", b = "cfxui__Flyout__backdrop__57f9e", v = "cfxui__Flyout__mask__72713", C = "cfxui__Flyout__holder__d80b5", N = "cfxui__Flyout__content__04e42", z = "cfxui__Flyout__active__14a29", L = "cfxui__Flyout__header__40009", O = "cfxui__Flyout__title__b235a", o = {
-  root: k,
-  backdrop: b,
-  mask: v,
+import { useOutlet as k } from "../../utils/hooks/useOutlet.js";
+const b = "cfxui__Flyout__root__eba04", v = "cfxui__Flyout__backdrop__57f9e", z = "cfxui__Flyout__mask__72713", C = "cfxui__Flyout__holder__d80b5", N = "cfxui__Flyout__content__04e42", L = "cfxui__Flyout__active__14a29", O = "cfxui__Flyout__header__40009", E = "cfxui__Flyout__title__b235a", e = {
+  root: b,
+  backdrop: v,
+  mask: z,
   holder: C,
   content: N,
   "size-normal": "cfxui__Flyout__size-normal__e1165",
   "size-small": "cfxui__Flyout__size-small__038a5",
   "size-xsmall": "cfxui__Flyout__size-xsmall__839e8",
-  active: z,
+  "size-xxsmall": "cfxui__Flyout__size-xxsmall__33712",
+  "theme-filter": "cfxui__Flyout__theme-filter__1fcce",
+  active: L,
   "backdrop-appearance": "cfxui__Flyout__backdrop-appearance__d9564",
   "holder-appearance": "cfxui__Flyout__holder-appearance__e818c",
-  header: L,
-  title: O
-}, E = "flyout-outlet";
-function I(c) {
+  header: O,
+  title: E
+}, I = "flyout-outlet";
+function T(c) {
   const {
     disabled: t = !1,
-    size: s = "normal",
-    onClose: r = y,
-    children: a,
-    holderClassName: n
-  } = c, m = x(E);
-  d.useEffect(() => {
+    size: l = "normal",
+    theme: a = "default",
+    onClose: s = y,
+    children: n,
+    holderClassName: m
+  } = c, u = k(I);
+  f.useEffect(() => {
     if (t)
       return;
     const _ = document.getElementById("cfxui-root");
     return _ == null || _.classList.add("shrink"), () => _ == null ? void 0 : _.classList.remove("shrink");
-  }, [t]), F(r);
-  const u = l(o.root, o[`size-${s}`], {
-    [o.active]: !t
+  }, [t]), F(s);
+  const d = r(e.root, e[`size-${l}`], e[`theme-${a}`], {
+    [e.active]: !t
   });
-  return /* @__PURE__ */ e(m, { children: /* @__PURE__ */ i("div", { className: u, children: [
-    /* @__PURE__ */ e(h, { showPointer: !1, className: o.backdrop, onClick: r }),
-    /* @__PURE__ */ e("div", { className: o.mask, children: /* @__PURE__ */ e("div", { className: l(o.holder, n), children: /* @__PURE__ */ e(f, { disabled: !!t, className: o.content, children: a }) }) })
+  return /* @__PURE__ */ o(u, { children: /* @__PURE__ */ i("div", { className: d, children: [
+    /* @__PURE__ */ o(x, { showPointer: !1, className: e.backdrop, onClick: s }),
+    /* @__PURE__ */ o("div", { className: e.mask, children: /* @__PURE__ */ o("div", { className: r(e.holder, m), children: /* @__PURE__ */ o(p, { disabled: !!t, className: e.content, children: n }) }) })
   ] }) });
 }
-I.Header = function(t) {
+T.Header = function(t) {
   const {
-    onClose: s,
-    children: r,
-    ref: a
+    onClose: l,
+    children: a,
+    ref: s
   } = t;
-  return /* @__PURE__ */ i("div", { ref: a, className: o.header, children: [
-    /* @__PURE__ */ e("div", { className: o.title, children: r }),
-    !!s && /* @__PURE__ */ e(p, { icon: "Close", onClick: s })
+  return /* @__PURE__ */ i("div", { ref: s, className: e.header, children: [
+    /* @__PURE__ */ o("div", { className: e.title, children: a }),
+    !!l && /* @__PURE__ */ o(h, { icon: "Close", onClick: l })
   ] });
 };
 export {
-  E as FLYOUT_OUTLET_ID,
-  I as Flyout
+  I as FLYOUT_OUTLET_ID,
+  T as Flyout
 };

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

@@ -1,2 +1,2 @@
 export { FLYOUT_OUTLET_ID, Flyout } from './Flyout';
-export type { FlyoutProps, FlyoutSize } from './Flyout';
+export type { FlyoutProps, FlyoutSize, FlyoutTheme, } from './Flyout';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cfx-dev/ui-components",
   "private": false,
-  "version": "4.5.9",
+  "version": "4.5.10",
   "type": "module",
   "license": "MIT",
   "main": "dist/main.js",