@dnanpm/ui-components 0.0.5 → 0.1.0

package/package.json

@@ -1,10 +1,13 @@
 {
     "name": "@dnanpm/ui-components",
-    "version": "0.0.5",
+    "version": "0.1.0",
     "description": "DNA Design System - React UI Components",
     "author": "DNA Oy",
     "license": "ISC",
     "type": "module",
+    "sideEffects": [
+        "**/*.css"
+    ],
     "main": "./dist/index.cjs",
     "module": "./dist/index.js",
     "types": "./dist/index.d.ts",
@@ -14,11 +17,9 @@
             "import": "./dist/index.js",
             "require": "./dist/index.cjs"
         },
-        "./styles.css": "./dist/styles.css"
+        "./styles.css": "./dist/styles.css",
+        "./font-definitions.css": "./dist/font-definitions.css"
     },
-    "sideEffects": [
-        "**/*.css"
-    ],
     "files": [
         "dist"
     ],
@@ -51,8 +52,8 @@
         "node": ">=24"
     },
     "dependencies": {
-        "clsx": "^2.1.1",
-        "@base-ui/react": "^1.3.0"
+        "@dnanpm/icons": "^2.0.17",
+        "clsx": "^2.1.1"
     },
     "peerDependencies": {
         "react": "^18.0.0 || ^19.0.0",
@@ -73,6 +74,7 @@
         "eslint": "^9.39.2",
         "jsdom": "^28.1.0",
         "plop": "^4.0.5",
+        "postcss": "^8.5.10",
         "prettier": "^3.8.1",
         "react": "^19.2.4",
         "react-dom": "^19.2.4",

package/dist/components/Box/Box.d.ts

@@ -1,2 +0,0 @@
-export declare const Box: import('react').ForwardRefExoticComponent<import('./Box.types').BaseBoxProps & import('react').HTMLAttributes<HTMLElement> & import('react').RefAttributes<HTMLElement>>;
-//# sourceMappingURL=Box.d.ts.map

package/dist/components/Box/Box.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Box.d.ts","sourceRoot":"","sources":["../../../src/components/Box/Box.tsx"],"names":[],"mappings":"AAKA,eAAO,MAAM,GAAG,0KAUf,CAAC"}

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

@@ -1,24 +0,0 @@
-import * as React from 'react';
-export type BoxElevation = 'none' | 'low' | 'high' | 'extraHigh';
-export interface BaseBoxProps {
-    /**
-     * The element type to render
-     * @default "div"
-     */
-    readonly as?: React.ElementType;
-    /**
-     * The elevation level (shadow depth) of the box
-     * @default "none"
-     */
-    readonly elevation?: BoxElevation;
-    /**
-     * The content of the box
-     */
-    readonly children?: React.ReactNode;
-    /**
-     * Custom className to apply to the box
-     */
-    readonly className?: string;
-}
-export type BoxProps = BaseBoxProps & React.HTMLAttributes<HTMLElement>;
-//# sourceMappingURL=Box.types.d.ts.map

package/dist/components/Box/Box.types.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Box.types.d.ts","sourceRoot":"","sources":["../../../src/components/Box/Box.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,MAAM,MAAM,YAAY,GAAG,MAAM,GAAG,KAAK,GAAG,MAAM,GAAG,WAAW,CAAC;AAEjE,MAAM,WAAW,YAAY;IACzB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;IAChC;;;OAGG;IACH,QAAQ,CAAC,SAAS,CAAC,EAAE,YAAY,CAAC;IAClC;;OAEG;IACH,QAAQ,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACpC;;OAEG;IACH,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;CAC/B;AAED,MAAM,MAAM,QAAQ,GAAG,YAAY,GAAG,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,CAAC"}

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

@@ -1,3 +0,0 @@
-export { Box } from './Box';
-export type { BoxProps, BoxElevation } from './Box.types';
-//# sourceMappingURL=index.d.ts.map

package/dist/components/Box/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Box/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAC5B,YAAY,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC"}

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

@@ -1,3 +0,0 @@
-import { ButtonProps } from './Button.types';
-export declare const Button: import('react').ForwardRefExoticComponent<ButtonProps & import('react').RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
-//# sourceMappingURL=Button.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAGlD,eAAO,MAAM,MAAM,+HAoDlB,CAAC"}

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

@@ -1,51 +0,0 @@
-import * as React from 'react';
-interface BaseButtonProps {
-    /**
-     * The visual style variant of the button
-     * @default "primary"
-     */
-    readonly variant?: 'primary' | 'secondary';
-    /**
-     * The size variant of the button
-     * @default "default"
-     */
-    readonly size?: 'default' | 'small';
-    /**
-     * The content of the button
-     */
-    readonly children: React.ReactNode;
-    /**
-     * Whether the button should take full width
-     * @default false
-     */
-    readonly fullWidth?: boolean;
-    /**
-     * Whether the button is in a loading state
-     * @default false
-     */
-    readonly loading?: boolean;
-    /**
-     * Custom className to apply to the button
-     */
-    readonly className?: string;
-}
-interface ButtonAsButton extends BaseButtonProps, Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children' | 'className'> {
-    /**
-     * Render as a different element (button or anchor)
-     * @default "button"
-     */
-    readonly as?: 'button';
-}
-interface ButtonAsAnchor extends BaseButtonProps, Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'children' | 'className'> {
-    /**
-     * Render as a different element (button or anchor)
-     */
-    readonly as: 'a';
-    /**
-     * The URL to link to (required when as="a")
-     */
-    readonly href: string;
-}
-export type ButtonProps = ButtonAsButton | ButtonAsAnchor;
-export {};
-//# sourceMappingURL=Button.types.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Button.types.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,UAAU,eAAe;IACrB;;;OAGG;IACH,QAAQ,CAAC,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,CAAC;IAC3C;;;OAGG;IACH,QAAQ,CAAC,IAAI,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IACpC;;OAEG;IACH,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IACnC;;;OAGG;IACH,QAAQ,CAAC,SAAS,CAAC,EAAE,OAAO,CAAC;IAC7B;;;OAGG;IACH,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC;IAC3B;;OAEG;IACH,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;CAC/B;AAED,UAAU,cACN,SACI,eAAe,EACf,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,UAAU,GAAG,WAAW,CAAC;IACjF;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,EAAE,QAAQ,CAAC;CAC1B;AAED,UAAU,cACN,SACI,eAAe,EACf,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,UAAU,GAAG,WAAW,CAAC;IACjF;;OAEG;IACH,QAAQ,CAAC,EAAE,EAAE,GAAG,CAAC;IACjB;;OAEG;IACH,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;CACzB;AAED,MAAM,MAAM,WAAW,GAAG,cAAc,GAAG,cAAc,CAAC"}

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

@@ -1,3 +0,0 @@
-export { Button } from './Button';
-export type { ButtonProps } from './Button.types';
-//# sourceMappingURL=index.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/components/Dialog/Dialog.d.ts

@@ -1,3 +0,0 @@
-import { DialogProps } from './Dialog.types';
-export declare const Dialog: import('react').ForwardRefExoticComponent<DialogProps & import('react').RefAttributes<HTMLDivElement>>;
-//# sourceMappingURL=Dialog.d.ts.map

package/dist/components/Dialog/Dialog.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAElD,eAAO,MAAM,MAAM,wGAsDjB,CAAC"}

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

@@ -1,45 +0,0 @@
-import { DialogPortalProps, DialogRootProps } from '@base-ui/react/dialog';
-import * as React from 'react';
-export type DialogSize = 'sm' | 'md' | 'lg';
-export interface DialogProps extends Omit<DialogRootProps, 'children' | 'disablePointerDismissal'>, Pick<DialogPortalProps, 'keepMounted'> {
-    /**
-     * Optional trigger element composed without changing its public API.
-     */
-    readonly trigger?: React.ReactElement;
-    /**
-     * Dialog title announced by assistive technology.
-     */
-    readonly title: React.ReactNode;
-    /**
-     * Optional supporting copy below the title.
-     */
-    readonly description?: React.ReactNode;
-    /**
-     * Main dialog content.
-     */
-    readonly children?: React.ReactNode;
-    /**
-     * Optional footer actions.
-     */
-    readonly footer?: React.ReactNode;
-    /**
-     * Whether clicking the backdrop should close the dialog.
-     * @default true
-     */
-    readonly closeOnOutsideClick?: boolean;
-    /**
-     * Accessible label for the close button.
-     * @default 'Close dialog'
-     */
-    readonly closeLabel?: string;
-    /**
-     * Width preset for the popup.
-     * @default 'md'
-     */
-    readonly size?: DialogSize;
-    /**
-     * Optional popup className.
-     */
-    readonly className?: string;
-}
-//# sourceMappingURL=Dialog.types.d.ts.map

package/dist/components/Dialog/Dialog.types.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Dialog.types.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,iBAAiB,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAEhF,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE5C,MAAM,WAAW,WACb,SACI,IAAI,CAAC,eAAe,EAAE,UAAU,GAAG,yBAAyB,CAAC,EAC7D,IAAI,CAAC,iBAAiB,EAAE,aAAa,CAAC;IAC1C;;OAEG;IACH,QAAQ,CAAC,OAAO,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IACtC;;OAEG;IACH,QAAQ,CAAC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC;;OAEG;IACH,QAAQ,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvC;;OAEG;IACH,QAAQ,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACpC;;OAEG;IACH,QAAQ,CAAC,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAClC;;;OAGG;IACH,QAAQ,CAAC,mBAAmB,CAAC,EAAE,OAAO,CAAC;IACvC;;;OAGG;IACH,QAAQ,CAAC,UAAU,CAAC,EAAE,MAAM,CAAC;IAC7B;;;OAGG;IACH,QAAQ,CAAC,IAAI,CAAC,EAAE,UAAU,CAAC;IAC3B;;OAEG;IACH,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;CAC/B"}

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

@@ -1,3 +0,0 @@
-export { Dialog } from './Dialog';
-export type { DialogProps, DialogSize } from './Dialog.types';
-//# sourceMappingURL=index.d.ts.map

package/dist/components/Dialog/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC"}

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

@@ -1,3 +0,0 @@
-import { TooltipProps } from './Tooltip.types';
-export declare const Tooltip: import('react').ForwardRefExoticComponent<TooltipProps & import('react').RefAttributes<HTMLDivElement>>;
-//# sourceMappingURL=Tooltip.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../src/components/Tooltip/Tooltip.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAEpD,eAAO,MAAM,OAAO,yGAqClB,CAAC"}

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

@@ -1,39 +0,0 @@
-import { TooltipPortalProps, TooltipPositionerProps, TooltipRootProps, TooltipTriggerProps } from '@base-ui/react/tooltip';
-import * as React from 'react';
-export type TooltipSide = 'top' | 'right' | 'bottom' | 'left';
-export type TooltipAlign = 'start' | 'center' | 'end';
-export interface TooltipProps extends Omit<TooltipRootProps, 'children'>, Pick<TooltipTriggerProps, 'delay' | 'closeDelay'>, Pick<TooltipPortalProps, 'keepMounted'>, Pick<TooltipPositionerProps, 'side' | 'align' | 'sideOffset'> {
-    /**
-     * Visual tooltip content rendered in the popup.
-     */
-    readonly content: React.ReactNode;
-    /**
-     * Trigger element composed without changing its public API.
-     */
-    readonly children: React.ReactElement;
-    /**
-     * Preferred tooltip side.
-     * @default 'top'
-     */
-    readonly side?: TooltipSide;
-    /**
-     * Popup alignment relative to the trigger.
-     * @default 'center'
-     */
-    readonly align?: TooltipAlign;
-    /**
-     * Space between trigger and popup.
-     * @default 8
-     */
-    readonly sideOffset?: number;
-    /**
-     * Whether to render the arrow.
-     * @default true
-     */
-    readonly showArrow?: boolean;
-    /**
-     * Optional popup className.
-     */
-    readonly className?: string;
-}
-//# sourceMappingURL=Tooltip.types.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Tooltip.types.d.ts","sourceRoot":"","sources":["../../../src/components/Tooltip/Tooltip.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EACR,kBAAkB,EAClB,sBAAsB,EACtB,gBAAgB,EAChB,mBAAmB,EACtB,MAAM,wBAAwB,CAAC;AAEhC,MAAM,MAAM,WAAW,GAAG,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;AAC9D,MAAM,MAAM,YAAY,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;AAEtD,MAAM,WAAW,YACb,SACI,IAAI,CAAC,gBAAgB,EAAE,UAAU,CAAC,EAClC,IAAI,CAAC,mBAAmB,EAAE,OAAO,GAAG,YAAY,CAAC,EACjD,IAAI,CAAC,kBAAkB,EAAE,aAAa,CAAC,EACvC,IAAI,CAAC,sBAAsB,EAAE,MAAM,GAAG,OAAO,GAAG,YAAY,CAAC;IACjE;;OAEG;IACH,QAAQ,CAAC,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IAClC;;OAEG;IACH,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC;IACtC;;;OAGG;IACH,QAAQ,CAAC,IAAI,CAAC,EAAE,WAAW,CAAC;IAC5B;;;OAGG;IACH,QAAQ,CAAC,KAAK,CAAC,EAAE,YAAY,CAAC;IAC9B;;;OAGG;IACH,QAAQ,CAAC,UAAU,CAAC,EAAE,MAAM,CAAC;IAC7B;;;OAGG;IACH,QAAQ,CAAC,SAAS,CAAC,EAAE,OAAO,CAAC;IAC7B;;OAEG;IACH,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;CAC/B"}

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

@@ -1,3 +0,0 @@
-export { Tooltip } from './Tooltip';
-export type { TooltipAlign, TooltipProps, TooltipSide } from './Tooltip.types';
-//# sourceMappingURL=index.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Tooltip/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,YAAY,EAAE,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC"}

package/dist/components/index.d.ts

@@ -1,5 +0,0 @@
-export * from './Box';
-export * from './Button';
-export * from './Dialog';
-export * from './Tooltip';
-//# sourceMappingURL=index.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,OAAO,CAAC;AACtB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC"}