@cube-dev/ui-kit 0.113.1 → 0.115.0

package/es/components/GlobalStyles.js

@@ -1,324 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.113.1
- * Released under the MIT license.
- */
-
-import { useMemo } from 'react';
-import { useGlobalStyles, useRawCSS } from '../tasty/index.js';
-import { TOKENS } from '../tokens/index.js';
-/**
- * Body styles applied via useGlobalStyles.
- * These use tasty syntax and get processed correctly.
- */
-const BODY_STYLES = {
-    overscrollBehaviorY: 'none',
-    fill: '#white',
-    fontFamily: 'var(--font)',
-    '-webkit-font-smoothing': 'antialiased',
-    '-moz-osx-font-smoothing': 'grayscale',
-    margin: 0,
-    padding: 0,
-    color: '#dark-02',
-    preset: 't3',
-    letterSpacing: '0.02em',
-};
-// Static CSS that doesn't depend on props
-const STATIC_CSS = `
-  @font-face {
-    font-family: text-security-disc;
-    src: url(data:font/woff2;base64,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) format('woff2');
-  }
-
-  kbd {
-    font-family: var(--c2-font-family);
-    font-weight: var(--c2-font-weight);
-    font-size: var(--c2-font-size);
-    border: var(--border-width) solid var(--dark-04-color);
-    background-color: white;
-    color: var(--dark-color);
-    border-radius: var(--radius);
-    padding: 0 var(--outline-width);
-  }
-
-  :not([data-qa$="Icon"]) > .tabler-icon {
-    font-size: var(--icon-size);
-    width: 1em;
-    height: 1em;
-    min-width: 1em;
-    min-height: 1em;
-    max-height: 1em;
-    stroke-width: var(--stroke-width);
-  }
-
-  .cube-animation-spin {
-    animation: cube-animation-spin 1s linear infinite;
-  }
-
-  @keyframes cube-animation-spin {
-    from {
-        transform: rotate(0deg);
-    }
-    to {
-        transform: rotate(360deg);
-    }
-  }
-
-  .cube-notification-container {
-    min-width: var(--min-dialog-size);
-    max-width: 340px;
-    width: calc(100vw - 32px);
-    position: fixed;
-    top: 32px;
-    right: 16px;
-    z-index: 999999;
-  }
-
-  .cube-notifications {
-    display: grid;
-    grid-auto-flow: row;
-    grid-template-columns: 1fr;
-  }
-
-  .cube-notification-enter {
-    opacity: 0;
-    max-height: 0px;
-    margin-bottom: 0px;
-    transform: translate(100%, 0);
-  }
-
-  .cube-notification-enter-active {
-    opacity: 1;
-    max-height: 56px;
-    margin-bottom: 8px;
-    transform: translate(0, 0);
-    transition: all 300ms ease-in;
-  }
-
-  .cube-notification-enter-active > * {
-    margin-bottom: 0px;
-  }
-
-  .cube-notification-exit {
-    opacity: 1;
-    margin-bottom: 8px;
-    max-height: 56px;
-    transform: translate(0, 0);
-  }
-
-  .cube-notification-exit-active {
-    opacity: 0;
-    max-height: 0px;
-    margin-bottom: 0px;
-    transform: translate(100%, 0);
-    transition: all 300ms ease-in;
-  }
-
-  .cube-notification-exit-active > * {
-    margin-bottom: 0px;
-  }
-
-  b, strong {
-    font-weight: var(--bold-font-weight, 700);
-  }
-
-  [type=reset], [type=submit], button, html [type=button] {
-    -webkit-appearance: none;
-  }
-
-  code {
-    font-family: var(--monospace-font);
-  }
-
-  /* Prism Code */
-  code[class*="language-"],
-  pre[class*="language-"] {
-    color: var(--dark-color);
-    background: none;
-    font-family: var(--monospace-font);
-    text-align: left;
-    font-weight: normal;
-    font-size: 14px;
-    line-height: 20px;
-    white-space: pre;
-    word-spacing: normal;
-    word-break: normal;
-    word-wrap: normal;
-    border-radius: 6px;
-    border: none;
-
-    -moz-tab-size: 4;
-    -o-tab-size: 4;
-    tab-size: 4;
-
-    -webkit-hyphens: none;
-    -moz-hyphens: none;
-    -ms-hyphens: none;
-    hyphens: none;
-  }
-
-  pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection,
-  code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection {
-    text-shadow: none;
-    background: rgb(var(--primary-color-rgb) / .2);
-  }
-
-  pre[class*="language-"]::selection, pre[class*="language-"] ::selection,
-  code[class*="language-"]::selection, code[class*="language-"] ::selection {
-    text-shadow: none;
-    background: rgb(var(--primary-color-rgb) / .2);
-  }
-
-  @media print {
-    code[class*="language-"],
-    pre[class*="language-"] {
-      text-shadow: none;
-    }
-  }
-
-  /* Code blocks */
-  pre[class*="language-"] {
-    overflow: auto;
-  }
-
-  :not(pre) > code[class*="language-"],
-  pre[class*="language-"] {
-    background: transparent;
-  }
-
-  /* Inline code */
-  :not(pre) > code[class*="language-"] {
-    border-radius: .3em;
-    white-space: normal;
-  }
-
-  .token.inserted-sign {
-    background-color: #e6ffed;
-    color: #30A666;
-  }
-
-  .token.inserted {
-    color: #30A666;
-  }
-
-  .token.deleted-sign {
-    background-color: #ffeef0;
-    color: var(--danger-color);
-  }
-
-  .token.deleted {
-    color: var(--pink-color);
-  }
-
-  .token.comment,
-  .token.prolog,
-  .token.doctype,
-  .token.cdata {
-    color: var(--dark-03-color);
-  }
-
-  .token.tag,
-  .token.operator,
-  .token.punctuation {
-    color: #993388;
-  }
-
-  .namespace {
-    opacity: .7;
-  }
-
-  .token.property,
-  .token.boolean,
-  .token.constant,
-  .token.symbol,
-  .token.key,
-  .token.keyword {
-    color: var(--pink-color);
-  }
-
-  .token.entity,
-  .token.number {
-    color: #30A666;
-  }
-
-  .token.selector,
-  .token.attr-name,
-  .token.string,
-  .token.char,
-  .token.builtin {
-    color: var(--primary-text-color);
-  }
-
-  .token.url,
-  .language-css .token.string,
-  .style .token.string {
-    color: var(--dark-color);
-  }
-
-  .token.attr-value {
-    color: var(--dark-color);
-  }
-
-  .token.atrule,
-  .token.keyword {
-    font-weight: 500;
-  }
-
-  .token.function,
-  .token.class-name {
-    color: var(--pink-color);
-  }
-
-  .token.regex,
-  .token.important,
-  .token.variable {
-    color: var(--pink-color);
-  }
-
-  .token.important,
-  .token.bold {
-    font-weight: bold;
-  }
-
-  .token.italic {
-    font-style: italic;
-  }
-
-  .token.entity {
-    cursor: help;
-  }
-`;
-export function GlobalStyles(props) {
-    const { bodyStyles, font, monospaceFont } = props;
-    // Merge token styles with body styles
-    const bodyTokenStyles = useMemo(() => {
-        // Start with design tokens
-        const styles = { ...TOKENS };
-        // Add base body styles
-        Object.assign(styles, BODY_STYLES);
-        // Override with custom body styles if provided
-        // Keys are passed through as-is (tasty handles both camelCase and kebab-case)
-        if (bodyStyles) {
-            Object.assign(styles, bodyStyles);
-        }
-        return styles;
-    }, [bodyStyles]);
-    // Apply tokens and body styles via useGlobalStyles
-    useGlobalStyles('body', bodyTokenStyles);
-    // Apply static CSS and font definitions via useRawCSS
-    useRawCSS(() => {
-        const fontValue = font ? `${font}, ` : '';
-        const monospaceFontValue = monospaceFont ? `${monospaceFont}, ` : '';
-        return `
-  html {
-    overscroll-behavior-y: none;
-    --font: ${fontValue}-apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
-    --monospace-font: ${monospaceFontValue}Menlo, Monaco, Consolas, 'Courier New', monospace;
-  }
-${STATIC_CSS}`;
-    }, [font, monospaceFont]);
-    return null;
-}
-
-        

package/es/components/GridProvider.js

@@ -1,63 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.113.1
- * Released under the MIT license.
- */
-
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef, useCallback, useEffect, useState } from 'react';
-import { filterBaseProps, tasty } from '../tasty/index.js';
-import { useCombinedRefs } from '../utils/react/index.js';
-const GridElement = tasty({
-    styles: {
-        display: 'contents',
-    },
-});
-const COLUMN_WIDTH = '(($grid-width - ($column-gap * ($columns-amount - 1))) / $columns-amount)';
-export const GridProvider = forwardRef(function GridProvider(props, outerRef) {
-    let ref = useCombinedRefs(outerRef);
-    let { children, columns = 2, gap = '0', width: forcedWidth, initialWidth, } = props;
-    let [width, setWidth] = useState(forcedWidth || initialWidth || '100vw');
-    const resizeCallback = useCallback(() => {
-        const el = ref?.current?.parentElement;
-        if (!el)
-            return;
-        const computedStyle = getComputedStyle(el);
-        const containerWidth = el.clientWidth -
-            parseFloat(computedStyle.paddingLeft) -
-            parseFloat(computedStyle.paddingRight);
-        setWidth(`${containerWidth}px`);
-    }, [ref, columns, gap]);
-    useEffect(() => {
-        if (forcedWidth)
-            return;
-        const el = ref && ref.current && ref.current.parentNode;
-        if (!el)
-            return;
-        let sensor;
-        import('../utils/ResizeSensor.js')
-            .then((module) => module.ResizeSensor)
-            .then((ResizeSensor) => {
-            sensor = new ResizeSensor(el, resizeCallback);
-        });
-        return () => {
-            if (sensor) {
-                sensor.detach();
-            }
-        };
-    }, [resizeCallback]);
-    useEffect(() => {
-        if (forcedWidth)
-            return;
-        resizeCallback();
-    }, [resizeCallback]);
-    return (_jsx(GridElement, { ...filterBaseProps(props, { eventProps: true }), ref: ref, styles: {
-            '--grid-width': width,
-            '--columns-amount': columns,
-            '--column-gap': gap,
-            '--column-width': COLUMN_WIDTH,
-        }, children: children }));
-});
-
-        

package/es/components/HiddenInput.js

@@ -1,34 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.113.1
- * Released under the MIT license.
- */
-
-import { tasty } from '../tasty/index.js';
-export const HiddenInput = tasty({
-    as: 'input',
-    styles: {
-        display: 'block',
-        fontFamily: 'inherit',
-        fontSize: '100%',
-        lineHeight: '1.15',
-        margin: '0',
-        overflow: 'visible',
-        boxSizing: 'border-box',
-        padding: '0',
-        position: 'absolute',
-        inset: '0',
-        opacity: '0.0001',
-        zIndex: '1',
-        width: '100%',
-        height: '100%',
-        cursor: {
-            '': 'default',
-            button: '$pointer',
-            disabled: 'not-allowed',
-        },
-    },
-});
-
-        

package/es/components/OpenTrasition.js

@@ -1,32 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.113.1
- * Released under the MIT license.
- */
-
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Children, cloneElement, useRef } from 'react';
-import { Transition } from 'react-transition-group';
-const OPEN_STATES = {
-    entering: false,
-    entered: true,
-};
-/**
- * Timeout issues adding css animations to enter may be related to
- * https://github.com/reactjs/react-transition-group/issues/189 or
- * https://github.com/reactjs/react-transition-group/issues/22
- * my VM isn't good enough to debug accurately and get a better answer.
- *
- * As a result, use enter 0 so that is-open is applied once entered
- * it doesn't matter if we know when the css-animation is done on entering
- * for exiting though, give time for the css-animation to play
- * before removing from the DOM
- * **note** hitting esc bypasses exit animation for anyone testing.
- */
-export function OpenTransition(props) {
-    const nodeRef = useRef(null);
-    return (_jsx(Transition, { nodeRef: nodeRef, timeout: { enter: 0, exit: 350 }, ...props, children: (state) => (_jsx("div", { ref: nodeRef, children: Children.map(props.children, (child) => child && cloneElement(child, { isOpen: !!OPEN_STATES[state] })) })) }));
-}
-
-        

package/es/components/Root.js

@@ -1,50 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.113.1
- * Released under the MIT license.
- */
-
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useRef, useState } from 'react';
-import { ModalProvider } from 'react-aria';
-import { Provider } from '../provider.js';
-import { TrackingProvider } from '../providers/TrackingProvider.js';
-import { BASE_STYLES, BLOCK_STYLES, extractStyles, filterBaseProps, tasty, } from '../tasty/index.js';
-import { EventBusProvider } from '../utils/react/useEventBus.js';
-import { VERSION } from '../version.js';
-import { GlobalStyles } from './GlobalStyles.js';
-import { AlertDialogApiProvider } from './overlays/AlertDialog/index.js';
-import { NotificationsProvider } from './overlays/NewNotifications/NotificationsContext/NotificationsProvider.js';
-import { ToastProvider } from './overlays/Toast/index.js';
-import { PortalProvider } from './portal/index.js';
-const RootElement = tasty({
-    id: 'cube-ui-kit-root',
-    styles: {
-        display: 'contents',
-        color: '#dark-02',
-        preset: 't3',
-    },
-});
-const STYLES = [...BASE_STYLES, ...BLOCK_STYLES];
-export function Root(allProps) {
-    let { children, 
-    /** Raw css styles for body element */
-    bodyStyles, fontDisplay = 'swap', fonts, publicUrl, navigation, font, monospaceFont, applyLegacyTokens: _applyLegacyTokens, // deprecated, ignored
-    tracking, cursorStrategy = 'web', style, tokens, ...props } = allProps;
-    const ref = useRef(null);
-    const [rootRef, setRootRef] = useState();
-    useEffect(() => {
-        if (!rootRef) {
-            // @ts-ignore
-            setRootRef(ref?.current);
-        }
-    }, []);
-    const styles = extractStyles(props, STYLES);
-    return (_jsx(Provider, { navigation: navigation, root: rootRef, children: _jsx(TrackingProvider, { event: tracking?.event, children: _jsxs(RootElement, { ref: ref, "data-tasty": VERSION, "data-font-display": fontDisplay, ...filterBaseProps(props, { eventProps: true }), styles: styles, style: {
-                    '--pointer': cursorStrategy === 'web' ? 'pointer' : 'default',
-                    ...style,
-                }, tokens: tokens, children: [_jsx(GlobalStyles, { bodyStyles: bodyStyles, publicUrl: publicUrl, fonts: fonts, font: font, monospaceFont: monospaceFont, fontDisplay: fontDisplay }), _jsx(ModalProvider, { children: _jsx(PortalProvider, { value: ref, children: _jsx(EventBusProvider, { children: _jsx(NotificationsProvider, { rootRef: ref, children: _jsx(ToastProvider, { children: _jsx(AlertDialogApiProvider, { children: children }) }) }) }) }) })] }) }) }));
-}
-
-        

package/es/components/actions/Action/Action.js

@@ -1,37 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.113.1
- * Released under the MIT license.
- */
-
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from 'react';
-import { CONTAINER_STYLES, extractStyles, tasty, TEXT_STYLES, } from '../../../tasty/index.js';
-import { useAction } from '../use-action.js';
-const ActionElement = tasty({
-    as: 'button',
-    styles: {
-        reset: 'button',
-        appearance: 'none',
-        touchAction: 'manipulation',
-        textDecoration: 'none',
-        position: 'relative',
-        margin: 0,
-        preset: 'inherit',
-        border: 0,
-        padding: 0,
-        outline: 0,
-        transition: 'theme',
-        cursor: '$pointer',
-        fill: '#clear',
-    },
-});
-const STYLE_PROPS = [...CONTAINER_STYLES, ...TEXT_STYLES];
-export const Action = forwardRef(function Action({ to, as, download, htmlType, label, theme, mods, onPress, ...props }, ref) {
-    const { actionProps } = useAction({ to, as, htmlType, label, onPress, mods, ...props }, ref);
-    const styles = extractStyles(props, STYLE_PROPS);
-    return (_jsx(ActionElement, { "data-theme": theme, download: download, ...actionProps, styles: styles }));
-});
-
-        

package/es/components/actions/Banner/Banner.js

@@ -1,77 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.113.1
- * Released under the MIT license.
- */
-
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { IconAlertTriangle, IconCircleCheck, IconExclamationCircle, IconInfoCircle, IconX, } from '@tabler/icons-react';
-import { useMemo } from 'react';
-import { useEvent } from '../../../_internal/hooks/use-event.js';
-import { tasty } from '../../../tasty/index.js';
-import { Item } from '../../content/Item/Item.js';
-import { Link } from '../Link/Link.js';
-const DEFAULT_ICONS = {
-    danger: _jsx(IconExclamationCircle, {}),
-    warning: _jsx(IconAlertTriangle, {}),
-    note: _jsx(IconInfoCircle, {}),
-    success: _jsx(IconCircleCheck, {}),
-};
-const BannerElement = tasty(Item, {
-    styles: {
-        width: '100%',
-        Description: {
-            textOverflow: 'ellipsis / 2',
-            whiteSpace: 'normal',
-        },
-        Actions: {
-            gap: '1x',
-        },
-    },
-});
-const BannerActionElement = tasty(Item.Action, {
-    type: 'outline',
-    styles: {
-        preset: 't3m',
-        border: '#clear',
-    },
-});
-const BannerLinkElement = tasty(Link, {
-    styles: {
-        color: '#white',
-        textDecoration: 'underline',
-    },
-});
-/**
- * Sub-component for action buttons within a Banner.
- * Automatically styled to match the banner's theme.
- */
-export function BannerAction(props) {
-    return _jsx(BannerActionElement, { ...props });
-}
-/**
- * Sub-component for inline links within Banner content.
- * Styled with white color and underline to stand out against the banner background.
- */
-export function BannerLink(props) {
-    return _jsx(BannerLinkElement, { ...props });
-}
-/**
- * Banner displays prominent messages and notifications to users.
- * Supports different themes (danger, warning, note, success) with appropriate icons.
- * Use Banner.Action for action buttons and Banner.Link for inline links.
- */
-export function Banner(props) {
-    const { theme = 'note', actions, isDismissible = false, onDismiss, children, icon, ...rest } = props;
-    const onDismissEvent = useEvent(() => {
-        onDismiss?.();
-    });
-    const defaultIcon = useMemo(() => DEFAULT_ICONS[theme], [theme]);
-    const hasActions = !!(actions || isDismissible);
-    return (_jsx(BannerElement, { qa: "Banner", role: "status", type: "primary", theme: theme, size: "large", icon: icon ?? defaultIcon, ...rest, actions: hasActions ? (_jsxs(_Fragment, { children: [actions, isDismissible && (_jsx(Item.Action, { icon: _jsx(IconX, {}), tooltip: "Hide banner", onPress: onDismissEvent }))] })) : undefined, children: children }));
-}
-Banner.Action = BannerAction;
-Banner.Link = BannerLink;
-
-        

package/es/components/actions/Banner/index.js

@@ -1,10 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.113.1
- * Released under the MIT license.
- */
-
-export { Banner, BannerAction, BannerLink } from './Banner.js';
-
-