@incognia/cosmik 0.0.1

package/.eslintrc.cjs

@@ -0,0 +1,18 @@
+module.exports = {
+  root: true,
+  env: { browser: true, es2020: true },
+  extends: [
+    'eslint:recommended',
+    'plugin:@typescript-eslint/recommended',
+    'plugin:react-hooks/recommended',
+  ],
+  ignorePatterns: ['dist', '.eslintrc.cjs'],
+  parser: '@typescript-eslint/parser',
+  plugins: ['react-refresh'],
+  rules: {
+    'react-refresh/only-export-components': [
+      'warn',
+      { allowConstantExport: true },
+    ],
+  },
+}

package/.github/CODEOWNERS

@@ -0,0 +1,4 @@
+# These owners will be the default owners for everything in
+# the repo. Unless a later match takes precedence, they will be
+# requested for review when someone opens a pull request.
+*       @FranciscoGileno @marcelscr @ottony @julianalucena @leonardoAnjos16

package/.storybook/main.ts

@@ -0,0 +1,19 @@
+import type { StorybookConfig } from '@storybook/react-vite'
+
+const config: StorybookConfig = {
+  stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
+  addons: [
+    '@storybook/addon-links',
+    '@storybook/addon-essentials',
+    '@storybook/addon-onboarding',
+    '@storybook/addon-interactions'
+  ],
+  framework: {
+    name: '@storybook/react-vite',
+    options: {}
+  },
+  docs: {
+    autodocs: 'tag'
+  }
+}
+export default config

package/.storybook/preview.ts

@@ -0,0 +1,17 @@
+import type { Preview } from '@storybook/react'
+
+import '../src/index.css'
+
+const preview: Preview = {
+  parameters: {
+    actions: { argTypesRegex: '^on[A-Z].*' },
+    controls: {
+      matchers: {
+        color: /(background|color)$/i,
+        date: /Date$/
+      }
+    }
+  }
+}
+
+export default preview

package/CONTRIBUTING.md

@@ -0,0 +1,20 @@
+1. Clone the repo:
+
+```sh
+git clone git@github.com:inloco/cosmik.git
+```
+
+2. Install `pnpm`: Follow: https://pnpm.io/installation
+
+3. Install deps and build the project
+```sh
+cd cosmik
+pnpm install
+```
+
+4. Run storybook
+```sh
+pnpm storybook
+```
+
+This should start a storybook webserver.

package/README.md

@@ -0,0 +1,39 @@
+# Cosmik
+
+Incognia component library, based on Shadcn UI.
+
+Component Docs: https://inloco.github.io/cosmik
+
+# Usage
+1. Install
+   ```sh
+   npm install --save @incognia/cosmik
+   ```
+
+2. CSS: There are two ways to import the CSS depeding on wheather your project uses the cosmik tailwindcss theme
+
+   2.1. Uses cosmik tailwind theme (prefered):
+   Configure your tailwind file (tailwind.config.js):
+      ```js
+         const { tailwindTheme } = require('@incognia/cosmik')
+
+         /** @type {import('tailwindcss').Config} */
+         export default {
+         content: [
+            './index.html',
+            './src/**/*.{js,ts,jsx,tsx}',
+            './node_modules/@incognia/cosmik/dist/**/*.js'
+         ],
+         theme: tailwindTheme
+         }
+      ```
+   2.2. Does not use cosmik tailwind theme:
+   Add the cosmik css to your project:
+      ```js
+      import '@incognia/cosmik/dist/cosmik.css'
+      ```
+
+3. Import Cosmik components as needed:
+   ```js
+   import { Button } from '@incognia/cosmik'
+   ```

package/components.json

@@ -0,0 +1,12 @@
+{
+  "$schema": "https://ui.shadcn.com/schema.json",
+  "style": "default",
+  "rsc": false,
+  "tsx": true,
+  "tailwind": {
+    "config": "tailwind.config.js",
+    "css": "src/index.css",
+    "baseColor": "gray",
+    "cssVariables": false
+  }
+}

package/dist/Button/Button.stories.d.ts

@@ -0,0 +1,23 @@
+/// <reference types="react" />
+import type { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: import("react").ForwardRefExoticComponent<import(".").ButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Primary: Story;
+export declare const Secondary: Story;
+export declare const Ghost: Story;
+export declare const Subtle: Story;
+export declare const SubtleGray: Story;
+export declare const Disabled: Story;
+export declare const Small: Story;
+export declare const Icon: Story;
+export declare const WithIcon: Story;
+export declare const AsChild: Story;
+//# sourceMappingURL=Button.stories.d.ts.map

package/dist/Button/Button.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.stories.d.ts","sourceRoot":"","sources":["../../src/Button/Button.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AAItD,QAAA,MAAM,IAAI;;;;;;;CAOqB,CAAA;AAE/B,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,eAAO,MAAM,OAAO,EAAE,KAKrB,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,KAIvB,CAAA;AAED,eAAO,MAAM,KAAK,EAAE,KAKnB,CAAA;AAED,eAAO,MAAM,MAAM,EAAE,KAKpB,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAKxB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAMtB,CAAA;AAED,eAAO,MAAM,KAAK,EAAE,KAKnB,CAAA;AAED,eAAO,MAAM,IAAI,EAAE,KAMlB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAMtB,CAAA;AAED,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAA"}

package/dist/Button/index.d.ts

@@ -0,0 +1,12 @@
+import { type VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+declare const buttonVariants: (props?: ({
+    variant?: "default" | "primary" | "ghost" | "subtle" | "subtleGray" | null | undefined;
+    size?: "default" | "icon" | "sm" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
+    asChild?: boolean;
+}
+declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+export { Button, buttonVariants };
+//# sourceMappingURL=index.d.ts.map

package/dist/Button/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Button/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AACjE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,QAAA,MAAM,cAAc;;;mFA2BnB,CAAA;AAED,MAAM,WAAW,WACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EACnD,YAAY,CAAC,OAAO,cAAc,CAAC;IACrC,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB;AAED,QAAA,MAAM,MAAM,uFAWX,CAAA;AAGD,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,CAAA"}

package/dist/Colors.d.ts

@@ -0,0 +1,53 @@
+declare const Colors: {
+    WHITE: string;
+    GRAY_50: string;
+    GRAY_100: string;
+    GRAY_200: string;
+    GRAY_300: string;
+    GRAY_400: string;
+    GRAY_500: string;
+    GRAY_600: string;
+    GRAY_700: string;
+    GRAY_800: string;
+    GRAY_900: string;
+    GREEN_50: string;
+    GREEN_500: string;
+    GREEN_600: string;
+    GREEN_700: string;
+    GREEN_800: string;
+    MAGENTA_50: string;
+    MAGENTA_500: string;
+    MAGENTA_600: string;
+    MAGENTA_700: string;
+    PURPLE_50: string;
+    PURPLE_100: string;
+    PURPLE_200: string;
+    PURPLE_300: string;
+    PURPLE_400: string;
+    PURPLE_500: string;
+    PURPLE_600: string;
+    PURPLE_700: string;
+    PURPLE_800: string;
+    PURPLE_900: string;
+    ROBINBLUE_50: string;
+    ROBINBLUE_100: string;
+    ROBINBLUE_200: string;
+    ROBINBLUE_300: string;
+    ROBINBLUE_400: string;
+    ROBINBLUE_500: string;
+    ROBINBLUE_600: string;
+    ROBINBLUE_700: string;
+    ROBINBLUE_800: string;
+    ROBINBLUE_900: string;
+    YELLOW_50: string;
+    YELLOW_500: string;
+    YELLOW_600: string;
+    YELLOW_700: string;
+    CHART_PURPLE: string;
+    CHART_MAGENTA: string;
+    CHART_YELLOW: string;
+    CHART_ROBINBLUE: string;
+    CHART_GREEN: string;
+};
+export default Colors;
+//# sourceMappingURL=Colors.d.ts.map

package/dist/Colors.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Colors.d.ts","sourceRoot":"","sources":["../src/Colors.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyDX,CAAA;AAED,eAAe,MAAM,CAAA"}