@openfin/ui-library 0.1.0 → 0.1.2-alpha.1616610135

package/dist/components/elements/Icon/icon.variants.js

@@ -1,60 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.variants = exports.Variant = void 0;
-const styled_components_1 = require("styled-components");
-/**
- * Define all Button Variants here in one place.
- * Variants should match the variants in Figma
- */
-exports.Variant = {
-    iconSize: 'iconSize',
-    containerSize: 'containerSize',
-};
-exports.variants = {
-    [exports.Variant.iconSize]: {
-        xsmall: styled_components_1.css `
-      --px-icon: ${({ theme }) => theme.iconSize.xsmall};
-    `,
-        small: styled_components_1.css `
-      --px-icon: ${({ theme }) => theme.iconSize.small};
-    `,
-        base: styled_components_1.css `
-      --px-icon: ${({ theme }) => theme.iconSize.base};
-    `,
-        large: styled_components_1.css `
-      --px-icon: ${({ theme }) => theme.iconSize.large};
-    `,
-        xlarge: styled_components_1.css `
-      --px-icon: ${({ theme }) => theme.iconSize.xlarge};
-    `,
-        xxlarge: styled_components_1.css `
-      --px-icon: ${({ theme }) => theme.iconSize.xxlarge};
-    `,
-        xxxlarge: styled_components_1.css `
-      --px-icon: ${({ theme }) => theme.iconSize.xxxlarge};
-    `,
-    },
-    [exports.Variant.containerSize]: {
-        xsmall: styled_components_1.css `
-      --px-container: ${({ theme }) => theme.iconSize.xsmall};
-    `,
-        small: styled_components_1.css `
-      --px-container: ${({ theme }) => theme.iconSize.small};
-    `,
-        base: styled_components_1.css `
-      --px-container: ${({ theme }) => theme.iconSize.base};
-    `,
-        large: styled_components_1.css `
-      --px-container: ${({ theme }) => theme.iconSize.large};
-    `,
-        xlarge: styled_components_1.css `
-      --px-container: ${({ theme }) => theme.iconSize.xlarge};
-    `,
-        xxlarge: styled_components_1.css `
-      --px-container: ${({ theme }) => theme.iconSize.xxlarge};
-    `,
-        xxxlarge: styled_components_1.css `
-      --px-container: ${({ theme }) => theme.iconSize.xxxlarge};
-    `,
-    },
-};

package/dist/components/elements/Icon/index.d.ts

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

package/dist/components/elements/Icon/index.js

@@ -1,13 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./icon"), exports);

package/dist/components/input/Input/index.d.ts

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

package/dist/components/input/Input/index.js

@@ -1,13 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./input"), exports);

package/dist/components/input/Input/input.d.ts

@@ -1,6 +0,0 @@
-import { InputHTMLAttributes } from 'react';
-export declare type InputProps = InputHTMLAttributes<HTMLInputElement>;
-/**
- * Unstyled Input extended by other components
- */
-export declare const Input: import("styled-components").StyledComponent<"input", import("styled-components").DefaultTheme, {}, never>;

package/dist/components/input/Input/input.js

@@ -1,12 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Input = void 0;
-const styled_components_1 = __importDefault(require("styled-components"));
-/**
- * Unstyled Input extended by other components
- */
-exports.Input = styled_components_1.default.input ``;
-exports.Input.displayName = 'Input';

package/dist/components/input/TextInput/index.d.ts

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

package/dist/components/input/TextInput/index.js

@@ -1,13 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./textInput"), exports);

package/dist/components/input/TextInput/textInput.d.ts

@@ -1,3 +0,0 @@
-import { FC, InputHTMLAttributes } from 'react';
-export declare type TextInputProps = InputHTMLAttributes<HTMLInputElement>;
-export declare const TextInput: import("styled-components").StyledComponent<FC<TextInputProps>, import("styled-components").DefaultTheme, {}, never>;

package/dist/components/input/TextInput/textInput.js

@@ -1,30 +0,0 @@
-"use strict";
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TextInput = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const styled_components_1 = __importDefault(require("styled-components"));
-const Input_1 = require("../Input");
-const TextInputInner = (_a) => {
-    var { className } = _a, rest = __rest(_a, ["className"]);
-    return (jsx_runtime_1.jsx(Input_1.Input, Object.assign({ className: className, type: "text" }, rest), void 0));
-};
-exports.TextInput = styled_components_1.default(TextInputInner) `
-  background: ${({ theme }) => theme.palette.inputBg};
-  border: 1px solid ${({ theme }) => theme.palette.inputBg};
-  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
-  color: ${({ theme }) => theme.palette.inputColor};
-`;

package/dist/components/layout/Box/box.d.ts

@@ -1,41 +0,0 @@
-import { HTMLAttributes } from 'react';
-import { UnitPxType } from '../../system/ThemeProvider/lib/types';
-import * as BoxTypes from './types';
-export declare type BoxProps = HTMLAttributes<HTMLDivElement> & {
-    alignItems?: BoxTypes.AlignItems;
-    display?: BoxTypes.Display;
-    flexDirection?: BoxTypes.FlexDirection;
-    flexWrap?: BoxTypes.FlexWrap;
-    justifyContent?: BoxTypes.JustifyContent;
-    gap?: UnitPxType;
-    alignSelf?: BoxTypes.AlignSelf;
-    flexBasis?: string;
-    flexGrow?: 1 | 0;
-    flexShrink?: 1 | 0;
-    order?: number;
-    background?: BoxTypes.BackgroundLevel;
-    padding?: UnitPxType;
-};
-/**
- * ## Box
- *
- * Div with flexbox properties applied to their CSS default values.
- *
- * - Box can be both the flex parent and the flex child.
- * - None of the child properties should be applied unless specified.
- */
-export declare const Box: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, HTMLAttributes<HTMLDivElement> & {
-    alignItems?: BoxTypes.AlignItems | undefined;
-    display?: BoxTypes.Display | undefined;
-    flexDirection?: BoxTypes.FlexDirection | undefined;
-    flexWrap?: BoxTypes.FlexWrap | undefined;
-    justifyContent?: BoxTypes.JustifyContent | undefined;
-    gap?: "xsmall" | "small" | "base" | "large" | "xlarge" | "xxlarge" | "xxxlarge" | "xxxxlarge" | undefined;
-    alignSelf?: BoxTypes.AlignSelf | undefined;
-    flexBasis?: string | undefined;
-    flexGrow?: 0 | 1 | undefined;
-    flexShrink?: 0 | 1 | undefined;
-    order?: number | undefined;
-    background?: BoxTypes.BackgroundLevel | undefined;
-    padding?: "xsmall" | "small" | "base" | "large" | "xlarge" | "xxlarge" | "xxxlarge" | "xxxxlarge" | undefined;
-}, never>;

package/dist/components/layout/Box/box.js

@@ -1,44 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Box = void 0;
-const styled_components_1 = __importDefault(require("styled-components"));
-const palette_1 = require("../../system/ThemeProvider/lib/palette");
-/**
- * ## BackgroundLevels
- * Maps background levels to palette colors.
- */
-const BackgroundLevels = {
-    1: palette_1.Palette.background1,
-    2: palette_1.Palette.background2,
-    3: palette_1.Palette.background3,
-    4: palette_1.Palette.background4,
-    5: palette_1.Palette.background5,
-    6: palette_1.Palette.background6,
-};
-/**
- * ## Box
- *
- * Div with flexbox properties applied to their CSS default values.
- *
- * - Box can be both the flex parent and the flex child.
- * - None of the child properties should be applied unless specified.
- */
-exports.Box = styled_components_1.default.div `
-  display: ${({ display = 'flex' }) => display};
-  flex-direction: ${({ flexDirection = 'row' }) => flexDirection};
-  flex-wrap: ${({ flexWrap = 'nowrap' }) => flexWrap};
-  align-items: ${({ alignItems }) => alignItems};
-  justify-content: ${({ justifyContent }) => justifyContent};
-  gap: ${({ theme, gap }) => gap && theme.px[gap]};
-  align-self: ${({ alignSelf }) => alignSelf};
-  flex-basis: ${({ flexBasis }) => flexBasis};
-  flex-grow: ${({ flexGrow }) => flexGrow};
-  flex-shrink: ${({ flexShrink }) => flexShrink};
-  order: ${({ order }) => order};
-  padding: ${({ theme, padding }) => padding && theme.px[padding]};
-  background: ${({ theme, background }) => background && theme.palette[BackgroundLevels[background]]};
-`;
-exports.Box.displayName = 'Box';

package/dist/components/layout/Box/index.d.ts

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

package/dist/components/layout/Box/index.js

@@ -1,13 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./box"), exports);

package/dist/components/layout/Box/types.d.ts

@@ -1,7 +0,0 @@
-export declare type AlignItems = 'stretch' | 'flex-start' | 'flex-end' | 'center' | 'baseline' | 'first baseline' | 'last baseline' | 'start' | 'end' | 'self-start' | 'self-end';
-export declare type Display = 'flex' | 'inline-flex';
-export declare type FlexDirection = 'row' | 'row-reverse' | 'column' | 'column-reverse';
-export declare type FlexWrap = 'nowrap' | 'wrap' | 'wrap-reverse';
-export declare type JustifyContent = 'stretch' | 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly' | 'start' | 'end' | 'left' | 'right';
-export declare type AlignSelf = 'auto' | 'flex-start' | ' flex-end' | 'center' | 'baseline' | 'stretch';
-export declare type BackgroundLevel = 1 | 2 | 3 | 4 | 5 | 6;

package/dist/components/layout/Box/types.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/components/system/GlobalStyles/globalStyles.d.ts

@@ -1 +0,0 @@
-export declare const GlobalStyles: import("styled-components").GlobalStyleComponent<{}, import("styled-components").DefaultTheme>;

package/dist/components/system/GlobalStyles/globalStyles.js

@@ -1,54 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.GlobalStyles = void 0;
-const styled_components_1 = require("styled-components");
-const constants_1 = require("../ThemeProvider/lib/constants");
-const helpers_1 = require("../ThemeProvider/lib/helpers");
-exports.GlobalStyles = styled_components_1.createGlobalStyle `
-  /** -> Define Global CSS Vars */
-  :root {
-    --global-background: ${({ theme }) => theme.palette.background1};
-    --global-text: ${({ theme }) => theme.palette.textDefault};
-    --global-text-placeholder: ${({ theme }) => theme.palette.inputPlaceholder};
-    --global-typography: ${constants_1.Typography.base};
-    --global-transition: ${({ theme }) => theme.transition.base};
-  }
-
-  /** -> @font-face Declaration */
-  ${helpers_1.getFontFaces}
-
-  /** -> Micro Reset */
-  * {
-    box-sizing: border-box;
-    margin: 0;
-    padding: 0;
-    /**
-     * Smooths light-on-dark Fonts on Mac
-     */
-    -webkit-font-smoothing: antialiased;
-    /**
-     * Prevent browser auto-weighting
-     * @link https://css-tricks.com/almanac/properties/f/font-synthesis/
-     */
-    font-synthesis: none;
-  }
-
-  /** -> Apply Global Styles */
-  :root,
-  body {
-    background: var(--global-background);
-    color: var(--global-text);
-    font: var(--global-typography);
-  }
-
-  ::placeholder {
-    color: var(--global-text-placeholder);
-  }
-
-  /** -> Reduced Motion (Accessibility) */
-  @media (prefers-reduced-motion) {
-    :root {
-      --global-transition: ${({ theme }) => theme.transition.none};
-    }
-  }
-`;

package/dist/components/system/GlobalStyles/index.d.ts

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

package/dist/components/system/GlobalStyles/index.js

@@ -1,13 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./globalStyles"), exports);

package/dist/components/system/ThemeProvider/index.d.ts

@@ -1,6 +0,0 @@
-export * from './lib/constants';
-export * from './lib/helpers';
-export * from './lib/interface';
-export * from './lib/palette';
-export * from './lib/types';
-export * from './themeProvider';

package/dist/components/system/ThemeProvider/index.js

@@ -1,18 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./lib/constants"), exports);
-__exportStar(require("./lib/helpers"), exports);
-__exportStar(require("./lib/interface"), exports);
-__exportStar(require("./lib/palette"), exports);
-__exportStar(require("./lib/types"), exports);
-__exportStar(require("./themeProvider"), exports);

package/dist/components/system/ThemeProvider/lib/config.d.ts

@@ -1,7 +0,0 @@
-/**
- * Configuration
- */
-export declare type ConfigurationType = {
-    fontLoading: 'cdn' | 'base64';
-};
-export declare const Configuration: ConfigurationType;

package/dist/components/system/ThemeProvider/lib/config.js

@@ -1,9 +0,0 @@
-"use strict";
-/**
- * Configuration
- */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Configuration = void 0;
-exports.Configuration = {
-    fontLoading: 'cdn',
-};