@eleven-labs/design-system 0.6.3 → 0.10.0

package/dist/scss/abstracts/variables/_token-variables.scss

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Wed, 18 Oct 2023 18:37:56 GMT
+ * Generated on Sun, 29 Oct 2023 19:38:21 GMT
  */
 
 $token-variables: (

package/dist/scss/abstracts/variables/_variables.scss

@@ -1,7 +1,7 @@
 
 /**
  * Do not edit directly
- * Generated on Wed, 18 Oct 2023 18:37:56 GMT
+ * Generated on Sun, 29 Oct 2023 19:38:21 GMT
  */
 
 $white: #FFFFFF !default;

package/dist/types/MediaQueryType.d.ts

@@ -1,2 +1,2 @@
-import { mediaQueriesList } from '../constants';
+import type { mediaQueriesList } from '../constants';
 export type MediaQueryType = (typeof mediaQueriesList)[number];

package/dist/types/SystemProps/FlexBoxSystemProps.d.ts

@@ -1,5 +1,5 @@
 import type { AlignContentType, AlignItemsType, FlexType, JustifyContentType, SpacingType, TypeWithMediaQueriesType } from '../../types';
-import { AlignSelfType, FlexBasisType, FlexDirectionType, FlexWrapType } from '../../types';
+import type { AlignSelfType, FlexBasisType, FlexDirectionType, FlexWrapType } from '../../types';
 export interface FlexBoxSystemProps {
     /**
      * flex-direction (including breakpoints modifiers)

package/dist/types/SystemProps/HiddenSystemProps.d.ts

@@ -1,4 +1,4 @@
-import { MediaQueryType } from '../../types';
+import type { MediaQueryType } from '../../types';
 export interface HiddenSystemProps {
     /**
      * Defines hidden above strategy with media queries (is similar to "min-width") (including breakpoints modifiers)

package/dist/types/SystemProps/LayoutSystemProps.d.ts

@@ -1,4 +1,4 @@
-import { DisplayType, HeightType, TypeWithMediaQueriesType, WidthType } from '../../types';
+import type { DisplayType, HeightType, TypeWithMediaQueriesType, WidthType } from '../../types';
 export interface LayoutSystemProps {
     /**
      * display (including breakpoints modifiers)

package/dist/types/SystemProps/SystemProps.d.ts

@@ -1,3 +1,3 @@
-import type { ColorSystemProps, FlexBoxSystemProps, HiddenSystemProps, LayoutSystemProps, SpacingSystemProps, TypographySystemProps } from '../../types';
-export interface SystemProps extends ColorSystemProps, FlexBoxSystemProps, LayoutSystemProps, SpacingSystemProps, TypographySystemProps, HiddenSystemProps {
+import type { ColorSystemProps, HiddenSystemProps, LayoutSystemProps, SpacingSystemProps } from '../../types';
+export interface SystemProps extends ColorSystemProps, LayoutSystemProps, SpacingSystemProps, HiddenSystemProps {
 }

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

@@ -3,7 +3,5 @@ export * from './SpacingSystemProps';
 export * from './SystemProps';
 export * from './TypographySystemProps';
 export * from './FlexBoxSystemProps';
-export * from './AsProps';
 export * from './LayoutSystemProps';
-export * from './ComponentWithAs';
 export * from './HiddenSystemProps';

package/dist/types/TypeWithModifier.d.ts

@@ -1,3 +1,3 @@
-import { MediaQueryType } from '../types/MediaQueryType';
+import type { MediaQueryType } from '../types/MediaQueryType';
 export type TypeWithModifierType<TModifierType extends string, TPropValue> = Partial<Record<TModifierType, TPropValue>>;
 export type TypeWithMediaQueriesType<T> = T | TypeWithModifierType<MediaQueryType, T>;

package/dist/types/cssPropertyTypes.d.ts

@@ -1,4 +1,4 @@
-import { cssProperties } from '../constants';
+import type { cssProperties } from '../constants';
 export type TextAlignType = keyof (typeof cssProperties)['text-align'];
 export type TextTransformType = keyof (typeof cssProperties)['text-transform'];
 export type DisplayType = keyof (typeof cssProperties)['display'];

package/dist/types/tokenTypes.d.ts

@@ -1,4 +1,4 @@
-import { tokenVariables } from '../constants';
+import type { tokenVariables } from '../constants';
 export type ColorType = keyof (typeof tokenVariables)['color']['primary'] | keyof (typeof tokenVariables)['color']['secondary'] | keyof (typeof tokenVariables)['color']['greyscale'];
 export type SpacingType = keyof (typeof tokenVariables)['spacing'];
 export type WidthType = keyof (typeof tokenVariables)['width'];

package/package.json

@@ -1,18 +1,13 @@
 {
   "name": "@eleven-labs/design-system",
   "description": "Design System for Eleven Labs",
-  "version": "0.6.3",
+  "version": "0.10.0",
   "repository": {
     "type": "git",
     "url": "https://github.com/eleven-labs/design-system.git"
   },
   "author": "Eleven Labs <contact@eleven-labs.com>",
   "license": "MIT",
-  "keywords": [
-    "eslint",
-    "lint",
-    "prettier"
-  ],
   "type": "module",
   "main": "./dist/index.umd.cjs",
   "module": "./dist/index.es.js",
@@ -39,7 +34,7 @@
     "start:storybook": "storybook dev -p 6009",
     "build:storybook": "yarn build && yarn storybook build",
     "lint:style": "stylelint 'src/**/*.scss'",
-    "lint:es": "eslint --ext .ts,.tsx src bin .storybook",
+    "lint:es": "eslint --ext .ts,.tsx src",
     "lint": "yarn lint:style && yarn lint:es",
     "test": "jest"
   },
@@ -56,9 +51,11 @@
     "yarn": ">= 1.2.0",
     "node": ">= 14.0"
   },
+  "prettier": "@eleven-labs/prettier-config",
   "dependencies": {
     "autosuggest-highlight": "^3.3.4",
     "classnames": "^2.3.2",
+    "react-polymorphed": "^2.2.1",
     "react-syntax-highlighter": "^15.5.0"
   },
   "peerDependencies": {
@@ -68,7 +65,8 @@
   "devDependencies": {
     "@commitlint/cli": "^17.6.5",
     "@commitlint/config-conventional": "^17.6.5",
-    "@elevenlabs/eslint-config": "^0.0.1",
+    "@eleven-labs/eslint-config": "^1.0.0",
+    "@eleven-labs/prettier-config": "^1.0.0",
     "@storybook/addon-actions": "^7.0.22",
     "@storybook/addon-essentials": "^7.0.22",
     "@storybook/addon-interactions": "^7.0.22",
@@ -84,7 +82,7 @@
     "@types/react-syntax-highlighter": "^15.5.7",
     "@vitejs/plugin-react": "^4.0.1",
     "autoprefixer": "^10.4.14",
-    "eslint": "^8.26.0",
+    "eslint": "^8.52.0",
     "husky": "^8.0.3",
     "jest": "^29.5.0",
     "lint-staged": "^13.2.2",
@@ -92,7 +90,7 @@
     "postcss": "^8.4.24",
     "postcss-normalize": "^10.0.1",
     "postcss-scss": "^4.0.6",
-    "prettier": "^2.8.8",
+    "prettier": "^3.0.3",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "rollup-plugin-peer-deps-external": "^2.2.4",

package/dist/helpers/systemPropsHelper/forwardRef.d.ts

@@ -1,7 +0,0 @@
-import * as React from 'react';
-import { As, ComponentWithAs, PropsOf, RightJoinProps } from '../../types';
-export declare function forwardRef<Props extends object, Component extends As>(component: React.ForwardRefRenderFunction<any, // eslint-disable-line @typescript-eslint/no-explicit-any
-// eslint-disable-line @typescript-eslint/no-explicit-any
-RightJoinProps<PropsOf<Component>, Props> & {
-    as?: As;
-}>): ComponentWithAs<Component, Props>;

package/dist/types/SystemProps/AsProps.d.ts

@@ -1,4 +0,0 @@
-import { As, PropsOf } from '../../types/SystemProps/ComponentWithAs';
-export type AsProps<T extends As = 'div'> = Omit<PropsOf<T>, 'ref' | 'color'> & {
-    as?: As;
-};

package/dist/types/SystemProps/ComponentWithAs.d.ts

@@ -1,16 +0,0 @@
-export type As<Props = any> = React.ElementType<Props>;
-/**
- * Extract the props of a React element or component
- */
-export type PropsOf<T extends As> = React.ComponentPropsWithoutRef<T> & {
-    as?: As;
-};
-export type OmitCommonProps<Target, OmitAdditionalProps extends keyof any = never> = Omit<Target, 'as' | 'color' | OmitAdditionalProps>;
-export type RightJoinProps<SourceProps extends object = {}, OverrideProps extends object = {}> = OmitCommonProps<SourceProps, keyof OverrideProps> & OverrideProps;
-export type MergeWithAs<ComponentProps extends object, AsProps extends object, AdditionalProps extends object = {}, AsComponent extends As = As> = RightJoinProps<ComponentProps, AdditionalProps> & RightJoinProps<AsProps, AdditionalProps> & {
-    as?: AsComponent;
-};
-export 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;
-};