@peculiar/react-components 0.0.2-alpha.303 → 0.0.2-alpha.309

package/dist/types/Skeleton/skeleton.d.ts

@@ -1,6 +1,10 @@
 import * as React from 'react';
+import { OverridableComponent, OverrideProps } from '../OverridableComponent';
 import { ColorType } from '../styles';
-export declare type SkeletonProps = {
+/**
+ * Types.
+ */
+export interface SkeletonOwnProps {
     /**
      * Optional children to infer width and height from.
      */
@@ -17,13 +21,16 @@ export declare type SkeletonProps = {
      * The type of content that will be rendered.
      */
     variant?: ('text' | 'rect' | 'circle');
-    /**
-     * The className of the component.
-     */
-    className?: string;
     background?: ColorType;
+}
+export interface SkeletonTypeMap<P = {}, D extends React.ElementType = 'span'> {
+    props: P & SkeletonOwnProps;
+    defaultComponent: D;
+}
+export declare type SkeletonProps<D extends React.ElementType = SkeletonTypeMap['defaultComponent']> = OverrideProps<SkeletonTypeMap<{}, D>, D> & {
+    component?: D;
 };
 /**
  *
  */
-export declare const Skeleton: import("../system/system_types").ComponentWithAs<"span", SkeletonProps>;
+export declare const Skeleton: OverridableComponent<SkeletonTypeMap<{}, "span">>;

package/dist/types/Tabs/index.d.ts

@@ -1,2 +1,2 @@
 export { Tabs } from './tabs';
-export { Tab } from './tab';
+export { Tab, TabOwnProps, TabProps, } from './tab';

package/dist/types/Tabs/tab.d.ts

@@ -1,5 +1,9 @@
 import * as React from 'react';
-export declare type TabProps = {
+import { OverridableComponent, OverrideProps } from '../OverridableComponent';
+/**
+ * Types.
+ */
+export interface TabOwnProps {
     /**
      * The content of the component.
      */
@@ -8,10 +12,6 @@ export declare type TabProps = {
      * Unique identifier used to control which tab is selected.
      */
     id: string;
-    /**
-     * The className of the component.
-     */
-    className?: string;
     /**
      * If `true`, the tab will be disabled.
      */
@@ -25,6 +25,15 @@ export declare type TabProps = {
      */
     onChange?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>, value: string) => void;
     onClick?: never;
-    'data-testid'?: string;
+}
+export interface TabTypeMap<P = {}, D extends React.ElementType = 'button'> {
+    props: P & TabOwnProps;
+    defaultComponent: D;
+}
+export declare type TabProps<D extends React.ElementType = TabTypeMap['defaultComponent']> = OverrideProps<TabTypeMap<{}, D>, D> & {
+    component?: D;
 };
-export declare const Tab: import("../system/system_types").ComponentWithAs<"button", TabProps>;
+/**
+ *
+ */
+export declare const Tab: OverridableComponent<TabTypeMap<{}, "button">>;

package/dist/types/Typography/index.d.ts

@@ -1 +1 @@
-export { Typography, TypographyProps } from './typography';
+export { Typography, TypographyOwnProps, TypographyProps, } from './typography';

package/dist/types/Typography/typography.d.ts

@@ -1,6 +1,10 @@
 import * as React from 'react';
+import { OverridableComponent, OverrideProps } from '../OverridableComponent';
 import { ColorType, TypographyType } from '../styles';
-export declare type TypographyProps = {
+/**
+ * Types.
+ */
+export interface TypographyOwnProps {
     /**
      * The content of the component.
      */
@@ -13,16 +17,18 @@ export declare type TypographyProps = {
      * The color of the component.
      */
     color?: ColorType | 'inherit';
-    /**
-     * The className of the component.
-     */
-    className?: string;
     /**
      * If `true`, the text will not wrap, but instead will truncate with a text overflow ellipsis.
      * Note that text overflow can only happen with block or inline-block level elements
      * (the element needs to have a width in order to overflow).
      */
     noWrap?: boolean;
-    'data-testid'?: string;
+}
+export interface TypographyTypeMap<P = {}, D extends React.ElementType = 'p'> {
+    props: P & TypographyOwnProps;
+    defaultComponent: D;
+}
+export declare type TypographyProps<D extends React.ElementType = TypographyTypeMap['defaultComponent']> = OverrideProps<TypographyTypeMap<{}, D>, D> & {
+    component?: D;
 };
-export declare const Typography: import("../system/system_types").ComponentWithAs<"p", TypographyProps>;
+export declare const Typography: OverridableComponent<TypographyTypeMap<{}, "p">>;

package/dist/types/index.d.ts

@@ -32,3 +32,4 @@ export * from './Tooltip';
 export * from './Typography';
 export * from './styles';
 export * from './hooks';
+export * from './OverridableComponent';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@peculiar/react-components",
   "private": false,
-  "version": "0.0.2-alpha.303+ce18128",
+  "version": "0.0.2-alpha.309+0c1c87c",
   "author": "PeculiarVentures Team",
   "description": "A simple and customizable component library to build faster, beautiful, and more accessible React applications.",
   "keywords": [
@@ -42,7 +42,7 @@
   "dependencies": {
     "@emotion/core": "^10.1.1",
     "@emotion/css": "^11.7.1",
-    "@peculiar/color": "^0.0.2-alpha.303+ce18128",
+    "@peculiar/color": "^0.0.2-alpha.309+0c1c87c",
     "@popperjs/core": "^2.11.5",
     "@types/flat": "^5.0.2",
     "@types/react-transition-group": "^4.4.4",
@@ -55,13 +55,13 @@
     "react-transition-group": "^4.4.2"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "^6.5.10",
-    "@storybook/addon-actions": "^6.5.10",
-    "@storybook/addon-controls": "^6.5.10",
-    "@storybook/addon-docs": "^6.5.10",
-    "@storybook/addon-viewport": "^6.5.10",
-    "@storybook/react": "^6.5.10",
-    "@storybook/theming": "^6.5.10",
+    "@storybook/addon-a11y": "^6.5.14",
+    "@storybook/addon-actions": "^6.5.14",
+    "@storybook/addon-controls": "^6.5.14",
+    "@storybook/addon-docs": "^6.5.14",
+    "@storybook/addon-viewport": "^6.5.14",
+    "@storybook/react": "^6.5.14",
+    "@storybook/theming": "^6.5.14",
     "@testing-library/jest-dom": "^5.16.4",
     "@testing-library/react": "^11.2.7",
     "@testing-library/user-event": "^13.5.0",
@@ -85,5 +85,5 @@
     "node": ">=12.x"
   },
   "license": "MIT",
-  "gitHead": "ce18128b8bb5d565fda836208df1503719e152f4"
+  "gitHead": "0c1c87cde94c6f2b6590c4679309c8a19c269487"
 }

package/dist/cjs/system/forward_ref.js

@@ -1,13 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.forwardRef = void 0;
-var react_1 = require("react");
-/**
- * All credit goes to Chance (Reach UI), Haz (Reakit) and (fluentui)
- * for creating the base type definitions upon which we improved on
- */
-function forwardRef(component) {
-    return (0, react_1.forwardRef)(component);
-}
-exports.forwardRef = forwardRef;
-//# sourceMappingURL=forward_ref.js.map

package/dist/cjs/system/forward_ref.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"forward_ref.js","sourceRoot":"","sources":["../../../src/system/forward_ref.ts"],"names":[],"mappings":";;;AAAA,+BAAsD;AAQtD;;;GAGG;AACH,SAAgB,UAAU,CACxB,SAKC;IAED,OAAO,IAAA,kBAAe,EAAC,SAAS,CAG/B,CAAC;AACJ,CAAC;AAZD,gCAYC"}

package/dist/cjs/system/index.js

@@ -1,6 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.forwardRef = void 0;
-var forward_ref_1 = require("./forward_ref");
-Object.defineProperty(exports, "forwardRef", { enumerable: true, get: function () { return forward_ref_1.forwardRef; } });
-//# sourceMappingURL=index.js.map

package/dist/cjs/system/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/system/index.ts"],"names":[],"mappings":";;;AAAA,6CAA2C;AAAlC,yGAAA,UAAU,OAAA"}

package/dist/cjs/system/system_types.js

@@ -1,3 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-//# sourceMappingURL=system_types.js.map

package/dist/cjs/system/system_types.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"system_types.js","sourceRoot":"","sources":["../../../src/system/system_types.ts"],"names":[],"mappings":""}

package/dist/esm/system/forward_ref.js

@@ -1,9 +0,0 @@
-import { forwardRef as forwardReactRef } from 'react';
-/**
- * All credit goes to Chance (Reach UI), Haz (Reakit) and (fluentui)
- * for creating the base type definitions upon which we improved on
- */
-export function forwardRef(component) {
-    return forwardReactRef(component);
-}
-//# sourceMappingURL=forward_ref.js.map

package/dist/esm/system/forward_ref.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"forward_ref.js","sourceRoot":"","sources":["../../../src/system/forward_ref.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,IAAI,eAAe,EAAE,MAAM,OAAO,CAAC;AAQtD;;;GAGG;AACH,MAAM,UAAU,UAAU,CACxB,SAKC;IAED,OAAO,eAAe,CAAC,SAAS,CAG/B,CAAC;AACJ,CAAC"}

package/dist/esm/system/index.js

@@ -1,2 +0,0 @@
-export { forwardRef } from './forward_ref';
-//# sourceMappingURL=index.js.map

package/dist/esm/system/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/system/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC"}

package/dist/esm/system/system_types.js

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=system_types.js.map

package/dist/esm/system/system_types.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"system_types.js","sourceRoot":"","sources":["../../../src/system/system_types.ts"],"names":[],"mappings":""}

package/dist/esnext/system/forward_ref.js

@@ -1,9 +0,0 @@
-import { forwardRef as forwardReactRef } from 'react';
-/**
- * All credit goes to Chance (Reach UI), Haz (Reakit) and (fluentui)
- * for creating the base type definitions upon which we improved on
- */
-export function forwardRef(component) {
-    return forwardReactRef(component);
-}
-//# sourceMappingURL=forward_ref.js.map

package/dist/esnext/system/forward_ref.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"forward_ref.js","sourceRoot":"","sources":["../../../src/system/forward_ref.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,IAAI,eAAe,EAAE,MAAM,OAAO,CAAC;AAQtD;;;GAGG;AACH,MAAM,UAAU,UAAU,CACxB,SAKC;IAED,OAAO,eAAe,CAAC,SAAS,CAG/B,CAAC;AACJ,CAAC"}

package/dist/esnext/system/index.js

@@ -1,2 +0,0 @@
-export { forwardRef } from './forward_ref';
-//# sourceMappingURL=index.js.map

package/dist/esnext/system/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/system/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC"}

package/dist/esnext/system/system_types.js

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=system_types.js.map

package/dist/esnext/system/system_types.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"system_types.js","sourceRoot":"","sources":["../../../src/system/system_types.ts"],"names":[],"mappings":""}

package/dist/types/system/forward_ref.d.ts

@@ -1,9 +0,0 @@
-/// <reference types="react" />
-import type { RightJoinProps, PropsOf, As, ComponentWithAs } from './system_types';
-/**
- * All credit goes to Chance (Reach UI), Haz (Reakit) and (fluentui)
- * for creating the base type definitions upon which we improved on
- */
-export declare function forwardRef<Props extends object, Component extends As>(component: React.ForwardRefRenderFunction<any, RightJoinProps<PropsOf<Component>, Props> & {
-    as?: As;
-}>): ComponentWithAs<Component, Props>;

package/dist/types/system/index.d.ts

@@ -1 +0,0 @@
-export { forwardRef } from './forward_ref';

package/dist/types/system/system_types.d.ts

@@ -1,24 +0,0 @@
-/// <reference types="react" />
-export declare type As<Props = any> = React.ElementType<Props>;
-export declare type MergeWithAs<ComponentProps extends object, AsProps extends object, AdditionalProps extends object = {}, AsComponent extends As = As> = RightJoinProps<ComponentProps, AdditionalProps> & RightJoinProps<AsProps, AdditionalProps> & {
-    /**
-     * The component used for the root node.
-     */
-    as?: AsComponent;
-};
-export declare type ComponentWithAs<Component extends As, Props extends object = {}> = {
-    <AsComponent extends As = Component>(props: MergeWithAs<React.ComponentProps<Component>, React.ComponentProps<AsComponent>, Props, AsComponent>): JSX.Element;
-    displayName?: string;
-    propTypes?: React.WeakValidationMap<any>;
-    contextTypes?: React.ValidationMap<any>;
-    defaultProps?: Partial<Props>;
-    id?: string;
-};
-export declare type PropsOf<T extends As> = React.ComponentPropsWithoutRef<T> & {
-    /**
-     * The component used for the root node.
-     */
-    as?: As;
-};
-export declare type OmitCommonProps<Target, OmitAdditionalProps extends keyof any = never> = Omit<Target, 'transition' | 'as' | 'color' | OmitAdditionalProps>;
-export declare type RightJoinProps<SourceProps extends object = {}, OverrideProps extends object = {}> = OmitCommonProps<SourceProps, keyof OverrideProps> & OverrideProps;