@ckbox/components 1.1.1-dev.0 → 1.2.0-dev.0

package/dist/utils/validators/validators.d.ts

@@ -0,0 +1,60 @@
+/**
+ * Defines validators that can be used to check various user inputs.
+ * They are intended to be used downstream to build validation rules for HTML forms.
+ *
+ * Validators must conform to the convention used by `react-hook-form`: They must return either `boolean` or an error message.
+ * For more info see `validate` option: https://react-hook-form.com/api/useform/register
+ */
+/**
+ * Creates validation rule that checks if supplied `value` is non-empty.
+ * Whitespaces are trimmed before the check.
+ *
+ * @param msg error message
+ * @returns validator that returns `true` if check passes, error message otherwise
+ */
+export declare const nonEmpty: (msg: string) => (value?: string) => string | true;
+/**
+ * Creates validation rule that checks if supplied `value` is present in `allowedValues`.
+ *
+ * @param msg error message
+ * @param allowedValues list of allowed values
+ * @returns validator that returns `true` if check passes, error message otherwise
+ */
+export declare const isAllowed: <T>(msg: string, allowedValues: T[]) => (value?: T | undefined) => string | true;
+/**
+ * Creates validation rule that checks if supplied array has at least one item.
+ *
+ * @param msg error message
+ * @returns validator that returns `true` if check passes, error message otherwise
+ */
+export declare const nonEmptyArray: <T>(msg: string) => (value?: T[] | undefined) => string | true;
+/**
+ * Creates validation rule that checks if supplied array does not exceed `max` items.
+ *
+ * @param msg error message
+ * @returns validator that returns `true` if check passes, error message otherwise
+ */
+export declare const maxItems: <T>(msg: string, max: number) => (value?: T[] | undefined) => string | true;
+/**
+ * Creates validation rule that checks if supplied `value` is not already present within `existingValues`.
+ *
+ * @param msg error message
+ * @param existingValues list of existing values
+ * @returns validator that returns `true` if check passes, error message otherwise
+ */
+export declare const unique: <T>(msg: string, existingValues: T[]) => (value?: T | undefined) => string | true;
+/**
+ * Creates validation rule that checks if supplied value contains a dot.
+ *
+ * @param msg error message
+ * @returns validator that returns `true` if check passes, error message otherwise
+ */
+export declare const nonDotValue: (msg: string) => (values?: string[]) => string | true;
+/**
+ * Creates validation rule that checks if string length in an array doesn't exceed max length.
+ *
+ * @param msg error message
+ * @param maxLength maximum length of the string in the array
+ * @returns validator that returns `true` if check passes, error message otherwise
+ */
+export declare const maxLength: (msg: string, maxLength: number) => (values?: string[]) => string | true;

package/dist/view/View.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+declare const View: React.FC<Props>;
+interface Props {
+    /**
+     * Sets component's children.
+     */
+    children?: React.ReactNode;
+    /**
+     * Indicates whether view contains side content.
+     */
+    sideContent?: boolean;
+}
+export default View;

package/dist/view/content/ViewContent.d.ts

@@ -0,0 +1,25 @@
+import * as React from 'react';
+declare const ViewContent: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLDivElement>>;
+interface Props {
+    /**
+     * Sets component's children.
+     */
+    children?: React.ReactNode;
+    /**
+     * Indicates if content's area is active.
+     */
+    active?: boolean;
+    /**
+     * Sets content `mousedown` event handler.
+     */
+    onMouseDown?: React.MouseEventHandler<HTMLDivElement>;
+    /**
+     * Sets content `keydown` event handler.
+     */
+    onKeyDown?: React.KeyboardEventHandler;
+    /**
+     * Indicates if content contains bar.
+     */
+    contentBar?: boolean;
+}
+export default ViewContent;

package/dist/view/content/index.d.ts

@@ -0,0 +1 @@
+export { default } from './ViewContent';

package/dist/view/contentBar/ViewContentBar.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+declare const ViewContentBar: React.FC<Props>;
+interface Props {
+    /**
+     * Sets component's children.
+     */
+    children?: React.ReactNode;
+}
+export default ViewContentBar;

package/dist/view/contentBar/index.d.ts

@@ -0,0 +1 @@
+export { default } from './ViewContentBar';

package/dist/view/contentWrapper/ViewContentWrapper.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+declare const ViewContentWrapper: React.FC<Props>;
+interface Props {
+    /**
+     * Sets component's children.
+     */
+    children?: React.ReactNode;
+}
+export default ViewContentWrapper;

package/dist/view/contentWrapper/index.d.ts

@@ -0,0 +1 @@
+export { default } from './ViewContentWrapper';

package/dist/view/footer/ViewFooter.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+declare const ViewFooter: React.FC<Props>;
+interface Props {
+    /**
+     * Sets component's children.
+     */
+    children?: React.ReactNode;
+}
+export default ViewFooter;

package/dist/view/footer/index.d.ts

@@ -0,0 +1 @@
+export { default } from './ViewFooter';

package/dist/view/header/ViewHeader.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+declare const ViewHeader: React.FC<Props>;
+interface Props {
+    /**
+     * Sets component's children.
+     */
+    children?: React.ReactNode;
+}
+export default ViewHeader;

package/dist/view/header/index.d.ts

@@ -0,0 +1 @@
+export { default } from './ViewHeader';

package/dist/view/index.d.ts

@@ -0,0 +1,8 @@
+export { default } from './View';
+export { default as View } from './View';
+export { default as ViewContent } from './content';
+export { default as ViewContentBar } from './contentBar';
+export { default as ViewFooter } from './footer';
+export { default as ViewHeader } from './header';
+export { default as ViewSideContent } from './sideContent';
+export { default as ViewContentWrapper } from './contentWrapper';

package/dist/view/sideContent/ViewSideContent.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+declare const ViewSideContent: React.FC<Props>;
+interface Props {
+    /**
+     * Sets component's children.
+     */
+    children?: React.ReactNode;
+}
+export default ViewSideContent;

package/dist/view/sideContent/index.d.ts

@@ -0,0 +1 @@
+export { default } from './ViewSideContent';

package/dist/viewDialog/ViewDialog.d.ts

@@ -0,0 +1,66 @@
+import * as React from 'react';
+import { Dimensions } from '../utils';
+declare const ViewDialog: React.FC<Props>;
+export interface Props {
+    /**
+     * Main content of the component.
+     */
+    children: React.ReactNode;
+    /**
+     * Label of close button.
+     */
+    closeLabel?: string;
+    /**
+     * Initial height of dialog window.
+     */
+    height: number | string;
+    /**
+     * Initial offset from the left.
+     */
+    left?: number;
+    /**
+     * Minimum height (in px) of dialog window.
+     */
+    minHeight?: number;
+    /**
+     * Minimum width (in px) of dialog window.
+     */
+    minWidth?: number;
+    /**
+     * Callback invoked upon closing of dialog window.
+     */
+    onClose?: () => void;
+    /**
+     * Callback invoked whenever dialog dragging is completed.
+     */
+    onDragEnd?: (dimensions: Dimensions) => void;
+    /**
+     * Callback invoked whenever dialog resizing is completed.
+     */
+    onResizeEnd?: (dimensions: Dimensions) => void;
+    /**
+     * Toggles open state of dialog window.
+     */
+    open: boolean;
+    /**
+     * Label of resize button (SE direction).
+     */
+    resizeSELabel?: string;
+    /**
+     * Label of resize button (SW direction).
+     */
+    resizeSWLabel?: string;
+    /**
+     * Initial offset from the top.
+     */
+    top?: number;
+    /**
+     * Initial width of dialog window.
+     */
+    width: number | string;
+    /**
+     * Label of the root dialog element.
+     */
+    label?: string;
+}
+export default ViewDialog;

package/dist/viewDialog/index.d.ts

@@ -0,0 +1,2 @@
+export { Props as ViewDialogProps } from './ViewDialog';
+export { default } from './ViewDialog';

package/dist/viewDialog/useSetInitialDimensions/index.d.ts

@@ -0,0 +1 @@
+export * from './useSetInitialDimensions';

package/dist/viewDialog/useSetInitialDimensions/useSetInitialDimensions.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Hook that allows to set initial dimensions for ViewDialog element and ensures it is visible within document constraints.
+ *
+ * @param draggableEl target element to set dimensions for
+ * @param height height attempted to be set on target
+ * @param width width attempted to be set on target
+ * @param left left offset attempted to be set on target
+ * @param top top offset attempted to be set on target
+ */
+export declare const useSetInitialDimensions: (draggableEl: HTMLElement | null, height: number | string, width: number | string, left?: number, top?: number) => void;

package/dist/viewWrapper/ViewWrapper.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+declare const ViewWrapper: React.FC<Props>;
+export interface Props {
+    /**
+     * Main content of the component.
+     */
+    children: React.ReactNode;
+    /**
+     * Sets navbar.
+     */
+    navbar?: React.ReactNode;
+}
+export default ViewWrapper;

package/dist/viewWrapper/index.d.ts

@@ -0,0 +1 @@
+export { default } from './ViewWrapper';

package/package.json

@@ -20,7 +20,7 @@
   ],
   "license": "SEE LICENSE IN LICENSE.md",
   "name": "@ckbox/components",
-  "version": "1.1.1-dev.0",
+  "version": "1.2.0-dev.0",
   "description": "UI components of CKBox",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -29,14 +29,14 @@
     "react-dom": "^18"
   },
   "dependencies": {
-    "@popperjs/core": "^2.11.5",
+    "@popperjs/core": "^2.11.6",
     "@types/react-transition-group": "^4.4.5",
-    "blurhash": "^1.1.5",
+    "blurhash": "^2.0.4",
     "lodash": "^4.17.21",
     "react-dnd": "^16.0.1",
     "react-dnd-html5-backend": "^16.0.1",
     "react-focus-lock": "^2.9.1",
-    "react-transition-group": "^4.4.2",
-    "tslib": "^2.4.0"
+    "react-transition-group": "^4.4.5",
+    "tslib": "^2.4.1"
   }
 }