@fpkit/acss 0.5.12 → 0.6.0

package/libs/chunk-QVV34QEH.cjs

@@ -1,32 +0,0 @@
-'use strict';
-
-var chunk6TE5QEVE_cjs = require('./chunk-6TE5QEVE.cjs');
-var i = require('react');
-
-function _interopNamespace(e) {
-	if (e && e.__esModule) return e;
-	var n = Object.create(null);
-	if (e) {
-		Object.keys(e).forEach(function (k) {
-			if (k !== 'default') {
-				var d = Object.getOwnPropertyDescriptor(e, k);
-				Object.defineProperty(n, k, d.get ? d : {
-					enumerable: true,
-					get: function () { return e[k]; }
-				});
-			}
-		});
-	}
-	n.default = e;
-	return Object.freeze(n);
-}
-
-var i__namespace = /*#__PURE__*/_interopNamespace(i);
-
-var n=({type:t="li",id:e,styles:s,children:o,classes:r,...p})=>i__namespace.createElement(chunk6TE5QEVE_cjs.a,{id:e,as:t,className:r,...p,style:s},o),l=({children:t,classes:e,type:s="ul",variant:o,styles:r,role:p,...m})=>i__namespace.createElement(chunk6TE5QEVE_cjs.a,{as:s,"data-variant":o,className:e,style:r,role:p,...m},t),I=l;l.displayName="List";l.ListItem=n;
-
-exports.a = n;
-exports.b = l;
-exports.c = I;
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=chunk-QVV34QEH.cjs.map

package/libs/chunk-QVV34QEH.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/list/list.tsx"],"names":["React","ListItem","type","id","styles","children","classes","props","ui_default","List","variant","role","list_default"],"mappings":"oCAAA,UAAYA,MAAW,QAuBhB,IAAMC,EAAW,CAAC,CACvB,KAAAC,EAAO,KACP,GAAAC,EACA,OAAAC,EACA,SAAAC,EACA,QAAAC,EACA,GAAGC,CACL,IAEI,gBAACC,EAAA,CAAG,GAAIL,EAAI,GAAID,EAAM,UAAWI,EAAU,GAAGC,EAAO,MAAOH,GACzDC,CACH,EAcSI,EAAO,CAAC,CACnB,SAAAJ,EACA,QAAAC,EACA,KAAAJ,EAAO,KACP,QAAAQ,EACA,OAAAN,EACA,KAAAO,EACA,GAAGJ,CACL,IAEI,gBAACC,EAAA,CACC,GAAIN,EACJ,eAAcQ,EACd,UAAWJ,EACX,MAAOF,EACP,KAAMO,EACL,GAAGJ,GAEHF,CACH,EAIGO,EAAQH,EACfA,EAAK,YAAc,OACnBA,EAAK,SAAWR","sourcesContent":["import * as React from 'react'\nimport UI from '../ui'\n\ntype ListProps = {\n  /** Type of list to render (default: 'ul') */\n  type?: 'ul' | 'ol' | 'dl'\n  /** variant of list to render (default: 'none') */\n  variant?: string\n} & React.ComponentProps<typeof UI>\n\nexport type ListItemProps = {\n  /** Type of list item to render (default: 'li') */\n  type?: 'li' | 'dt' | 'dd'\n} & React.ComponentProps<typeof UI>\n\n/**\n * ListItem component\n * @param type - HTML tag type for the list item (default: 'li')\n * @param styles - CSS styles object\n * @param children - Child elements to be rendered inside the list item\n * @param props - Additional props to be passed to the underlying HTML element\n * @returns A React component that renders a list item\n */\nexport const ListItem = ({\n  type = 'li',\n  id,\n  styles,\n  children,\n  classes,\n  ...props\n}: ListItemProps) => {\n  return (\n    <UI id={id} as={type} className={classes} {...props} style={styles}>\n      {children}\n    </UI>\n  )\n}\n\n/**\n * List component renders a list element with provided props\n * @param children - Child elements to render inside the list\n * @param classes - CSS classes to apply\n * @param type - Type of list element (default: 'ul')\n * @param variant - Variant for styling purposes\n * @param styles - Inline styles object\n * @param role - ARIA role\n * @param props - Additional props to pass to underlying element\n */\nexport const List = ({\n  children,\n  classes,\n  type = 'ul',\n  variant,\n  styles,\n  role,\n  ...props\n}: ListProps) => {\n  return (\n    <UI\n      as={type}\n      data-variant={variant}\n      className={classes}\n      style={styles}\n      role={role}\n      {...props}\n    >\n      {children}\n    </UI>\n  )\n}\n\nexport default List\nList.displayName = 'List'\nList.ListItem = ListItem\n"]}

package/libs/chunk-S7BABR7Z.cjs

@@ -1,13 +0,0 @@
-'use strict';
-
-var e = require('react');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var e__default = /*#__PURE__*/_interopDefault(e);
-
-var y=e__default.default.forwardRef(({as:o,styles:t,classes:p,children:r,defaultStyles:n,...s},P)=>{let m=o||"div",C={...n,...t};return e__default.default.createElement(m,{ref:P,style:C,className:p,...s},r)}),a=y;
-
-exports.a = a;
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=chunk-S7BABR7Z.cjs.map

package/libs/chunk-S7BABR7Z.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/fp.tsx"],"names":["React","FP","as","styles","classes","children","defaultStyles","props","ref","Component","styleObj","fp_default"],"mappings":"AAAA,OAAOA,MAAW,QAyDlB,IAAMC,EAAkBD,EAAM,WAC5B,CACE,CAAE,GAAAE,EAAI,OAAAC,EAAQ,QAAAC,EAAS,SAAAC,EAAU,cAAAC,EAAe,GAAGC,CAAM,EACzDC,IACG,CACH,IAAMC,EAAYP,GAAM,MAElBQ,EAAW,CAAE,GAAGJ,EAAe,GAAGH,CAAO,EAE/C,OACEH,EAAA,cAACS,EAAA,CAAU,IAAKD,EAAK,MAAOE,EAAU,UAAWN,EAAU,GAAGG,GAC3DF,CACH,CAEJ,CACF,EAKOM,EAAQV","sourcesContent":["import React from 'react'\nimport { ComponentProps } from '../types'\n\ntype PolymorphicRef<C extends React.ElementType> =\n  React.ComponentPropsWithRef<C>['ref']\n\ntype AsProp<C extends React.ElementType> = {\n  as?: C\n}\n\ntype PropsToOmit<C extends React.ElementType, P> = keyof (AsProp<C> & P)\n\ntype PolymorphicComponentProp<\n  C extends React.ElementType,\n  Props = {},\n> = React.PropsWithChildren<Props & AsProp<C>> &\n  Omit<React.ComponentPropsWithoutRef<C>, PropsToOmit<C, Props>>\n\ntype PolymorphicComponentPropWithRef<\n  C extends React.ElementType,\n  Props = {},\n> = PolymorphicComponentProp<C, Props> & {\n  ref?: PolymorphicRef<C>\n}\n\ntype FPProps<C extends React.ElementType> = PolymorphicComponentPropWithRef<\n  C,\n  {\n    renderStyles?: boolean\n    styles?: React.CSSProperties\n    classes?: string\n  }\n>\n\n/*\n * FPComponent type definition\n *\n * Defines the component function signature for the FP component.\n *\n * @typeParam C - The HTML element type to render\n * @param props - The component props\n * @returns React component\n */\ntype FPComponent = <C extends React.ElementType = 'span'>(\n  props: FPProps<C>,\n) => React.ReactElement | any\n\n/**\n * FP component is a polymorphic component that renders an HTML element with optional styles.\n * @param {Object} props - Component props\n * @param {React.ElementType} props.as - The HTML element to render. Defaults to 'div'.\n * @param {boolean} props.renderStyles - Whether to render styles or not. Defaults to true.\n * @param {Object} props.styles - The styles to apply to the component.\n * @param {Object} props.defaultStyles - The default styles to apply to the component.\n * @param {React.ReactNode} props.children - The children to render inside the component.\n * @returns {React.ReactElement} - A React component that renders an HTML element with optional styles.\n */\nconst FP: FPComponent = React.forwardRef(\n  <C extends React.ElementType>(\n    { as, styles, classes, children, defaultStyles, ...props }: FPProps<C>,\n    ref?: PolymorphicRef<C>,\n  ) => {\n    const Component = as || 'div'\n\n    const styleObj = { ...defaultStyles, ...styles } as React.CSSProperties\n\n    return (\n      <Component ref={ref} style={styleObj} className={classes} {...props}>\n        {children}\n      </Component>\n    )\n  },\n)\nexport interface BoxProps extends ComponentProps {\n  renderStyles: true\n}\n\nexport default FP\n"]}

package/libs/chunk-SXVZSWX6.js

@@ -1,11 +0,0 @@
-import { a as a$1 } from './chunk-HYBZBN4G.js';
-import { b as b$1 } from './chunk-O6QZBB6G.js';
-import { b } from './chunk-QCMV4VQZ.js';
-import { a } from './chunk-NE6YXTMC.js';
-import r, { useRef, useEffect, useCallback } from 'react';
-
-var k=({dialogTitle:e,onClick:o,type:i="h3"})=>r.createElement(a,{as:"div",classes:"dialog-header"},r.createElement(a$1,{type:i,className:"dialog-title"},e||"Dialog"),r.createElement(b,{type:"button",onClick:()=>{o();},className:"dialog-close","aria-label":"Close dialog","data-btn":"icon"},r.createElement(b$1,null,r.createElement(b$1.Remove,{size:16})))),y=r.memo(k);k.displayName="DialogHeader";var E=({onClose:e,onConfirm:o,confirmLabel:i,cancelLabel:t})=>r.createElement(a,{as:"section",className:"dialog-footer"},t&&r.createElement(b,{type:"button",onClick:e,className:"dialog-button button-secondary","data-btn":"sm"},t),o&&r.createElement(b,{type:"button",onClick:o,className:"dialog-button button-primary","data-btn":"sm"},i)),P=E;var H=(e,o)=>useCallback(t=>{let l=e.current?.getBoundingClientRect();l&&(t.clientY<l.top||t.clientY>l.bottom||t.clientX<l.left||t.clientX>l.right)&&o();},[e,o]);var x=({showDialog:e,isAlertDialog:o,onClose:i,dialogTitle:t,dialogLabel:l,children:u,onConfirm:h,confirmLabel:I="Confirm",cancelLabel:L="Cancel",className:C="",hideFooter:N,styles:M})=>{let m=useRef(null),[g,b]=r.useState(e);useEffect(()=>{b(e);},[e]),useEffect(()=>{let n=m.current;n&&(g?o?n.show():n.showModal():n.close());},[g,o]);let c=()=>{i&&i(),b(!1);},U=H(m,c);return r.createElement(a,{as:"dialog",role:o?"alertdialog":"dialog",ref:m,onClose:c,onClick:U,"aria-modal":g?"true":void 0,className:`dialog-modal ${C}`,"aria-label":l,style:M},r.createElement(y,{dialogTitle:t,onClick:c}),r.createElement(a,{as:"section",className:`dialog-content ${C}`,onClick:n=>n.stopPropagation()},u,!N&&r.createElement(P,{onClose:c,onConfirm:h,confirmLabel:I,cancelLabel:L})))},A=r.memo(x);
-
-export { x as a, A as b };
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=chunk-SXVZSWX6.js.map

package/libs/chunk-SXVZSWX6.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/dialog/dialog.tsx","../src/components/dialog/views/dialog-header.tsx","../src/components/dialog/views/dialog-footer.tsx","../src/hooks/useDialogClickHandler.ts"],"names":["React","useRef","useEffect","DialogHeader","dialogTitle","onClick","type","ui_default","heading_default","button_default","icon_default","dialog_header_default","DialogFooter","onClose","onConfirm","confirmLabel","cancelLabel","dialog_footer_default","useCallback","useDialogClickHandler","dialogRef","handleClose","e","dialogDimensions","Dialog","showDialog","isAlertDialog","dialogLabel","children","className","hideFooter","styles","isOpen","setIsOpen","dialog","handleClickOutside","dialog_default"],"mappings":"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","sourcesContent":["import React, { useRef, useEffect, CSSProperties } from \"react\";\nimport UI from \"#components/ui\";\nimport DialogHeader from \"#components/dialog/views/dialog-header\";\nimport DialogFooter from \"#components/dialog/views/dialog-footer\";\nimport { useDialogClickHandler } from \"#hooks/useDialogClickHandler.js\";\n\n/**\n * Defines the props for the Dialog component.\n *\n * @property {boolean} [showDialog] - Determines whether the dialog should be shown.\n * @property {boolean} [isAlertDialog] - Determines whether the dialog should be displayed as an alert dialog.\n * @property {() => void} [onClose] - A callback function to be called when the dialog is closed.\n * @property {string} dialogTitle - The title of the dialog.\n * @property {string} [dialogLabel] - An optional label for the dialog.\n * @property {React.ReactNode} children - The content to be displayed inside the dialog.\n * @property {() => void | Promise<void>} [onConfirm] - A callback function to be called when the user confirms the dialog.\n * @property {string} [confirmLabel] - The label for the confirm button.\n * @property {string} [cancelLabel] - The label for the cancel button.\n * @property {string} [className] - An optional CSS class name to be applied to the dialog.\n * @property {CSSProperties} [styles] - Optional inline styles to be applied to the dialog.\n */\ntype DialogModalProps = React.ComponentProps<typeof UI> &\n  React.ComponentProps<\"dialog\"> & {\n    dialogTitle: string;\n    dialogLabel?: string;\n    children: React.ReactNode;\n    showDialog?: boolean;\n    isAlertDialog?: boolean;\n    onClose?: () => void;\n    onConfirm?: () => void | Promise<void>;\n    confirmLabel?: string;\n    cancelLabel?: string;\n    className?: string;\n    hideFooter?: boolean;\n    styles?: CSSProperties;\n  };\n\n/**\n * Renders a dialog modal component with customizable content and behavior.\n *\n * @param showDialog - Determines whether the dialog should be shown.\n * @param isAlertDialog - Determines whether the dialog should be displayed as an alert dialog.\n * @param onClose - A callback function to be called when the dialog is closed.\n * @param dialogTitle - The title of the dialog.\n * @param dialogLabel - An optional label for the dialog.\n * @param children - The content to be displayed inside the dialog.\n * @param onConfirm - A callback function to be called when the user confirms the dialog.\n * @param confirmLabel - The label for the confirm button.\n * @param cancelLabel - The label for the cancel button.\n * @param className - An optional CSS class name to be applied to the dialog.\n * @param styles - Optional inline styles to be applied to the dialog.\n */\nexport const Dialog: React.FC<DialogModalProps> = ({\n  showDialog,\n  isAlertDialog,\n  onClose,\n  dialogTitle,\n  dialogLabel,\n  children,\n  onConfirm,\n  confirmLabel = \"Confirm\",\n  cancelLabel = \"Cancel\",\n  className = \"\",\n  hideFooter,\n  styles,\n}) => {\n  const dialogRef = useRef<HTMLDialogElement>(null);\n  const [isOpen, setIsOpen] = React.useState(showDialog);\n\n  useEffect(() => {\n    setIsOpen(showDialog);\n  }, [showDialog]);\n\n  useEffect(() => {\n    const dialog = dialogRef.current;\n    if (!dialog) return;\n\n    if (isOpen) {\n      if (isAlertDialog) {\n        dialog.show();\n      } else {\n        dialog.showModal();\n      }\n    } else {\n      dialog.close();\n    }\n  }, [isOpen, isAlertDialog]);\n\n  const handleClose = () => {\n    if (onClose) onClose();\n    setIsOpen(false);\n  };\n\n  const handleClickOutside = useDialogClickHandler(dialogRef, handleClose);\n\n  return (\n    <UI\n      as=\"dialog\"\n      role={isAlertDialog ? \"alertdialog\" : \"dialog\"}\n      ref={dialogRef}\n      onClose={handleClose}\n      onClick={handleClickOutside}\n      aria-modal={isOpen ? \"true\" : undefined}\n      className={`${\"dialog-modal\"} ${className}`}\n      aria-label={dialogLabel}\n      style={styles}\n    >\n      <DialogHeader dialogTitle={dialogTitle} onClick={handleClose} />\n\n      <UI\n        as=\"section\"\n        className={`dialog-content ${className}`}\n        onClick={(e: React.MouseEvent) => e.stopPropagation()}\n      >\n        {children}\n        {!hideFooter && (\n          <DialogFooter\n            onClose={handleClose}\n            onConfirm={onConfirm}\n            confirmLabel={confirmLabel}\n            cancelLabel={cancelLabel}\n          />\n        )}\n      </UI>\n    </UI>\n  );\n};\nexport default React.memo(Dialog);\n","import React from \"react\";\nimport UI from \"#components/ui\";\nimport Heading from \"#components/heading/heading\";\nimport Button from \"#components/buttons/button\";\nimport Icon from \"#components/icons/icon\";\n\nexport type DialogHeaderProps = {\n  dialogTitle: string;\n  onClick: () => void;\n} & React.ComponentProps<typeof Heading>;\n\n/**\n * DialogHeader component displays the header section of a dialog with a title and close button.\n *\n * @component\n * @param {Object} props - Component props\n * @param {string} props.dialogTitle - The title text to display in the dialog header\n * @param {() => void} props.onClick - Callback function triggered when close button is clicked\n * @param {string} [props.type='h3'] - Heading type/level to use for the title\n * @returns {JSX.Element} A dialog header with title and close button\n *\n * @example\n * ```jsx\n * <DialogHeader\n *   dialogTitle=\"Confirm Action\"\n *   onClick={() => setIsOpen(false)}\n *   type=\"h2\"\n * />\n * ```\n */\n\nconst DialogHeader = ({\n  dialogTitle,\n  onClick,\n  type = \"h3\",\n}: DialogHeaderProps): JSX.Element => {\n  const handleClose = () => {\n    onClick();\n  };\n  return (\n    <UI as=\"div\" classes=\"dialog-header\">\n      <Heading type={type} className=\"dialog-title\">\n        {dialogTitle || \"Dialog\"}\n      </Heading>\n      <Button\n        type=\"button\"\n        onClick={handleClose}\n        className=\"dialog-close\"\n        aria-label=\"Close dialog\"\n        data-btn=\"icon\"\n      >\n        <Icon>\n          <Icon.Remove size={16} />\n        </Icon>\n      </Button>\n    </UI>\n  );\n};\n\nexport default React.memo(DialogHeader);\nDialogHeader.displayName = \"DialogHeader\";\n","import React from \"react\";\nimport UI from \"#components/ui\";\nimport Button from \"#components/buttons/button\";\n\ntype DialogFooterProps = {\n  onClose: () => void;\n  onConfirm?: () => void | Promise<void>;\n  confirmLabel: string;\n  cancelLabel: string;\n};\n\nconst DialogFooter: React.FC<DialogFooterProps> = ({\n  onClose,\n  onConfirm,\n  confirmLabel,\n  cancelLabel,\n}) => {\n  return (\n    <UI as=\"section\" className=\"dialog-footer\">\n      {cancelLabel && (\n        <Button\n          type=\"button\"\n          onClick={onClose}\n          className=\"dialog-button button-secondary\"\n          data-btn=\"sm\"\n        >\n          {cancelLabel}\n        </Button>\n      )}\n\n      {onConfirm && (\n        <Button\n          type=\"button\"\n          onClick={onConfirm}\n          className=\"dialog-button button-primary\"\n          data-btn=\"sm\"\n        >\n          {confirmLabel}\n        </Button>\n      )}\n    </UI>\n  );\n};\n\nexport default DialogFooter;\n","import { useCallback, RefObject } from \"react\";\n\nexport const useDialogClickHandler = (\n  dialogRef: RefObject<HTMLDialogElement>,\n  handleClose: () => void\n) => {\n  const handleClick = useCallback(\n    (e: React.MouseEvent<HTMLDialogElement>) => {\n      const dialogDimensions = dialogRef.current?.getBoundingClientRect();\n      if (dialogDimensions) {\n        const isClickOutside =\n          e.clientY < dialogDimensions.top ||\n          e.clientY > dialogDimensions.bottom ||\n          e.clientX < dialogDimensions.left ||\n          e.clientX > dialogDimensions.right;\n\n        if (isClickOutside) {\n          handleClose();\n        }\n      }\n    },\n    [dialogRef, handleClose]\n  );\n\n  return handleClick;\n};\n"]}

package/libs/chunk-X3EVB7VS.cjs

@@ -1,15 +0,0 @@
-'use strict';
-
-var chunk6TE5QEVE_cjs = require('./chunk-6TE5QEVE.cjs');
-var m = require('react');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var m__default = /*#__PURE__*/_interopDefault(m);
-
-var a=({href:i,target:e,rel:p,children:l,styles:s,prefetch:t,btnStyle:c,onPointerDown:n,...f})=>{let r=p;return e==="_blank"&&(r=`noopener noreferrer ${t?"prefetch":""}`),m__default.default.createElement(chunk6TE5QEVE_cjs.a,{as:"a",href:i,target:e,styles:s,rel:r,onPointerDown:h=>{n&&n?.(h);},"data-btn":c,prefetch:t,...f},l)},y=a;a.displayName="Link";
-
-exports.a = a;
-exports.b = y;
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=chunk-X3EVB7VS.cjs.map

package/libs/chunk-X3EVB7VS.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/link/link.tsx"],"names":["React","Link","href","target","rel","children","styles","prefetch","btnStyle","onPointerDown","props","relValue","ui_default","e","link_default"],"mappings":"yCACA,OAAOA,MAAW,QAqBX,IAAMC,EAAO,CAAC,CACnB,KAAAC,EACA,OAAAC,EACA,IAAAC,EACA,SAAAC,EACA,OAAAC,EACA,SAAAC,EACA,SAAAC,EACA,cAAAC,EACA,GAAGC,CACL,IAAiB,CACf,IAAIC,EAAWP,EAEf,OAAID,IAAW,WACbQ,EAAW,uBAAuBJ,EAAW,WAAa,EAAE,IAO5DP,EAAA,cAACY,EAAA,CACC,GAAG,IACH,KAAMV,EACN,OAAQC,EACR,OAAQG,EACR,IAAKK,EACL,cAXyBE,GAA6C,CACpEJ,GAAeA,IAAgBI,CAAC,CACtC,EAUI,WAAUL,EACV,SAAUD,EACT,GAAGG,GAEHL,CACH,CAEJ,EAEOS,EAAQb,EACfA,EAAK,YAAc","sourcesContent":["import UI from \"../ui\";\nimport React from \"react\";\n\nexport type LinkProps = {\n  href?: string;\n\n  target?: string;\n\n  rel?: string;\n\n  children: React.ReactNode;\n\n  styles?: React.CSSProperties;\n\n  prefetch?: boolean;\n\n  btnStyle?: string;\n\n  onPointerDown?: (event: React.PointerEvent<HTMLAnchorElement>) => void;\n} & React.ComponentProps<typeof UI> &\n  React.ComponentProps<\"a\">;\n\nexport const Link = ({\n  href,\n  target,\n  rel,\n  children,\n  styles,\n  prefetch,\n  btnStyle,\n  onPointerDown,\n  ...props\n}: LinkProps) => {\n  let relValue = rel;\n\n  if (target === \"_blank\")\n    relValue = `noopener noreferrer ${prefetch ? \"prefetch\" : \"\"}`;\n\n  const handleOnpointerDown = (e: React.PointerEvent<HTMLAnchorElement>) => {\n    if (onPointerDown) onPointerDown?.(e);\n  };\n\n  return (\n    <UI\n      as=\"a\"\n      href={href}\n      target={target}\n      styles={styles}\n      rel={relValue}\n      onPointerDown={handleOnpointerDown}\n      data-btn={btnStyle}\n      prefetch={prefetch}\n      {...props}\n    >\n      {children}\n    </UI>\n  );\n};\n\nexport default Link;\nLink.displayName = \"Link\";\n"]}

package/libs/inputs-f3a216db.d.ts

@@ -1,45 +0,0 @@
-import React__default from 'react';
-
-type PolymorphicRef<C extends React__default.ElementType> = React__default.ComponentPropsWithRef<C>['ref'];
-type AsProp<C extends React__default.ElementType> = {
-    as?: C;
-};
-type PropsToOmit<C extends React__default.ElementType, P> = keyof (AsProp<C> & P);
-type PolymorphicComponentProp<C extends React__default.ElementType, Props = {}> = React__default.PropsWithChildren<Props & AsProp<C>> & Omit<React__default.ComponentPropsWithoutRef<C>, PropsToOmit<C, Props>>;
-type PolymorphicComponentPropWithRef<C extends React__default.ElementType, Props = {}> = PolymorphicComponentProp<C, Props> & {
-    ref?: PolymorphicRef<C>;
-};
-type FPProps<C extends React__default.ElementType> = PolymorphicComponentPropWithRef<C, {
-    renderStyles?: boolean;
-    styles?: React__default.CSSProperties;
-    classes?: string;
-}>;
-type FPComponent = <C extends React__default.ElementType = 'span'>(props: FPProps<C>) => React__default.ReactElement | any;
-/**
- * FP component is a polymorphic component that renders an HTML element with optional styles.
- * @param {Object} props - Component props
- * @param {React.ElementType} props.as - The HTML element to render. Defaults to 'div'.
- * @param {boolean} props.renderStyles - Whether to render styles or not. Defaults to true.
- * @param {Object} props.styles - The styles to apply to the component.
- * @param {Object} props.defaultStyles - The default styles to apply to the component.
- * @param {React.ReactNode} props.children - The children to render inside the component.
- * @returns {React.ReactElement} - A React component that renders an HTML element with optional styles.
- */
-declare const FP: FPComponent;
-
-type InputProps = {
-    /**
-     * The type of the input.
-     */
-    type?: "text" | "password" | "email" | "number" | "tel" | "url" | "search";
-    /**
-     * Set the element as disabled
-     */
-    isDisabled?: boolean;
-} & React__default.ComponentProps<typeof FP>;
-declare const Input: {
-    ({ type, name, value, placeholder, id, styles, classes, isDisabled, disabled, readonly, required, ref, onChange, onBlur, onPointerDown, ...props }: InputProps): JSX.Element;
-    displayName: string;
-};
-
-export { FP as F, Input as I, InputProps as a };

package/libs/ui-9a6f9f8d.d.ts

@@ -1,24 +0,0 @@
-import React__default from 'react';
-
-type PolymorphicRef<C extends React__default.ElementType> = React__default.ComponentPropsWithRef<C>["ref"];
-type AsProp<C extends React__default.ElementType> = {
-    as?: C;
-};
-type PropsToOmit<C extends React__default.ElementType, P> = keyof (AsProp<C> & P);
-type PolymorphicComponentProp<C extends React__default.ElementType, Props = {}> = React__default.PropsWithChildren<Props & AsProp<C>> & Omit<React__default.ComponentPropsWithoutRef<C>, PropsToOmit<C, Props>>;
-type PolymorphicComponentPropWithRef<C extends React__default.ElementType, Props = {}> = PolymorphicComponentProp<C, Props> & {
-    ref?: PolymorphicRef<C>;
-};
-type FPProps<C extends React__default.ElementType> = PolymorphicComponentPropWithRef<C, {
-    renderStyles?: boolean;
-    styles?: React__default.CSSProperties;
-    classes?: string;
-    id?: string;
-    children?: React__default.ReactNode;
-}>;
-type FPComponent = <C extends React__default.ElementType = "span">(props: FPProps<C>) => React__default.ReactElement | (any & {
-    displayName?: String;
-});
-declare const FP: FPComponent;
-
-export { FP as F };

package/src/components/cards/README.md

@@ -1,80 +0,0 @@
-
-# Card Component
-
-The Card component is a versatile and reusable React component for creating card-like UI elements. It's part of the FPKit React component library.
-
-## Usage
-
-```tsx
-import Card from 'libs/react/fpkit/src/components/cards/card';
-
-<Card>
-  <Card.Title>Card Title</Card.Title>
-  <Card.Content>
-    This is the content of the card.
-  </Card.Content>
-</Card>
-```
-
-## Components
-
-### Card
-
-The main container component for the card.
-
-#### Props
-
-- `elm?: 'div' | 'aside' | 'section' | 'article'` - HTML element to render as (default: 'div')
-- `title?: React.ReactNode` - Card title
-- `footer?: React.ReactNode` - Card footer
-- `styles?: React.CSSProperties` - Inline styles
-- `classes?: string` - Additional CSS classes
-- `id?: string` - Unique ID for the card
-
-All other props are passed through to the underlying UI component.
-
-### Card.Title
-
-A sub-component for rendering the card's title.
-
-#### Props
-
-- `as?: React.ElementType` - HTML element to render as (default: 'h3')
-- `className?: string` - Additional CSS classes
-- `styles?: React.CSSProperties` - Inline styles
-
-### Card.Content
-
-A sub-component for rendering the card's main content.
-
-#### Props
-
-- `className?: string` - Additional CSS classes
-- `styles?: React.CSSProperties` - Inline styles
-
-## Styling
-
-The component uses CSS classes for styling:
-
-- `.card-title` for the title
-- `.card-content` for the content
-
-You can override these classes or provide additional styling through the `className` and `styles` props.
-
-## Accessibility
-
-The Card component is designed with accessibility in mind:
-
-- It uses semantic HTML elements (`div`, `aside`, `section`, or `article`) for the main container.
-- The Title component defaults to using an `h3` element, which can be changed if needed.
-- The Content component uses an `article` element for semantic structure.
-
-## TypeScript
-
-This component is written in TypeScript and provides type definitions for all props and sub-components.
-
-## Contributing
-
-When contributing to this component, please follow the established code style and conventions. Ensure all changes are well-tested and documented.
-
-This README provides an overview of the Card component, its usage, available props, styling information, and accessibility considerations. It also mentions that the component is written in TypeScript and provides guidance for contributors.

package/src/components/dialog/hooks/useClickOutside.ts

@@ -1,33 +0,0 @@
-// hooks/useClickOutside.ts
-import { RefObject } from "react";
-
-/**
- * Hook that handles click outside detection for any HTML element
- * @param ref Reference to the element to detect clicks outside of
- * @param handler Function to call when a click outside is detected
- * @returns Click event handler function
- */
-const useClickOutside = (
-  ref: RefObject<HTMLElement>,
-  handler: () => void
-): ((e: React.MouseEvent<HTMLElement>) => void) => {
-  return (e: React.MouseEvent<HTMLElement>) => {
-    const dimensions = ref.current?.getBoundingClientRect();
-
-    if (!dimensions) {
-      return;
-    }
-
-    const isClickOutside =
-      e.clientY < dimensions.top ||
-      e.clientY > dimensions.bottom ||
-      e.clientX < dimensions.left ||
-      e.clientX > dimensions.right;
-
-    if (isClickOutside) {
-      handler();
-    }
-  };
-};
-
-export default useClickOutside;