@veracity/vui 0.7.0-beta.0 → 0.7.0-beta.2

package/dist/esm/modal/modalContent.d.ts

@@ -0,0 +1,5 @@
+export declare const ModalContentBase: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, import("..").SystemProps, never>;
+/** Wraps the content provided to the Modal component. */
+export declare const ModalContent: import("../core").VuiComponent<"div", import("..").SystemProps>;
+export default ModalContent;
+//# sourceMappingURL=modalContent.d.ts.map

package/dist/esm/modal/modalContent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"modalContent.d.ts","sourceRoot":"","sources":["../../../src/modal/modalContent.tsx"],"names":[],"mappings":"AAOA,eAAO,MAAM,gBAAgB,+HAK5B,CAAA;AAED,yDAAyD;AACzD,eAAO,MAAM,YAAY,iEAevB,CAAA;AAIF,eAAe,YAAY,CAAA"}

package/dist/esm/modal/modalContent.js

@@ -0,0 +1,19 @@
+import React from 'react';
+import { styled, useStyleConfig, vui } from '../core';
+import { callAll, cs } from '../utils';
+import { useModalContext } from './context';
+export const ModalContentBase = styled.divBox `
+	display: flex;
+	inset: 0px;
+	position: fixed;
+	z-index: modal;
+`;
+/** Wraps the content provided to the Modal component. */
+export const ModalContent = vui((props, ref) => {
+    const { className, ...rest } = props;
+    const { onBackdropClick } = useModalContext() ?? {};
+    const styles = useStyleConfig('Modal', useModalContext());
+    return (React.createElement(ModalContentBase, { className: cs('vui-modalContent', className), ref: ref, tabIndex: -1, ...styles.content, ...rest, onClick: callAll(props.onClick, onBackdropClick) }));
+});
+ModalContent.displayName = 'ModalContent';
+export default ModalContent;

package/dist/esm/modal/modalManager.d.ts

@@ -0,0 +1,13 @@
+import { Ref } from 'react';
+/** State management for nested modals. */
+declare class ModalManager {
+    modals: any[];
+    add: (modal: any) => void;
+    remove: (modal: any) => void;
+    isTopModal: (modal: any) => boolean;
+}
+export declare const manager: ModalManager;
+/** Refs of new modals will be automatically added/removed from the state when rendering. */
+export declare function useModalManager(ref: Ref<any>, isOpen?: boolean): void;
+export {};
+//# sourceMappingURL=modalManager.d.ts.map

package/dist/esm/modal/modalManager.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"modalManager.d.ts","sourceRoot":"","sources":["../../../src/modal/modalManager.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAa,MAAM,OAAO,CAAA;AAEtC,0CAA0C;AAC1C,cAAM,YAAY;IACjB,MAAM,EAAE,GAAG,EAAE,CAAK;IAElB,GAAG,UAAW,GAAG,UAEhB;IAED,MAAM,UAAW,GAAG,UAEnB;IAED,UAAU,UAAW,GAAG,aAGvB;CACD;AAED,eAAO,MAAM,OAAO,cAAqB,CAAA;AAEzC,4FAA4F;AAC5F,wBAAgB,eAAe,CAAC,GAAG,EAAE,GAAG,CAAC,GAAG,CAAC,EAAE,MAAM,CAAC,EAAE,OAAO,QAQ9D"}

package/dist/esm/modal/theme.d.ts

@@ -0,0 +1,9 @@
+declare const _default: {
+    baseStyle: {};
+    defaultProps: {};
+    parts: string[];
+    sizes: {};
+    variants: {};
+};
+export default _default;
+//# sourceMappingURL=theme.d.ts.map

package/dist/esm/modal/theme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/modal/theme.ts"],"names":[],"mappings":";;;;;;;AAUA,wBAMC"}

package/dist/esm/notification/consts.d.ts

@@ -0,0 +1,3 @@
+import { NotificationStatusMapping } from './notification.types';
+export declare const notificationStatusMapping: NotificationStatusMapping;
+//# sourceMappingURL=consts.d.ts.map

package/dist/esm/notification/consts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"consts.d.ts","sourceRoot":"","sources":["../../../src/notification/consts.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,yBAAyB,EAAE,MAAM,sBAAsB,CAAA;AAEhE,eAAO,MAAM,yBAAyB,EAAE,yBAiCvC,CAAA"}

package/dist/esm/notification/context.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { NotificationProps } from './notification.types';
+declare const NotificationProvider: import("react").Provider<Partial<NotificationProps>>, useNotificationContext: () => Partial<NotificationProps>;
+export { NotificationProvider, useNotificationContext };
+//# sourceMappingURL=context.d.ts.map

package/dist/esm/notification/context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../src/notification/context.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAA;AAExD,QAAA,MAAO,oBAAoB,wDAAE,sBAAsB,kCAAmE,CAAA;AAEtH,OAAO,EAAE,oBAAoB,EAAE,sBAAsB,EAAE,CAAA"}

package/dist/esm/notification/context.js

@@ -0,0 +1,3 @@
+import { createContext } from '../utils';
+const [NotificationProvider, useNotificationContext] = createContext({ isOptional: true });
+export { NotificationProvider, useNotificationContext };

package/dist/esm/notification/index.d.ts

@@ -0,0 +1,9 @@
+export * from './context';
+export * from './notification';
+export { default } from './notification';
+export * from './notification.types';
+export * from './notificationButton';
+export * from './notificationIcon';
+export * from './notificationText';
+export * from './notificationTitle';
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/notification/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/notification/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAA;AACzB,cAAc,gBAAgB,CAAA;AAC9B,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAA;AACxC,cAAc,sBAAsB,CAAA;AACpC,cAAc,sBAAsB,CAAA;AACpC,cAAc,oBAAoB,CAAA;AAClC,cAAc,oBAAoB,CAAA;AAClC,cAAc,qBAAqB,CAAA"}

package/dist/esm/notification/notification.d.ts

@@ -0,0 +1,18 @@
+import { VuiComponent } from '../core';
+import { NotificationProps } from './notification.types';
+import NotificationButton from './notificationButton';
+import NotificationIcon from './notificationIcon';
+import NotificationText from './notificationText';
+import NotificationTitle from './notificationTitle';
+/**
+ * Displays informational content, like text and icon with optional action buttons.
+ * Handles multiple states, like info, error or loading.
+ */
+export declare const Notification: VuiComponent<"div", NotificationProps> & {
+    Button: typeof NotificationButton;
+    Icon: typeof NotificationIcon;
+    Text: typeof NotificationText;
+    Title: typeof NotificationTitle;
+};
+export default Notification;
+//# sourceMappingURL=notification.d.ts.map

package/dist/esm/notification/notification.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"notification.d.ts","sourceRoot":"","sources":["../../../src/notification/notification.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAuB,YAAY,EAAE,MAAM,SAAS,CAAA;AAI3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAA;AACxD,OAAO,kBAAkB,MAAM,sBAAsB,CAAA;AACrD,OAAO,gBAAgB,MAAM,oBAAoB,CAAA;AACjD,OAAO,gBAAgB,MAAM,oBAAoB,CAAA;AACjD,OAAO,iBAAiB,MAAM,qBAAqB,CAAA;AAEnD;;;GAGG;AACH,eAAO,MAAM,YAAY;YAmDhB,yBAAyB;UAC3B,uBAAuB;UACvB,uBAAuB;WACtB,wBAAwB;CAC/B,CAAA;AASD,eAAe,YAAY,CAAA"}

package/dist/esm/notification/notification.types.d.ts

@@ -0,0 +1,28 @@
+import { ReactNode } from 'react';
+import { BoxProps } from '../box';
+import { IconProp, IconProps } from '../icon';
+import { ThemingProps } from '../theme';
+export declare type NotificationProps = Omit<BoxProps, 'size' | 'variant'> & ThemingProps<'Notification'> & {
+    /** Socket displaying a button on the right. */
+    action?: ReactNode;
+    /** Available theme colors for this component. @default blue */
+    colorScheme?: 'blue' | 'green' | 'red' | 'yellow';
+    /** Socket displaying an icon on the left. */
+    icon?: IconProp | JSX.Element;
+    /** If provided, displays a close button with this function as onClick. */
+    onClose?: () => void;
+    /** Modifies Notification style and content based on the given status. */
+    status?: NotificationStatus;
+    /** Object definition of styles and content for each status. */
+    statusMapping?: NotificationStatusMapping;
+    /** Socket displaying text in the middle. */
+    text?: ReactNode;
+    /** Socket displaying title in the middle. */
+    title?: ReactNode;
+};
+export declare type NotificationStatus = 'error' | 'info' | 'loading' | 'success' | 'warning';
+export declare type NotificationStatusMapping = Record<string, {
+    colorScheme?: NotificationProps['colorScheme'];
+    iconProps: IconProps;
+}>;
+//# sourceMappingURL=notification.types.d.ts.map

package/dist/esm/notification/notification.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"notification.types.d.ts","sourceRoot":"","sources":["../../../src/notification/notification.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AACjC,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,oBAAY,iBAAiB,GAAG,IAAI,CAAC,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC,GACjE,YAAY,CAAC,cAAc,CAAC,GAAG;IAC9B,+CAA+C;IAC/C,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,+DAA+D;IAC/D,WAAW,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,CAAA;IACjD,6CAA6C;IAC7C,IAAI,CAAC,EAAE,QAAQ,GAAG,GAAG,CAAC,OAAO,CAAA;IAC7B,0EAA0E;IAC1E,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,yEAAyE;IACzE,MAAM,CAAC,EAAE,kBAAkB,CAAA;IAC3B,+DAA+D;IAC/D,aAAa,CAAC,EAAE,yBAAyB,CAAA;IACzC,4CAA4C;IAC5C,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,6CAA6C;IAC7C,KAAK,CAAC,EAAE,SAAS,CAAA;CACjB,CAAA;AAEF,oBAAY,kBAAkB,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,CAAA;AAErF,oBAAY,yBAAyB,GAAG,MAAM,CAC7C,MAAM,EACN;IACC,WAAW,CAAC,EAAE,iBAAiB,CAAC,aAAa,CAAC,CAAA;IAC9C,SAAS,EAAE,SAAS,CAAA;CACpB,CACD,CAAA"}

package/dist/esm/notification/notificationButton.d.ts

@@ -0,0 +1,5 @@
+import { ButtonProps } from '../button';
+/** Displays an action button within the Notification. */
+export declare const NotificationButton: import("../core").VuiComponent<"button", ButtonProps>;
+export default NotificationButton;
+//# sourceMappingURL=notificationButton.d.ts.map

package/dist/esm/notification/notificationButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"notificationButton.d.ts","sourceRoot":"","sources":["../../../src/notification/notificationButton.tsx"],"names":[],"mappings":"AAEA,OAAe,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AAK/C,yDAAyD;AACzD,eAAO,MAAM,kBAAkB,uDAkB7B,CAAA;AAIF,eAAe,kBAAkB,CAAA"}

package/dist/esm/notification/notificationButton.js

@@ -0,0 +1,14 @@
+import React from 'react';
+import Button from '../button';
+import { useStyleConfig, vui } from '../core';
+import { cs } from '../utils';
+import { useNotificationContext } from './context';
+/** Displays an action button within the Notification. */
+export const NotificationButton = vui((props, ref) => {
+    const { className, ...rest } = props;
+    const mergedProps = { ...useNotificationContext(), ...props };
+    const styles = useStyleConfig('Notification', useNotificationContext());
+    return (React.createElement(Button, { className: cs('vui-notificationButton', className), colorScheme: mergedProps.colorScheme, ml: 1, mr: -0.5, ref: ref, size: "sm", variant: "text", ...styles.button, ...rest }));
+});
+NotificationButton.displayName = 'NotificationButton';
+export default NotificationButton;

package/dist/esm/notification/notificationIcon.d.ts

@@ -0,0 +1,5 @@
+import { IconProps } from '../icon';
+/** Displays an icon based on the status within the Notification. */
+export declare const NotificationIcon: import("../core").VuiComponent<"svg", IconProps>;
+export default NotificationIcon;
+//# sourceMappingURL=notificationIcon.d.ts.map

package/dist/esm/notification/notificationIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"notificationIcon.d.ts","sourceRoot":"","sources":["../../../src/notification/notificationIcon.tsx"],"names":[],"mappings":"AAGA,OAAa,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAKzC,oEAAoE;AACpE,eAAO,MAAM,gBAAgB,kDAoB3B,CAAA;AAIF,eAAe,gBAAgB,CAAA"}

package/dist/esm/notification/notificationIcon.js

@@ -0,0 +1,17 @@
+import React from 'react';
+import { useStyleConfig, vui } from '../core';
+import Icon from '../icon';
+import { cs } from '../utils';
+import { notificationStatusMapping } from './consts';
+import { useNotificationContext } from './context';
+/** Displays an icon based on the status within the Notification. */
+export const NotificationIcon = vui((props, ref) => {
+    const { className, ...rest } = props;
+    const mergedProps = { ...useNotificationContext(), ...props };
+    const styles = useStyleConfig('Notification', useNotificationContext());
+    const { status = '' } = mergedProps;
+    const { iconProps } = notificationStatusMapping[status] ?? {};
+    return (React.createElement(Icon, { className: cs('vui-notificationIcon', className), mr: 1, my: 0.5, ref: ref, size: "md", ...styles.icon, ...iconProps, ...rest }));
+});
+NotificationIcon.displayName = 'NotificationIcon';
+export default NotificationIcon;

package/dist/esm/notification/notificationText.d.ts

@@ -0,0 +1,5 @@
+import { TProps } from '../t';
+/** Displays text within the Notification. */
+export declare const NotificationText: import("../core").VuiComponent<"p", TProps>;
+export default NotificationText;
+//# sourceMappingURL=notificationText.d.ts.map

package/dist/esm/notification/notificationText.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"notificationText.d.ts","sourceRoot":"","sources":["../../../src/notification/notificationText.tsx"],"names":[],"mappings":"AAGA,OAAU,EAAE,MAAM,EAAE,MAAM,MAAM,CAAA;AAIhC,6CAA6C;AAC7C,eAAO,MAAM,gBAAgB,6CAgB3B,CAAA;AAIF,eAAe,gBAAgB,CAAA"}

package/dist/esm/notification/notificationText.js

@@ -0,0 +1,13 @@
+import React from 'react';
+import { useStyleConfig, vui } from '../core';
+import T from '../t';
+import { cs } from '../utils';
+import { useNotificationContext } from './context';
+/** Displays text within the Notification. */
+export const NotificationText = vui((props, ref) => {
+    const { className, ...rest } = props;
+    const styles = useStyleConfig('Notification', useNotificationContext());
+    return (React.createElement(T, { className: cs('vui-notificationText', className), flex: "1", lineHeight: "24px", minW: 0, py: 0.5, ref: ref, ...styles.text, ...rest }));
+});
+NotificationText.displayName = 'NotificationText';
+export default NotificationText;

package/dist/esm/notification/notificationTitle.d.ts

@@ -0,0 +1,5 @@
+import { HeadingProps } from '../heading';
+/** Displays a title within the Notification. */
+export declare const NotificationTitle: import("../core").VuiComponent<"h6", HeadingProps>;
+export default NotificationTitle;
+//# sourceMappingURL=notificationTitle.d.ts.map

package/dist/esm/notification/notificationTitle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"notificationTitle.d.ts","sourceRoot":"","sources":["../../../src/notification/notificationTitle.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAM,YAAY,EAAE,MAAM,YAAY,CAAA;AAI7C,gDAAgD;AAChD,eAAO,MAAM,iBAAiB,oDAa5B,CAAA;AAIF,eAAe,iBAAiB,CAAA"}

package/dist/esm/notification/notificationTitle.js

@@ -0,0 +1,13 @@
+import React from 'react';
+import { useStyleConfig, vui } from '../core';
+import { H6 } from '../heading';
+import { cs } from '../utils';
+import { useNotificationContext } from './context';
+/** Displays a title within the Notification. */
+export const NotificationTitle = vui((props, ref) => {
+    const { className, ...rest } = props;
+    const styles = useStyleConfig('Notification', useNotificationContext());
+    return (React.createElement(H6, { className: cs('vui-notificationTitle', className), display: "inline-flex", ref: ref, ...styles.title, ...rest }));
+});
+NotificationTitle.displayName = 'NotificationTitle';
+export default NotificationTitle;

package/dist/esm/notification/theme.d.ts

@@ -0,0 +1,28 @@
+import { Dict } from '../utils';
+declare function variantSubtle(props: Dict): {
+    container: {
+        bg: string;
+        borderColor: string;
+        borderWidth: number;
+        color: string;
+    };
+    button: {
+        color: string;
+        hoverBg: string;
+        activeBg: string;
+    };
+};
+declare const _default: {
+    baseStyle: {};
+    defaultProps: {
+        colorScheme: string;
+        variant: string;
+    };
+    parts: string[];
+    sizes: {};
+    variants: {
+        subtle: typeof variantSubtle;
+    };
+};
+export default _default;
+//# sourceMappingURL=theme.d.ts.map

package/dist/esm/notification/theme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/notification/theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAA;AAE/B,iBAAS,aAAa,CAAC,KAAK,EAAE,IAAI;;;;;;;;;;;;EA2BjC;;;;;;;;;;;;;AAiBD,wBAMC"}

package/dist/esm/p/index.d.ts

@@ -0,0 +1,4 @@
+export * from './p';
+export { default } from './p';
+export * from './p.types';
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/p/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/p/index.ts"],"names":[],"mappings":"AAAA,cAAc,KAAK,CAAA;AACnB,OAAO,EAAE,OAAO,EAAE,MAAM,KAAK,CAAA;AAC7B,cAAc,WAAW,CAAA"}

package/dist/esm/p/p.d.ts

@@ -0,0 +1,6 @@
+import { PProps } from './p.types';
+export declare const PBase: import("styled-components").StyledComponent<"p", import("styled-components").DefaultTheme, import("..").SystemProps, never>;
+/** Displays a paragraph of text. */
+export declare const P: import("../core").VuiComponent<"p", PProps>;
+export default P;
+//# sourceMappingURL=p.d.ts.map

package/dist/esm/p/p.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"p.d.ts","sourceRoot":"","sources":["../../../src/p/p.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAElC,eAAO,MAAM,KAAK,6HAEjB,CAAA;AAED,oCAAoC;AACpC,eAAO,MAAM,CAAC,6CAgBZ,CAAA;AAIF,eAAe,CAAC,CAAA"}

package/dist/esm/p/p.types.d.ts

@@ -0,0 +1,15 @@
+import { SystemProps, TypographyProps } from '../system';
+import { ThemingProps } from '../theme';
+export declare type PProps = SystemProps & ThemingProps<'P'> & {
+    /** Alias for textAlign prop. @deprecated */
+    align?: TypographyProps['textAlign'];
+    /** Alias for textTransform prop. @deprecated */
+    casing?: TypographyProps['textTransform'];
+    /** Alias for textDecoration prop. @deprecated */
+    decoration?: TypographyProps['textDecoration'];
+    /** Displays given text if no children are provided. */
+    text?: number | string;
+    /** Alias for fontWeight prop. @deprecated */
+    weight?: TypographyProps['fontWeight'];
+};
+//# sourceMappingURL=p.types.d.ts.map

package/dist/esm/p/p.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"p.types.d.ts","sourceRoot":"","sources":["../../../src/p/p.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,WAAW,CAAA;AACxD,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,oBAAY,MAAM,GAAG,WAAW,GAC/B,YAAY,CAAC,GAAG,CAAC,GAAG;IACnB,4CAA4C;IAC5C,KAAK,CAAC,EAAE,eAAe,CAAC,WAAW,CAAC,CAAA;IACpC,gDAAgD;IAChD,MAAM,CAAC,EAAE,eAAe,CAAC,eAAe,CAAC,CAAA;IACzC,iDAAiD;IACjD,UAAU,CAAC,EAAE,eAAe,CAAC,gBAAgB,CAAC,CAAA;IAC9C,uDAAuD;IACvD,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACtB,6CAA6C;IAC7C,MAAM,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAA;CACtC,CAAA"}

package/dist/esm/p/theme.d.ts

@@ -0,0 +1,31 @@
+declare const _default: {
+    baseStyle: {};
+    defaultProps: {
+        size: string;
+    };
+    sizes: {
+        sm: {
+            fontSize: string;
+            lineHeight: string;
+        };
+        md: {
+            fontSize: string;
+            lineHeight: string;
+        };
+        lg: {
+            fontSize: string;
+            lineHeight: string;
+        };
+        xl: {
+            fontSize: string;
+            lineHeight: string;
+        };
+        xxl: {
+            fontSize: string;
+            lineHeight: string;
+        };
+    };
+    variants: {};
+};
+export default _default;
+//# sourceMappingURL=theme.d.ts.map

package/dist/esm/p/theme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/p/theme.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+BA,wBAKC"}

package/dist/esm/pagination/context.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { PaginationContext } from './pagination.types';
+declare const PaginationProvider: import("react").Provider<PaginationContext>, usePaginationContext: () => PaginationContext;
+export { PaginationProvider, usePaginationContext };
+//# sourceMappingURL=context.d.ts.map

package/dist/esm/pagination/context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../src/pagination/context.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAA;AAEtD,QAAA,MAAO,kBAAkB,+CAAE,oBAAoB,yBAA0D,CAAA;AAEzG,OAAO,EAAE,kBAAkB,EAAE,oBAAoB,EAAE,CAAA"}

package/dist/esm/pagination/helpers.d.ts

@@ -0,0 +1,4 @@
+import { PaginationItem } from './pagination.types';
+/** Returns an array describing pagination items, like page buttons, prev/next arrows or ellipsis. */
+export declare function getPaginationItems(page: number, pageCount: number): PaginationItem[];
+//# sourceMappingURL=helpers.d.ts.map

package/dist/esm/pagination/helpers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../src/pagination/helpers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAA;AAOnD,qGAAqG;AACrG,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,oBA2CjE"}

package/dist/esm/pagination/helpers.js

@@ -0,0 +1,34 @@
+const range = (start, end) => {
+    const length = end - start + 1;
+    return Array.from({ length }, (_, i) => start + i);
+};
+/** Returns an array describing pagination items, like page buttons, prev/next arrows or ellipsis. */
+export function getPaginationItems(page, pageCount) {
+    const boundaryCount = 1;
+    const siblingCount = 1;
+    const startPages = range(1, Math.min(boundaryCount, pageCount));
+    const endPages = range(Math.max(pageCount - boundaryCount + 1, boundaryCount + 1), pageCount);
+    const siblingsStart = Math.max(Math.min(page - siblingCount, pageCount - boundaryCount - siblingCount * 2 - 1), boundaryCount + 2);
+    const siblingsEnd = Math.min(Math.max(page + siblingCount, boundaryCount + siblingCount * 2 + 2), endPages.length > 0 ? endPages[0] - 2 : pageCount - 1);
+    const items = [
+        'previous',
+        ...startPages,
+        // Start ellipsis
+        ...(siblingsStart > boundaryCount + 2
+            ? ['ellipsisStart']
+            : boundaryCount + 1 < pageCount - boundaryCount
+                ? [boundaryCount + 1]
+                : []),
+        // Sibling pages
+        ...range(siblingsStart, siblingsEnd),
+        // End ellipsis
+        ...(siblingsEnd < pageCount - boundaryCount - 1
+            ? ['ellipsisEnd']
+            : pageCount - boundaryCount > boundaryCount
+                ? [pageCount - boundaryCount]
+                : []),
+        ...endPages,
+        'next'
+    ];
+    return items;
+}

package/dist/esm/pagination/index.d.ts

@@ -0,0 +1,14 @@
+export * from './context';
+export * from './helpers';
+export * from './pagination';
+export { default } from './pagination';
+export * from './pagination.types';
+export * from './paginationButton';
+export * from './paginationEllipsis';
+export * from './paginationGoToPage';
+export * from './paginationNavigation';
+export * from './paginationPrevNext';
+export * from './paginationResults';
+export { default as usePagination } from './usePagination';
+export * from './usePagination.types';
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/pagination/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/pagination/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAA;AACzB,cAAc,WAAW,CAAA;AACzB,cAAc,cAAc,CAAA;AAC5B,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAA;AACtC,cAAc,oBAAoB,CAAA;AAClC,cAAc,oBAAoB,CAAA;AAClC,cAAc,sBAAsB,CAAA;AACpC,cAAc,sBAAsB,CAAA;AACpC,cAAc,wBAAwB,CAAA;AACtC,cAAc,sBAAsB,CAAA;AACpC,cAAc,qBAAqB,CAAA;AACnC,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC1D,cAAc,uBAAuB,CAAA"}

package/dist/esm/pagination/pagination.d.ts

@@ -0,0 +1,22 @@
+import { VuiComponent } from '../core';
+import { PaginationProps } from './pagination.types';
+import PaginationButton from './paginationButton';
+import PaginationEllipsis from './paginationEllipsis';
+import PaginationGoToPage from './paginationGoToPage';
+import PaginationNavigation from './paginationNavigation';
+import PaginationPrevNext from './paginationPrevNext';
+import PaginationResults from './paginationResults';
+/**
+ * Displays page navigation buttons together with page and item count.
+ * GoToPage component is shown automatically above 10 pages.
+ */
+export declare const Pagination: VuiComponent<"div", PaginationProps> & {
+    Button: typeof PaginationButton;
+    Ellipsis: typeof PaginationEllipsis;
+    GoToPage: typeof PaginationGoToPage;
+    Navigation: typeof PaginationNavigation;
+    PrevNext: typeof PaginationPrevNext;
+    Results: typeof PaginationResults;
+};
+export default Pagination;
+//# sourceMappingURL=pagination.d.ts.map

package/dist/esm/pagination/pagination.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pagination.d.ts","sourceRoot":"","sources":["../../../src/pagination/pagination.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAuB,YAAY,EAAE,MAAM,SAAS,CAAA;AAG3D,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAA;AACpD,OAAO,gBAAgB,MAAM,oBAAoB,CAAA;AACjD,OAAO,kBAAkB,MAAM,sBAAsB,CAAA;AACrD,OAAO,kBAAkB,MAAM,sBAAsB,CAAA;AACrD,OAAO,oBAAoB,MAAM,wBAAwB,CAAA;AACzD,OAAO,kBAAkB,MAAM,sBAAsB,CAAA;AACrD,OAAO,iBAAiB,MAAM,qBAAqB,CAAA;AAGnD;;;GAGG;AACH,eAAO,MAAM,UAAU;YAqDd,uBAAuB;cACrB,yBAAyB;cACzB,yBAAyB;gBACvB,2BAA2B;cAC7B,yBAAyB;aAC1B,wBAAwB;CACjC,CAAA;AAWD,eAAe,UAAU,CAAA"}

package/dist/esm/pagination/pagination.types.d.ts

@@ -0,0 +1,32 @@
+/// <reference types="react" />
+import { BoxProps } from '../box';
+import { ButtonProps } from '../button';
+import { ThemingProps } from '../theme';
+import { RenderProps } from '../utils';
+import { UsePaginationReturnType } from './usePagination';
+import { UsePaginationProps } from './usePagination.types';
+export declare type PaginationButtonProps = ButtonProps & {
+    /** Applies different styling to a button of the current page. */
+    isActive?: boolean;
+    /** Number of the page, which this button represents. */
+    page: number;
+};
+export declare type PaginationContext = UsePaginationReturnType & ThemingProps<'Pagination'>;
+export declare type PaginationItem = 'ellipsisEnd' | 'ellipsisStart' | 'next' | 'previous' | number;
+export declare type PaginationPrevNextProps = ButtonProps & {
+    /** Defines the logic of previous and next buttons. */
+    direction: 'previous' | 'next';
+};
+export declare type PaginationProps = Omit<BoxProps, 'size' | 'variant'> & ThemingProps<'Pagination'> & UsePaginationProps & {
+    /** Children provide render props using PaginationContext data. */
+    children?: RenderProps<PaginationContext>;
+    /** Socket for page input on the right side. */
+    goToPage?: JSX.Element;
+    /** Array describing pagination items, like page buttons, prev/next arrows or ellipsis. */
+    items?: PaginationItem[];
+    /** Socket for the main navigation elements in the middle. */
+    navigation?: JSX.Element;
+    /** Socket for numbers data on the left side. */
+    results?: JSX.Element;
+};
+//# sourceMappingURL=pagination.types.d.ts.map

package/dist/esm/pagination/pagination.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pagination.types.d.ts","sourceRoot":"","sources":["../../../src/pagination/pagination.types.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AACjC,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AACvC,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA;AACtC,OAAO,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAA;AACzD,OAAO,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAA;AAE1D,oBAAY,qBAAqB,GAAG,WAAW,GAAG;IACjD,iEAAiE;IACjE,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,wDAAwD;IACxD,IAAI,EAAE,MAAM,CAAA;CACZ,CAAA;AAED,oBAAY,iBAAiB,GAAG,uBAAuB,GAAG,YAAY,CAAC,YAAY,CAAC,CAAA;AAEpF,oBAAY,cAAc,GAAG,aAAa,GAAG,eAAe,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,CAAA;AAE3F,oBAAY,uBAAuB,GAAG,WAAW,GAAG;IACnD,sDAAsD;IACtD,SAAS,EAAE,UAAU,GAAG,MAAM,CAAA;CAC9B,CAAA;AAED,oBAAY,eAAe,GAAG,IAAI,CAAC,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC,GAC/D,YAAY,CAAC,YAAY,CAAC,GAC1B,kBAAkB,GAAG;IACpB,kEAAkE;IAClE,QAAQ,CAAC,EAAE,WAAW,CAAC,iBAAiB,CAAC,CAAA;IACzC,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAA;IACtB,0FAA0F;IAC1F,KAAK,CAAC,EAAE,cAAc,EAAE,CAAA;IACxB,6DAA6D;IAC7D,UAAU,CAAC,EAAE,GAAG,CAAC,OAAO,CAAA;IACxB,gDAAgD;IAChD,OAAO,CAAC,EAAE,GAAG,CAAC,OAAO,CAAA;CACrB,CAAA"}

package/dist/esm/pagination/paginationButton.d.ts

@@ -0,0 +1,5 @@
+import { PaginationButtonProps } from './pagination.types';
+/** Displays a page navigation button within the Pagination. */
+export declare const PaginationButton: import("../core").VuiComponent<"button", PaginationButtonProps>;
+export default PaginationButton;
+//# sourceMappingURL=paginationButton.d.ts.map

package/dist/esm/pagination/paginationButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"paginationButton.d.ts","sourceRoot":"","sources":["../../../src/pagination/paginationButton.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAA;AAE1D,+DAA+D;AAC/D,eAAO,MAAM,gBAAgB,iEA6B3B,CAAA;AAIF,eAAe,gBAAgB,CAAA"}

package/dist/esm/pagination/paginationButton.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import Button from '../button';
+import { useStyleConfig, vui } from '../core';
+import { cs } from '../utils';
+import { usePaginationContext } from './context';
+/** Displays a page navigation button within the Pagination. */
+export const PaginationButton = vui((props, ref) => {
+    const { className, isActive: isActiveProp, page: pageProp, ...rest } = props;
+    const { onPageChange, page } = usePaginationContext();
+    const styles = useStyleConfig('Pagination', usePaginationContext());
+    const isActive = isActiveProp ?? pageProp === page;
+    const activeProps = isActive
+        ? {
+            bg: 'blue.20',
+            color: 'blue.80',
+            hoverBg: 'blue.30',
+            activeBg: 'blue.40'
+        }
+        : {};
+    return (React.createElement(Button, { className: cs('vui-paginationButton', className), minW: 0, onClick: () => onPageChange(pageProp), ref: ref, size: "sm", text: pageProp, variant: "text", ...styles.button, ...activeProps, ...rest }));
+});
+PaginationButton.displayName = 'PaginationButton';
+export default PaginationButton;

package/dist/esm/pagination/paginationEllipsis.d.ts

@@ -0,0 +1,5 @@
+import { BoxProps } from '../box';
+/** Displays '...' ellipsis for hidden pages. */
+export declare const PaginationEllipsis: import("../core").VuiComponent<"span", BoxProps>;
+export default PaginationEllipsis;
+//# sourceMappingURL=paginationEllipsis.d.ts.map

package/dist/esm/pagination/paginationEllipsis.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"paginationEllipsis.d.ts","sourceRoot":"","sources":["../../../src/pagination/paginationEllipsis.tsx"],"names":[],"mappings":"AAEA,OAAY,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AAKtC,gDAAgD;AAChD,eAAO,MAAM,kBAAkB,kDAgB7B,CAAA;AAIF,eAAe,kBAAkB,CAAA"}

package/dist/esm/pagination/paginationEllipsis.js

@@ -0,0 +1,13 @@
+import React from 'react';
+import Box from '../box';
+import { useStyleConfig, vui } from '../core';
+import { cs } from '../utils';
+import { usePaginationContext } from './context';
+/** Displays '...' ellipsis for hidden pages. */
+export const PaginationEllipsis = vui((props, ref) => {
+    const { children, className, ...rest } = props;
+    const styles = useStyleConfig('Pagination', usePaginationContext());
+    return (React.createElement(Box, { alignItems: "center", className: cs('vui-paginationEllipsis', className), px: "10px", ref: ref, ...styles.ellipsis, ...rest }, children ?? '...'));
+});
+PaginationEllipsis.displayName = 'PaginationEllipsis';
+export default PaginationEllipsis;

package/dist/esm/pagination/paginationGoToPage.d.ts

@@ -0,0 +1,5 @@
+import { BoxProps } from '../box';
+/** Displays a number input, which allows quickly jumping between pages. */
+export declare const PaginationGoToPage: import("../core").VuiComponent<"div", BoxProps>;
+export default PaginationGoToPage;
+//# sourceMappingURL=paginationGoToPage.d.ts.map

package/dist/esm/pagination/paginationGoToPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"paginationGoToPage.d.ts","sourceRoot":"","sources":["../../../src/pagination/paginationGoToPage.tsx"],"names":[],"mappings":"AAEA,OAAY,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AAOtC,2EAA2E;AAC3E,eAAO,MAAM,kBAAkB,iDA8B7B,CAAA;AAIF,eAAe,kBAAkB,CAAA"}