@itilite/lumina-ui 0.0.6 → 0.0.31

package/dist/esm/types/components/Button/types.d.ts

@@ -1,6 +1,4 @@
 export interface ButtonProps {
-    id?: string;
-    name?: string;
     type?: "primary" | "secondary" | "critical" | undefined;
     variant?: "subtle" | "text" | "link";
     size?: "large" | "small";

package/dist/esm/types/components/Tag/Tag.d.ts

@@ -0,0 +1,4 @@
+import * as React from "react";
+import { TagProps } from "./type";
+declare const Tag: React.FC<TagProps>;
+export default Tag;

package/dist/esm/types/components/Tag/index.d.ts

@@ -0,0 +1 @@
+export { default as Tag } from "./Tag";

package/dist/esm/types/components/Tag/type.d.ts

@@ -0,0 +1,7 @@
+export interface TagProps {
+    className?: string;
+    type?: "success" | "warning" | "blue" | "processing" | "failed" | undefined;
+    title?: string;
+    icon?: React.ReactNode;
+    size?: string;
+}

package/dist/esm/types/components/index.d.ts

@@ -4,3 +4,4 @@ export * from "./Modal";
 export * from "./Tooltip";
 export * from './Checkbox';
 export * from './Radio';
+export * from './Tag';

package/dist/types/components/Button/Button.d.ts

@@ -0,0 +1,4 @@
+import * as React from "react";
+import { ButtonProps } from "./types";
+declare const Button: React.FC<ButtonProps>;
+export default Button;

package/dist/types/components/Button/Button.test.d.ts

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

package/dist/types/components/Button/index.d.ts

@@ -0,0 +1 @@
+export { default as Button } from "./Button";

package/dist/types/components/Button/types.d.ts

@@ -0,0 +1,16 @@
+export interface ButtonProps {
+    type?: "primary" | "secondary" | "critical" | undefined;
+    variant?: "subtle" | "text" | "link";
+    size?: "large" | "small";
+    shape?: "circle" | "default" | "round";
+    icon?: React.ReactNode;
+    iconPosition?: "start" | "end";
+    className?: string;
+    children?: React.ReactNode;
+    onClick?: (event: React.MouseEvent<HTMLElement>) => void;
+    href?: string;
+    disabled?: boolean;
+    loading?: boolean;
+    onHoverUnderline?: boolean;
+    analytics?: Record<string, unknown>;
+}

package/dist/types/components/Checkbox/Checkbox.d.ts

@@ -0,0 +1,4 @@
+import * as React from "react";
+import { CheckboxProps } from "./types";
+declare const Checkbox: React.FC<CheckboxProps>;
+export default Checkbox;

package/dist/types/components/Checkbox/index.d.ts

@@ -0,0 +1 @@
+export { default as Checkbox } from "./Checkbox";

package/dist/types/components/Checkbox/types.d.ts

@@ -0,0 +1,11 @@
+import { CheckboxChangeEvent } from 'antd/es/checkbox';
+export interface CheckboxProps {
+    checked?: boolean;
+    className?: string;
+    onChange?: (e: CheckboxChangeEvent) => void;
+    children?: React.ReactNode;
+    size?: "large" | "small" | "medium";
+    variant?: "normal" | "emphasized";
+    disabled?: boolean;
+    indeterminate?: boolean;
+}

package/dist/types/components/Modal/Modal.d.ts

@@ -0,0 +1,3 @@
+import { ModalProps } from "./types";
+declare const Modal: React.FC<ModalProps>;
+export default Modal;

package/dist/types/components/Modal/index.d.ts

@@ -0,0 +1 @@
+export { default as Modal } from "./Modal";

package/dist/types/components/Modal/types.d.ts

@@ -0,0 +1,21 @@
+export interface ModalProps {
+    className?: string | undefined;
+    title?: string | undefined;
+    children?: React.ReactNode;
+    open?: boolean;
+    handleOk?: ((e: React.MouseEvent<HTMLButtonElement>) => void) | undefined;
+    handleCancel?: ((e: React.MouseEvent<HTMLButtonElement>) => void) | undefined;
+    okText?: string | undefined;
+    cancelText?: string | undefined;
+    closeIcon?: React.ReactNode;
+    bodyClassName?: string | undefined;
+    outsideClickDisable?: boolean;
+    hideCross?: boolean;
+    okButtonLoading?: boolean;
+    okButtonDisabled?: boolean;
+    variant?: "primary" | "secondary";
+    okBtnClasses?: string | undefined;
+    cancelButtonAnalytics?: object | undefined;
+    okButtonAnalytics?: object | undefined;
+    footerMargintopDisable?: boolean;
+}

package/dist/types/components/Radio/Radio.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import { RadioProps } from "./types";
+declare const Radio: React.FC<RadioProps>;
+export default Radio;

package/dist/types/components/Radio/index.d.ts

@@ -0,0 +1 @@
+export { default as Radio } from "./Radio";

package/dist/types/components/Radio/types.d.ts

@@ -0,0 +1,11 @@
+import { RadioChangeEvent } from "antd/lib/radio";
+export interface RadioProps {
+    checked?: boolean;
+    className?: string;
+    onChange?: (event: RadioChangeEvent) => void;
+    children?: React.ReactNode;
+    size?: "large" | "small" | "medium";
+    variant?: "normal" | "emphasized";
+    disabled?: boolean;
+    extra?: React.ReactNode;
+}

package/dist/types/components/Switch/Switch.d.ts

@@ -0,0 +1,4 @@
+import * as React from "react";
+import { SwitchProps } from "./types";
+declare const Switch: React.FC<SwitchProps>;
+export default Switch;

package/dist/types/components/Switch/index.d.ts

@@ -0,0 +1 @@
+export { default as Switch } from "./Switch";

package/dist/types/components/Switch/types.d.ts

@@ -0,0 +1,7 @@
+export interface SwitchProps {
+    size?: "default" | "small";
+    className?: string | undefined;
+    onChange?: (checked: boolean, event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement>) => void;
+    disabled?: boolean;
+    checked?: boolean;
+}

package/dist/types/components/Tag/Tag.d.ts

@@ -0,0 +1,4 @@
+import * as React from "react";
+import { TagProps } from "./type";
+declare const Tag: React.FC<TagProps>;
+export default Tag;

package/dist/types/components/Tag/index.d.ts

@@ -0,0 +1 @@
+export { default as Tag } from "./Tag";

package/dist/types/components/Tag/type.d.ts

@@ -0,0 +1,7 @@
+export interface TagProps {
+    className?: string;
+    type?: "success" | "warning" | "blue" | "processing" | "failed" | undefined;
+    title?: string;
+    icon?: React.ReactNode;
+    size?: string;
+}

package/dist/types/components/Tooltip/Tooltip.d.ts

@@ -0,0 +1,3 @@
+import { TooltipProps } from "./types";
+declare const Tooltip: React.FC<TooltipProps>;
+export default Tooltip;

package/dist/types/components/Tooltip/index.d.ts

@@ -0,0 +1 @@
+export { default as Tooltip } from "./Tooltip";

package/dist/types/components/Tooltip/types.d.ts

@@ -0,0 +1,8 @@
+export interface TooltipProps {
+    children?: React.ReactNode;
+    title?: string | undefined;
+    placement?: "top" | "left" | "right" | "bottom" | "topLeft" | "topRight" | "bottomLeft" | "bottomRight" | "leftTop" | "leftBottom" | "rightTop" | "rightBottom" | undefined;
+    color?: string | undefined;
+    className?: string | undefined;
+    mode?: "light" | "dark";
+}

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

@@ -0,0 +1,7 @@
+export * from "./Button";
+export * from "./Switch";
+export * from "./Modal";
+export * from "./Tooltip";
+export * from './Checkbox';
+export * from './Radio';
+export * from './Tag';

package/dist/types/index.d.ts

@@ -0,0 +1 @@
+export * from "./components";

package/package.json

@@ -1,10 +1,21 @@
 {
   "name": "@itilite/lumina-ui",
-  "version": "0.0.6",
+  "version": "0.0.31",
   "description": "Design system",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "types": "dist/types/index.d.ts",
+  "scripts": {
+    "build:types": "tsc --emitDeclarationOnly",
+    "build": "rollup -c",
+    "prebuild:all": "node -v && npm -v && pwd && ls -la",
+    "build:all": "ROLLUP_DEBUG=* rollup -c && tsc --emitDeclarationOnly",
+    "dev": "rollup -c -w",
+    "lint": "eslint ",
+    "lint:fix": "eslint ./src --ext .ts,.tsx --fix",
+    "test": "jest",
+    "publish": "npm init --scope=itilite && npm publish"
+  },
   "author": "Itilite",
   "license": "ISC",
   "devDependencies": {
@@ -77,14 +88,8 @@
     "url": "https://github.com/Itilite/design-system/issues"
   },
   "homepage": "https://github.com/Itilite/design-system#readme",
-  "scripts": {
-    "build:types": "tsc --emitDeclarationOnly",
-    "build": "rollup -c",
-    "prebuild:all": "node -v && npm -v && pwd && ls -la",
-    "build:all": "ROLLUP_DEBUG=* rollup -c && tsc --emitDeclarationOnly",
-    "dev": "rollup -c -w",
-    "lint": "eslint ",
-    "lint:fix": "eslint ./src --ext .ts,.tsx --fix",
-    "test": "jest"
+  "dependencies": {
+    "minimatch": "^8.0.4",
+    "minipass": "^4.2.8"
   }
-}
+}

package/src/components/Button/Button.module.scss

@@ -32,29 +32,23 @@
 		box-shadow: 0 1px 0 0 rgba(17, 24, 39, 0.1);
 		&:global(.ant-btn-primary):hover,
 		&:global(.ant-btn-primary):active {
-			@apply tw-bg-color-action-primary-hover;
+			@apply tw-bg-color-action-primary;
 			box-shadow: 0px 2px 4px 0px rgba(17, 24, 39, 0.1);
 		}
-		&.variant_subtle {
-			@apply tw-text-color-text-primary;
-			&:hover {
-				@apply tw-text-color-text-primary-hover;
-			}
-		}
 		&:focus-visible {
 			outline: 2px solid #ec5d2561;
 		}
 		&.variant_subtle {
 			@apply tw-text-color-text-primary;
 			&:hover {
-				@apply tw-text-color-text-primary-hover;
+				@apply tw-text-color-text-primary;
 			}
 		}
 		&.variant_text,
 		&.variant_link {
 			@apply tw-text-color-text-primary;
 			&:hover {
-				@apply tw-text-color-text-primary-hover;
+				@apply tw-text-color-text-primary;
 			}
 		}
 	}
@@ -153,7 +147,7 @@
 		@apply tw-h-auto;
 		box-shadow: none;
 		&:global(.ant-btn-default):hover {
-			&.onHoverUnderline {
+			&.onHoverUnderline{
 				text-decoration: underline;
 			}
 			box-shadow: none;

package/src/components/Button/Button.tsx

@@ -21,9 +21,6 @@ const Button: React.FC<ButtonProps> = (props) => {
 		disabled = false,
 		loading = false,
 		onHoverUnderline = false,
-		id = "",
-		name = "",
-		tabIndex = 0,
 	} = props;
 
 	const buttonMap: Record<string, "primary" | "default" | "text" | "link"> = {
@@ -41,8 +38,6 @@ const Button: React.FC<ButtonProps> = (props) => {
 
 	return (
 		<AntButton
-			id={id}
-			name={name}
 			className={clsx(
 				classes.button,
 				classes[`size_${size}`],
@@ -71,7 +66,6 @@ const Button: React.FC<ButtonProps> = (props) => {
 			loading={loading}
 			href={href || undefined}
 			data-testid='lumina-button'
-			tabIndex={tabIndex}
 		>
 			{children}
 		</AntButton>
@@ -91,7 +85,6 @@ Button.propTypes = {
 	disabled: PropTypes.bool,
 	loading: PropTypes.bool,
 	href: PropTypes.string,
-	tabIndex: PropTypes.number,
 	onHoverUnderline: PropTypes.bool,
 };
 

package/src/components/Button/types.ts

@@ -1,6 +1,4 @@
 export interface ButtonProps {
-	id?: string;
-	name?: string;
 	type?: "primary" | "secondary" | "critical" | undefined;
 	variant?: "subtle" | "text" | "link";
 	size?: "large" | "small";
@@ -15,5 +13,4 @@ export interface ButtonProps {
 	loading?: boolean;
 	onHoverUnderline?: boolean;
 	analytics?: Record<string, unknown>;
-	tabIndex?: number;
 }

package/src/components/Tag/Tag.module.scss

@@ -0,0 +1,61 @@
+.tag {
+	@apply tw-rounded;
+	@apply tw-p-1;
+	@apply tw-font-medium;
+	@apply tw-text-font-size-10;
+	@apply tw-leading-3;
+	@apply tw-bg-white;
+	@apply tw-h-max;
+	@apply tw-border-solid;
+	border-width: 0.5px;
+	&.small {
+		@apply tw-py-[2px] tw-px-1;
+		@apply tw-text-font-size-10;
+		@apply tw-leading-3;
+	}
+	&.success {
+		@apply tw-text-color-green-500;
+		@apply tw-bg-color-surface-success;
+		@apply tw-border-color-green-200;
+	}
+	&.blue {
+		@apply tw-text-color-blue-500;
+		@apply tw-bg-color-blue-50;
+		@apply tw-border-color-blue-200;
+	}
+	&.warning {
+		@apply tw-text-color-orange-600;
+		@apply tw-bg-color-orange-50;
+		@apply tw-border-color-orange-200;
+	}
+	&.processing {
+		@apply tw-text-color-text-weak;
+		@apply tw-bg-color-surface-default-hover;
+		@apply tw-border-color-gray-200;
+	}
+	&.bookingConfirmed {
+		@apply tw-text-color-text-success;
+		@apply tw-bg-color-surface-success;
+		@apply tw-border-color-green-200;
+	}
+	&.bookingRescheduled {
+		@apply tw-text-color-text-info;
+		@apply tw-bg-color-surface-info;
+		@apply tw-border-color-infoSubtle;
+	}
+	&.bookingRescheduledPending {
+		@apply tw-text-color-text-warning;
+		@apply tw-bg-color-surface-warning;
+		@apply tw-border-color-warningSubtle;
+	}
+	&.failed {
+		@apply tw-text-color-text-critical;
+		@apply tw-bg-color-surface-critical;
+		@apply tw-border-color-red-200;
+	}
+	&.bookingPending {
+		@apply tw-text-color-text-weak;
+		@apply tw-bg-color-surface-default-hover;
+		@apply tw-border-color-text-weak;
+	}
+}

package/src/components/Tag/Tag.tsx

@@ -0,0 +1,34 @@
+import * as React from "react";
+import { Tag as AntTag } from "antd";
+import clsx from "clsx";
+
+import classes from "./Tag.module.scss";
+import { TagProps } from "./type";
+
+const Tag: React.FC<TagProps> = (props) => {
+	const {
+		type = "success",
+		className = "",
+		title = "",
+		icon = null,
+		size = "",
+		...rest
+	} = props;
+	return (
+		<AntTag
+			className={clsx(
+				classes.tag,
+				size === "small" && classes.small,
+				classes[type],
+				className
+			)}
+			icon={icon}
+			{...rest}
+		>
+			{title}
+		</AntTag>
+	);
+};
+
+export default Tag;
+Tag.displayName = "Tag";

package/src/components/Tag/index.ts

@@ -0,0 +1 @@
+export { default as Tag } from "./Tag";

package/src/components/Tag/type.ts

@@ -0,0 +1,7 @@
+export interface TagProps {
+	className?: string;
+	type?: "success" | "warning" | "blue" | "processing" | "failed" | undefined;
+	title?: string;
+	icon?: React.ReactNode;
+	size?: string;
+}

package/src/components/index.ts

@@ -4,4 +4,5 @@ export * from "./Modal";
 export * from "./Tooltip";
 
 export * from './Checkbox'
-export * from './Radio';
+export * from './Radio';
+export * from './Tag';