@veracity/vui 0.0.1

package/system/transitions.d.ts

@@ -0,0 +1,33 @@
+import { ITheme, SystemProp, VariantsType } from '@xstyled/system';
+import { VuiTheme } from '../theme';
+export declare type TransitionGetter<T extends ITheme = VuiTheme> = VariantsType<T['transitions']>;
+export declare type TransitionPropertyGetter<T extends ITheme = VuiTheme> = VariantsType<T['transitionProperties']>;
+export declare type TimingFunctionGetter<T extends ITheme = VuiTheme> = VariantsType<T['timingFunctions']>;
+declare type TransitionProp<T extends ITheme> = SystemProp<TransitionGetter<T>, T>;
+export interface TransitionProps<T extends ITheme = VuiTheme> {
+    transition?: TransitionProp<T>;
+    hoverTransition?: TransitionProp<T>;
+}
+declare type TransitionPropertyProp<T extends ITheme> = SystemProp<TransitionPropertyGetter<T>, T>;
+export interface TransitionPropertyProps<T extends ITheme = VuiTheme> {
+    transitionProperty?: TransitionPropertyProp<T>;
+    hoverTransitionProperty?: TransitionPropertyProp<T>;
+}
+declare type TransitionDurationProp<T extends ITheme> = SystemProp<any, T>;
+export interface TransitionDurationProps<T extends ITheme = VuiTheme> {
+    transitionDuration?: TransitionDurationProp<T>;
+    hoverTransitionDuration?: TransitionDurationProp<T>;
+}
+declare type TransitionTimingFunctionProp<T extends ITheme> = SystemProp<TimingFunctionGetter<T>, T>;
+export interface TransitionTimingFunctionProps<T extends ITheme = VuiTheme> {
+    transitionTimingFunction?: TransitionTimingFunctionProp<T>;
+    hoverTransitionTimingFunction?: TransitionTimingFunctionProp<T>;
+}
+declare type TransitionDelayProp<T extends ITheme> = SystemProp<number, T>;
+export interface TransitionDelayProps<T extends ITheme = VuiTheme> {
+    transitionDelay?: TransitionDelayProp<T>;
+    hoverTransitionDelay?: TransitionDelayProp<T>;
+}
+export interface TransitionsProps<T extends ITheme = VuiTheme> extends TransitionProps<T>, TransitionPropertyProps<T>, TransitionDurationProps<T>, TransitionTimingFunctionProps<T>, TransitionDelayProps<T> {
+}
+export {};

package/system/transitions.js

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

package/system/typography.d.ts

@@ -0,0 +1,59 @@
+import { ITheme, SystemProp, VariantsType } from '@xstyled/system';
+import * as CSS from 'csstype';
+import { ColorGetter } from './colors';
+import { VuiTheme } from '../theme';
+export declare type FontGetter<T extends ITheme = VuiTheme> = VariantsType<T['fonts']>;
+export declare type FontSizeGetter<T extends ITheme = VuiTheme> = VariantsType<T['fontSizes']>;
+export declare type FontWeightGetter<T extends ITheme = VuiTheme> = VariantsType<T['fontWeights']>;
+export declare type LineHeightGetter<T extends ITheme = VuiTheme> = VariantsType<T['lineHeights']>;
+declare type FontFamilyProp<T extends ITheme> = SystemProp<FontGetter<T>, T>;
+export interface FontFamilyProps<T extends ITheme = VuiTheme> {
+    fontFamily?: FontFamilyProp<T>;
+    hoverFontFamily?: FontFamilyProp<T>;
+}
+declare type FontSizeProp<T extends ITheme> = SystemProp<FontSizeGetter<T>, T>;
+export interface FontSizeProps<T extends ITheme = VuiTheme> {
+    fontSize?: FontSizeProp<T>;
+    hoverFontSize?: FontSizeProp<T>;
+}
+declare type LineHeightProp<T extends ITheme> = SystemProp<LineHeightGetter<T>, T>;
+export interface LineHeightProps<T extends ITheme = VuiTheme> {
+    lineHeight?: LineHeightProp<T>;
+    hoverLineHeight?: LineHeightProp<T>;
+}
+declare type FontWeightProp<T extends ITheme> = SystemProp<FontWeightGetter<T>, T>;
+export interface FontWeightProps<T extends ITheme = VuiTheme> {
+    fontWeight?: FontWeightProp<T>;
+    hoverFontWeight?: FontWeightProp<T>;
+}
+declare type FontStyleProp<T extends ITheme> = SystemProp<CSS.Property.FontStyle, T>;
+export interface FontStyleProps<T extends ITheme = VuiTheme> {
+    fontStyle?: FontStyleProp<T>;
+    hoverFontStyle?: FontStyleProp<T>;
+}
+declare type ColorProp<T extends ITheme> = SystemProp<ColorGetter<T>, T>;
+export interface ColorProps<T extends ITheme = VuiTheme> {
+    color?: ColorProp<T>;
+    disabledColor?: ColorProp<T>;
+    hoverColor?: ColorProp<T>;
+    placeholderColor?: ColorProp<T>;
+}
+declare type TextTransformProp<T extends ITheme> = SystemProp<CSS.Property.TextTransform, T>;
+export interface TextTransformProps<T extends ITheme = VuiTheme> {
+    textTransform?: TextTransformProp<T>;
+    hoverTextTransform?: TextTransformProp<T>;
+}
+declare type TextDecoration = CSS.Globals | 'overline' | 'underline' | 'line-through';
+declare type TextDecorationProp<T extends ITheme> = SystemProp<TextDecoration, T>;
+export interface TextDecorationProps<T extends ITheme = VuiTheme> {
+    textDecoration?: TextDecorationProp<T>;
+    hoverTextDecoration?: TextDecorationProp<T>;
+}
+declare type TextAlignProp<T extends ITheme> = SystemProp<CSS.Property.TextAlign, T>;
+export interface TextAlignProps<T extends ITheme = VuiTheme> {
+    textAlign?: TextAlignProp<T>;
+    hoverTextAlign?: TextAlignProp<T>;
+}
+export interface TypographyProps<T extends ITheme = VuiTheme> extends FontFamilyProps<T>, FontSizeProps<T>, FontStyleProps<T>, LineHeightProps<T>, FontWeightProps<T>, TextAlignProps<T>, ColorProps<T>, TextTransformProps<T>, TextDecorationProps<T> {
+}
+export {};

package/system/typography.js

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

package/t/index.d.ts

@@ -0,0 +1,3 @@
+export * from './t';
+export * from './t.types';
+export { default } from './t';

package/t/index.js

@@ -0,0 +1,20 @@
+"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);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+__exportStar(require("./t"), exports);
+__exportStar(require("./t.types"), exports);
+var t_1 = require("./t");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(t_1).default; } });

package/t/t.d.ts

@@ -0,0 +1,6 @@
+import { TProps, TStyleProps } from './t.types';
+export declare const BaseT: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {
+    [x: string]: {};
+} & TStyleProps, never>;
+export declare const T: import("styled-components").StyledComponent<"span", never, TProps, never>;
+export default T;

package/t/t.js

@@ -0,0 +1,56 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+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.T = exports.BaseT = void 0;
+var styled_components_1 = require("@xstyled/styled-components");
+var react_1 = __importDefault(require("react"));
+var styled_components_2 = __importDefault(require("styled-components"));
+var core_1 = require("../core");
+var system_1 = require("../system");
+var utils_1 = require("../utils");
+var generator = styled_components_1.compose(system_1.isTruncated, styled_components_1.sizing, styled_components_1.space, styled_components_1.transitions, styled_components_1.typography);
+exports.BaseT = styled_components_2.default.span.withConfig({
+    shouldForwardProp: core_1.shouldForwardProp(generator.meta.props)
+})(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n\tline-height: 1.333;\n\ttransition: all 0s ease-in-out;\n\n\t", "\n"], ["\n\tline-height: 1.333;\n\ttransition: all 0s ease-in-out;\n\n\t", "\n"])), generator);
+exports.T = core_1.forwardRef(function (props, ref) {
+    var _a = core_1.omitThemingProps(props), align = _a.align, casing = _a.casing, className = _a.className, decoration = _a.decoration, weight = _a.weight, rest = __rest(_a, ["align", "casing", "className", "decoration", "weight"]);
+    var styles = core_1.useStyleConfig('T', props);
+    var aliasedProps = utils_1.filterUndefined({
+        fontWeight: weight,
+        textAlign: align,
+        textDecoration: decoration,
+        textTransform: casing
+    });
+    return (react_1.default.createElement(exports.BaseT, __assign({ className: utils_1.cs('vui-t', className), ref: ref, transitionDuration: "fast" }, styles, aliasedProps, rest)));
+});
+exports.T.displayName = 'T';
+exports.default = exports.T;
+var templateObject_1;

package/t/t.types.d.ts

@@ -0,0 +1,12 @@
+import { HTMLAttributes } from 'react';
+import { IsTruncatedProps, SizingProps, SpaceProps, TextAlignProps, TextDecorationProps, TextTransformProps, TransitionsProps, TypographyProps } from '../system';
+import { FontWeight, ThemingProps, VuiTheme } from '../theme';
+import { AnyString } from '../utils';
+export interface TProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'color'>, TStyleProps, ThemingProps<'T'> {
+    align?: TextAlignProps['textAlign'];
+    casing?: TextTransformProps<VuiTheme>['textTransform'];
+    decoration?: TextDecorationProps<VuiTheme>['textDecoration'];
+    weight?: FontWeight | AnyString | number;
+}
+export interface TStyleProps extends IsTruncatedProps, SizingProps, SpaceProps, TransitionsProps, TypographyProps<VuiTheme> {
+}

package/t/t.types.js

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

package/t/theme.d.ts

@@ -0,0 +1,21 @@
+declare const _default: {
+    defaultProps: {
+        size: string;
+    };
+    sizes: {
+        xs: {
+            fontSize: string;
+        };
+        sm: {
+            fontSize: string;
+        };
+        md: {
+            fontSize: string;
+        };
+        lg: {
+            fontSize: string;
+        };
+    };
+    variants: {};
+};
+export default _default;

package/t/theme.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var defaultProps = {
+    size: 'md'
+};
+var sizes = {
+    xs: {
+        fontSize: 'xs'
+    },
+    sm: {
+        fontSize: 'sm'
+    },
+    md: {
+        fontSize: 'md'
+    },
+    lg: {
+        fontSize: 'lg'
+    }
+};
+var variants = {};
+exports.default = {
+    defaultProps: defaultProps,
+    sizes: sizes,
+    variants: variants
+};

package/textarea/index.d.ts

@@ -0,0 +1,3 @@
+export * from './textarea';
+export * from './textarea.types';
+export { default } from './textarea';

package/textarea/index.js

@@ -0,0 +1,20 @@
+"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);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+__exportStar(require("./textarea"), exports);
+__exportStar(require("./textarea.types"), exports);
+var textarea_1 = require("./textarea");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(textarea_1).default; } });

package/textarea/textarea.d.ts

@@ -0,0 +1,6 @@
+import { TextareaProps, TextareaStyleProps } from './textarea.types';
+export declare const BaseTextarea: import("styled-components").StyledComponent<"textarea", import("styled-components").DefaultTheme, {
+    [x: string]: {};
+} & TextareaStyleProps, never>;
+export declare const Textarea: import("styled-components").StyledComponent<"textarea", never, TextareaProps, never>;
+export default Textarea;

package/textarea/textarea.js

@@ -0,0 +1,49 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+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.Textarea = exports.BaseTextarea = void 0;
+var styled_components_1 = require("@xstyled/styled-components");
+var react_1 = __importDefault(require("react"));
+var styled_components_2 = __importDefault(require("styled-components"));
+var core_1 = require("../core");
+var utils_1 = require("../utils");
+var generator = styled_components_1.compose(styled_components_1.backgroundColor, styled_components_1.borders, styled_components_1.color, styled_components_1.fontSize, styled_components_1.resize, styled_components_1.sizing, styled_components_1.space, styled_components_1.transitions);
+exports.BaseTextarea = styled_components_2.default.textarea.withConfig({
+    shouldForwardProp: core_1.shouldForwardProp(generator.meta.props)
+})(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n\tborder-width: 1px;\n\tmin-height: 80px;\n\toutline: none;\n\tresize: none;\n\twidth: 100%;\n\n\t&:focus {\n\t\tborder-color: transparent;\n\t}\n\n\t", "\n"], ["\n\tborder-width: 1px;\n\tmin-height: 80px;\n\toutline: none;\n\tresize: none;\n\twidth: 100%;\n\n\t&:focus {\n\t\tborder-color: transparent;\n\t}\n\n\t", "\n"])), generator);
+exports.Textarea = core_1.forwardRef(function (props, ref) {
+    var _a = core_1.omitThemingProps(props), className = _a.className, rest = __rest(_a, ["className"]);
+    var styles = core_1.useStyleConfig('Textarea', props);
+    return (react_1.default.createElement(exports.BaseTextarea, __assign({ borderRadius: "md", className: utils_1.cs('vui-textarea', className), p: 1, ref: ref, transitionDuration: "fast" }, styles, rest)));
+});
+exports.Textarea.displayName = 'Textarea';
+exports.default = exports.Textarea;
+var templateObject_1;

package/textarea/textarea.types.d.ts

@@ -0,0 +1,8 @@
+import { HTMLAttributes } from 'react';
+import { BackgroundColorProps, BorderProps, ColorProps, FontSizeProps, ResizeProps, SizingProps, SpaceProps, TransitionsProps } from '../system';
+import { ThemingProps } from '../theme';
+export interface TextareaProps extends Omit<HTMLAttributes<HTMLTextAreaElement>, 'color'>, TextareaStyleProps, ThemingProps<'Textarea'> {
+    colorScheme?: 'green' | 'grey' | 'red';
+}
+export interface TextareaStyleProps extends BackgroundColorProps, BorderProps, ColorProps, FontSizeProps, ResizeProps, SizingProps, SpaceProps, TransitionsProps {
+}

package/textarea/textarea.types.js

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

package/textarea/theme.d.ts

@@ -0,0 +1,17 @@
+import { Dict } from '../utils';
+declare function variantDefault(props: Dict): {
+    borderColor: string;
+    focusRing: number;
+    focusRingColor: string;
+};
+declare const _default: {
+    defaultProps: {
+        colorScheme: string;
+        variant: string;
+    };
+    sizes: {};
+    variants: {
+        default: typeof variantDefault;
+    };
+};
+export default _default;

package/textarea/theme.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+function variantDefault(props) {
+    var c = props.colorScheme;
+    var colors = {
+        borderColor: c + ".80",
+        focusRing: 2,
+        focusRingColor: c + ".80"
+    };
+    if (c === 'grey') {
+        colors.borderColor = c + ".60";
+        colors.focusRingColor = 'blue.70';
+    }
+    return colors;
+}
+var defaultProps = {
+    colorScheme: 'grey',
+    variant: 'default'
+};
+var sizes = {};
+var variants = {
+    default: variantDefault
+};
+exports.default = {
+    defaultProps: defaultProps,
+    sizes: sizes,
+    variants: variants
+};