@creativecodeco/ui 0.0.1

package/README.md

@@ -0,0 +1,9 @@
+# @creativecodeco/ui
+
+> System Design CreativeCode.com.co
+
+![NPM](https://img.shields.io/badge/NPM-%23CB3837.svg?style=for-the-badge&logo=npm&logoColor=white) ![TypeScript](https://img.shields.io/badge/typescript-%23007ACC.svg?style=for-the-badge&logo=typescript&logoColor=white) ![React](https://img.shields.io/badge/react-%2320232a.svg?style=for-the-badge&logo=react&logoColor=%2361DAFB)
+
+## Chromatic
+
+[View Components](https://master--658273f7c6c3c10a909dea3b.chromatic.com/)

package/lib/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./ui/forms";
+export * from "./ui/provider";
+export * from "./types";

package/lib/index.js

@@ -0,0 +1,3 @@
+export * from "./ui/forms";
+export * from "./ui/provider";
+export * from "./types";

package/lib/theme/index.d.ts

@@ -0,0 +1,10 @@
+export declare const creativeCodeTheme: {
+    content: string[];
+    theme: {
+        extend: {};
+    };
+    daisyui: {
+        themes: string[];
+    };
+    plugins: any[];
+};

package/lib/theme/index.js

@@ -0,0 +1,13 @@
+export const creativeCodeTheme = {
+    content: [
+        "./src/**/*.{html,js,ts,jsx,tsx,mdx}",
+        "./node_modules/creativecodeco/ui/lib/**/*.{js,jsx,ts,tsx}",
+    ],
+    theme: {
+        extend: {},
+    },
+    daisyui: {
+        themes: ["light"],
+    },
+    plugins: [require("daisyui")],
+};

package/lib/theme/tailwindcss/input.css

@@ -0,0 +1,3 @@
+.input-john {
+  @apply bg-primary;
+}

package/lib/theme/tailwindcss/main.css

@@ -0,0 +1,5 @@
+@import "tailwindcss/base";
+@import "tailwindcss/components";
+@import "tailwindcss/utilities";
+
+@import "./input.css";

package/lib/types/index.d.ts

@@ -0,0 +1,2 @@
+import { TextBoxType, TextBoxRef } from "./ui/forms";
+export type { TextBoxType, TextBoxRef };

package/lib/types/index.js

@@ -0,0 +1 @@
+export {};

package/lib/types/ui/forms/index.d.ts

@@ -0,0 +1,2 @@
+import { TextBoxType, TextBoxRef } from "./text-box.types";
+export type { TextBoxType, TextBoxRef };

package/lib/types/ui/forms/index.js

@@ -0,0 +1 @@
+export {};

package/lib/types/ui/forms/text-box.types.d.ts

@@ -0,0 +1,8 @@
+export interface TextBoxType extends React.InputHTMLAttributes<HTMLInputElement> {
+    name: string;
+    label?: string;
+    isError?: boolean;
+    error?: string;
+    disabled?: boolean;
+}
+export type TextBoxRef = HTMLInputElement;

package/lib/types/ui/forms/text-box.types.js

@@ -0,0 +1 @@
+export {};

package/lib/ui/forms/index.d.ts

@@ -0,0 +1,2 @@
+import { TextBox } from "../../ui/forms/text-box";
+export { TextBox };

package/lib/ui/forms/index.js

@@ -0,0 +1,2 @@
+import { TextBox } from "../../ui/forms/text-box";
+export { TextBox };

package/lib/ui/forms/text-box/index.d.ts

@@ -0,0 +1,2 @@
+import TextBox from "./text-box.component";
+export { TextBox };

package/lib/ui/forms/text-box/index.js

@@ -0,0 +1,2 @@
+import TextBox from "./text-box.component";
+export { TextBox };

package/lib/ui/forms/text-box/text-box.component.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { TextBoxType } from "../../../types/ui/forms";
+declare const TextBox: React.ForwardRefExoticComponent<TextBoxType & React.RefAttributes<HTMLInputElement>>;
+export default TextBox;

package/lib/ui/forms/text-box/text-box.component.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useImperativeHandle, useRef } from "react";
+const TextBox = forwardRef(({ name, label, isError, error, disabled, ...otherProps }, ref) => {
+    const inputRef = useRef(null);
+    useImperativeHandle(ref, () => inputRef.current);
+    return (_jsxs("div", { className: "form-control w-full", children: [label && (_jsx("div", { className: "label", children: _jsx("label", { htmlFor: name, className: "label-text", children: label }) })), _jsx("input", { ref: inputRef, id: name, name: name, ...otherProps, className: "input input-bordered w-full", disabled: disabled }), isError && _jsx("p", { className: "text-red-500", children: error })] }));
+});
+export default TextBox;

package/lib/ui/provider/creativecode-ui.provider.d.ts

@@ -0,0 +1,2 @@
+import { PropsWithChildren } from "react";
+export default function CreativeCodeUIProvider({ children, }: PropsWithChildren<unknown>): JSX.Element;

package/lib/ui/provider/creativecode-ui.provider.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment } from "react";
+export default function CreativeCodeUIProvider({ children, }) {
+    return _jsx(Fragment, { children: children });
+}

package/lib/ui/provider/index.d.ts

@@ -0,0 +1,2 @@
+import CreativeCodeUIProvider from "./creativecode-ui.provider";
+export default CreativeCodeUIProvider;

package/lib/ui/provider/index.js

@@ -0,0 +1,2 @@
+import CreativeCodeUIProvider from "./creativecode-ui.provider";
+export default CreativeCodeUIProvider;

package/package.json

@@ -0,0 +1,75 @@
+{
+  "name": "@creativecodeco/ui",
+  "description": "CreativeCode.com.co UI",
+  "version": "0.0.1",
+  "homepage": "https://github.com/creativecodeco/ui",
+  "author": {
+    "name": "John Toro",
+    "email": "joaltoroc@creativecode.com.co"
+  },
+  "license": "MIT",
+  "main": "lib/index.js",
+  "source": "src/index.ts",
+  "scripts": {
+    "build-storybook": "npm run build; storybook build",
+    "build:alias": "tsc-alias -p tsconfig.build.json",
+    "build:css": "postcss src/theme/main.css -o dist/theme/main.css --minify; cpx 'src/theme/*[.]css' 'lib/theme/tailwindcss'",
+    "build": "rm -rf lib; tsc -p tsconfig.build.json; npm run build:alias; npm run build:css",
+    "chromatic": "chromatic --only-changed true",
+    "dev:css": "postcss src/theme/main.css -o dist/theme/main.css --watch",
+    "prepack": "npm run build",
+    "release": "npm publish --access public",
+    "storybook": "storybook dev -p 6006"
+  },
+  "peerDependencies": {
+    "react": "18.2.0"
+  },
+  "devDependencies": {
+    "@storybook/addon-essentials": "7.6.6",
+    "@storybook/addon-interactions": "7.6.6",
+    "@storybook/addon-links": "7.6.6",
+    "@storybook/addon-onboarding": "1.0.10",
+    "@storybook/blocks": "7.6.6",
+    "@storybook/react": "7.6.6",
+    "@storybook/react-webpack5": "7.6.6",
+    "@storybook/test": "7.6.6",
+    "@types/node": "20.10.5",
+    "@types/react": "18.2.45",
+    "@types/react-dom": "18.2.18",
+    "autoprefixer": "^10.4.16",
+    "chromatic": "^10.1.0",
+    "cpx2": "6.0.1",
+    "daisyui": "4.4.21",
+    "eslint": "8.56.0",
+    "eslint-config-prettier": "9.1.0",
+    "eslint-config-standard": "17.1.0",
+    "eslint-config-standard-react": "13.0.0",
+    "eslint-config-standard-with-typescript": "43.0.0",
+    "eslint-plugin-import": "2.29.1",
+    "eslint-plugin-n": "16.4.0",
+    "eslint-plugin-node": "11.1.0",
+    "eslint-plugin-prettier": "5.1.0",
+    "eslint-plugin-promise": "6.1.1",
+    "eslint-plugin-react": "7.33.2",
+    "eslint-plugin-standard": "5.0.0",
+    "eslint-plugin-storybook": "0.6.15",
+    "eslint-plugin-unused-imports": "3.0.0",
+    "postcss": "8.4.32",
+    "postcss-cli": "11.0.0",
+    "postcss-import": "15.1.0",
+    "prettier": "3.1.1",
+    "prop-types": "15.8.1",
+    "react": "18.2.0",
+    "react-dom": "18.2.0",
+    "storybook": "7.6.6",
+    "storybook-addon-themes": "^6.1.0",
+    "string-width": "^7.0.0",
+    "tailwindcss": "3.4.0",
+    "tsc-alias": "1.8.8",
+    "tsconfig-paths-webpack-plugin": "^4.1.0",
+    "typescript": "5.3.3"
+  },
+  "files": [
+    "lib"
+  ]
+}