@veeqo/ui 0.1.18 → 0.1.19

package/dist/theme/modules/layers.d.ts

@@ -0,0 +1,6 @@
+export declare const layers: {
+    base: number;
+    popup: number;
+    modal: number;
+    tooltip: number;
+};

package/dist/theme/modules/radius.d.ts

@@ -0,0 +1,7 @@
+export declare const radius: {
+    sm: string;
+    base: string;
+    md: string;
+    lg: string;
+    full: string;
+};

package/dist/theme/modules/shadows.d.ts

@@ -0,0 +1,6 @@
+export declare enum Shadows {
+    sm = "0px 1px 3px rgba(55, 66, 77, 0.15)",
+    base = "0px 4px 6px rgba(27, 33, 38, 0.2)",
+    md = "0px 10px 15px rgba(27, 33, 38, 0.2)",
+    lg = "0px 20px 25px rgba(27, 33, 38, 0.2)"
+}

package/dist/theme/modules/sizes.d.ts

@@ -0,0 +1,20 @@
+declare enum SizeAlias {
+    none = "none",
+    line = "line",
+    xs = "xs",
+    sm = "sm",
+    base = "base",
+    md = "md",
+    lg = "lg",
+    xl = "xl",
+    xxl = "xxl"
+}
+export type SizeScaleIndex = number | keyof typeof SizeAlias;
+export type SizeScale = {
+    [index: number]: string;
+    [index: string]: string;
+};
+export declare const sizeScale: SizeScale;
+export declare const sizeAliases: SizeScale;
+export declare const sizes: SizeScale;
+export {};

package/dist/theme/modules/text.d.ts

@@ -0,0 +1,315 @@
+export declare const common: {
+    fontFamily: string;
+};
+export declare const text: {
+    headingXXL: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    headingXL: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    headingLarge: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    headingMedium: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    headingSmall: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    headingTable: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    subheadingLarge: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: string;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    subheadingMedium: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: string;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    subheadingSmall: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: string;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    subheadingSmallBold: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    body: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: string;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    bodySmall: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: string;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    bodyBold: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    bodyBoldDark: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    bodySmallBold: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    button: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    buttonSmall: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    linkLarge: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: string;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    linkMedium: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: string;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    link: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: string;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    linkSmall: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: string;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    inputLabel: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    inputLabelSmall: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    hintText: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: string;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    placeholder: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: string;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    placeholderSmall: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: string;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    placeholderCode: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: string;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    placeholderCodeSmall: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: string;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    error: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    errorSmall: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+    successSmall: {
+        fontFamily: string;
+        fontStyle: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+        color: string;
+        textDecoration: string;
+        letterSpacing: string;
+    };
+};

package/dist/theme/storybook/components.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const Swatch: ({ color }: any) => React.JSX.Element;

package/dist/utils/buildClassnames.d.ts

@@ -0,0 +1 @@
+export declare const buildClassnames: (names: (string | undefined)[]) => string;

package/dist/utils/color.d.ts

@@ -0,0 +1,13 @@
+/**
+ * A function to convert hex color to rgb.
+ */
+export declare const hexToRgb: (hex: string) => {
+    r: number;
+    g: number;
+    b: number;
+} | null;
+/**
+ * A function to get a hex color with opacity, after converting to `rgba`.
+ * @param hex color in hex format
+ */
+export declare const getOpaqueHexColor: (hex: string, opacity: number) => string;

package/dist/utils/generateId.d.ts

@@ -0,0 +1 @@
+export declare const generateId: (prefix: string) => string;

package/dist/utils/index.d.ts

@@ -0,0 +1,3 @@
+export { buildClassnames } from './buildClassnames';
+export { getOpaqueHexColor, hexToRgb } from './color';
+export { generateId } from './generateId';

package/dist/utils/paginationList.d.ts

@@ -0,0 +1,4 @@
+export declare const paginationDefaultRangeList: {
+    label: string;
+    value: number;
+}[];

package/dist/utils/setupIntersectionObserverMock.d.ts

@@ -0,0 +1,18 @@
+/**
+ * https://stackoverflow.com/a/58651649
+ *
+ * Utility function that mocks the `IntersectionObserver` API. Necessary for components that rely
+ * on it, otherwise the tests will crash. Recommended to execute inside `beforeEach`.
+ * @param intersectionObserverMock - Parameter that is sent to the `Object.defineProperty`
+ * overwrite method. `jest.fn()` mock functions can be passed here if the goal is to not only
+ * mock the intersection observer, but its methods.
+ */
+export declare function setupIntersectionObserverMock({ root, rootMargin, thresholds, disconnect, observe, takeRecords, unobserve, }?: {
+    root?: null | undefined;
+    rootMargin?: string | undefined;
+    thresholds?: never[] | undefined;
+    disconnect?: (() => null) | undefined;
+    observe?: (() => null) | undefined;
+    takeRecords?: (() => never[]) | undefined;
+    unobserve?: (() => null) | undefined;
+}): void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@veeqo/ui",
-  "version": "0.1.18",
+  "version": "0.1.19",
   "description": "New optimised component library for Veeqo.",
   "author": "Robert Wealthall",
   "license": "UNLICENSED",