@fpkit/acss 0.5.5 → 0.5.7

package/libs/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/buttons/button.tsx","../src/components/cards/card.tsx","../src/components/form/fields.tsx","../src/components/layout/landmarks.tsx","../src/components/images/img.tsx","../src/components/form/inputs.tsx","../src/components/fp.tsx","../src/components/link/link.tsx","../src/components/list/list.tsx","../src/components/modal/modal.tsx","../src/components/modal/dialog.tsx","../src/components/nav/nav.tsx","../src/components/popover/popover.tsx","../src/components/tables/table-elements.tsx","../src/components/tables/table.tsx","../src/components/tag/tag.tsx","../src/components/details/details.tsx","../src/components/text/text.tsx","../src/components/form/textarea.tsx","../src/components/heading/heading.tsx","../src/components/breadcrumbs/breadcrumb.tsx","../src/libs/content.ts","../src/components/text-to-speech/TextToSpeech.tsx","../src/components/text-to-speech/useTextToSpeech.tsx","../src/components/text-to-speech/views/TextToSpeechControls.tsx","../src/components/dialog/dialog.tsx","../src/components/dialog/view/dialog-header.tsx"],"names":["React","Button","type","children","styles","disabled","classes","onPointerDown","onPointerOver","onPointerLeave","onClick","props","handlePointerDown","e","ui_default","button_default","Title","className","as","Content","Footer","Card","elm","id","Field","label","labelFor","Landmarks","Header","headerBackground","Main","Aside","Section","Article","Img","src","alt","width","height","loading","placeholder","fetchpriority","decoding","imgLoaded","imgError","FP","defaultStyles","ref","Component","styleObj","fp_default","Input","name","value","isDisabled","readonly","required","onChange","onBlur","handleChange","handleBlur","handleKeyDown","Link","href","target","rel","prefetch","btnStyle","relValue","link_default","ListItem","List","variant","role","list_default","ModalDialog","modalRef","openOnMount","dialog_default","Modal","openChild","closeChild","modalHeader","modalFooter","showOpen","dialogRef","openModal","closeModal","NavList","isBlock","NavItem","Nav","Popover","popoverTrigger","hoverRef","popOverRef","isVisible","popoverPosition","handlePointerEvent","handlePointerLeave","use_popover_default","popoverStyles","Caption","Thead","Tbody","Tr","Td","Table","dataStyle","RenderHead","data","head","item","index","RenderBody","rec","RenderTable","tblBody","tblCaption","tblHead","Tag","Details","summary","icon","ariaLabel","open","onToggle","onPointerDownCallback","Text","text","Textarea","rows","cols","readOnly","textarea_default","Heading","ui","heading_default","Truncate","str","length","Items","Breadcrumb","startRoute","startRouteUrl","currentRoute","spacer","routes","ariaLabelPrefix","truncateLength","linkProps","currentPath","setCurrentPath","path","getPathName","pathSegment","route","segments","segment","lastSegment","uuid","currentSegment","url","useState","useEffect","useTextToSpeech","initialVoice","availableVoices","setAvailableVoices","currentVoice","setCurrentVoice","isSpeaking","setIsSpeaking","isPaused","setIsPaused","utterance","setUtterance","updateVoices","voices","googleVoice","voice","englishVoice","options","onEnd","TTSButtonComponent","TTSButton","TextToSpeechControls","onSpeak","onPause","onResume","onCancel","icon_default","TextToSpeechControls_default","TextToSpeech","initialText","showTextInput","pitch","rate","language","speak","pause","resume","cancel","getAvailableLanguages","setText","handleSpeak","handleEnd","DialogHeader","dialogTitle","onClose","dialog_header_default","Dialog","isOpen","onOpen","showDialogHeader","isAlertDialog","dialogOpen","setDialogOpen","handleCancelEvent","handleCloseEvent","closeDialog"],"mappings":"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","sourcesContent":["import UI from '../ui'\nimport React from 'react'\n\nexport type ButtonProps = Partial<React.ComponentProps<typeof UI>> & {\n    /**\n     * The button type\n     * Required - 'button' | 'submit' | 'reset'\n     */\n    type: 'button' | 'submit' | 'reset'\n  }\n\nexport const Button = ({\n  type = 'button',\n  children,\n  styles,\n  disabled,\n  classes,\n  onPointerDown,\n  onPointerOver,\n  onPointerLeave,\n  onClick,\n  ...props\n}: ButtonProps) => {\n  /**\n   * Handles the pointer down event on the button.\n   * Only triggers the onPointerDown callback if the button is not disabled.\n   * @param e The pointer event object from the button element\n   */\n  const handlePointerDown = (e: React.PointerEvent<HTMLButtonElement>) => {\n    if (!disabled) {\n      onPointerDown?.(e)\n    }\n  }\n\n  /**\n     * Handles the pointer over event on the button.\n     * Only triggers the onPointerOver callback if the button is not disabled.\n     * @param e The pointer event object from the button element\n     */\n  const handlePointerOver = (e: React.PointerEvent<HTMLButtonElement>) => {\n    if (!disabled) {\n      onPointerOver?.(e)\n    }\n  }\n\n  /**\n     * Handles the pointer leave event on the button.\n     * Only triggers the onPointerLeave callback if the button is not disabled.\n     * @param e The pointer event object from the button element\n     */\n  const handlePointerLeave = (e: React.PointerEvent<HTMLButtonElement>) => {\n    if (!disabled) {\n      onPointerLeave?.(e)\n    }\n  }\n\n  /**\n     * Handles the click event on the button.\n     * Only triggers the onClick callback if the button is not disabled.\n     * @param e The mouse event object from the button element\n     */\n  const handleOnClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n    if (!disabled) {\n       onClick?.(e)\n    }\n  }\n\n\n  /* Returning a button element. */\n  return (\n    <UI\n      as=\"button\"\n      type={type}\n      onPointerOver={handlePointerOver}\n      onPointerDown={handlePointerDown}\n      onPointerLeave={handlePointerLeave}\n      onKeyDown={handlePointerDown}\n      style={styles}\n      className={classes}\n      aria-disabled={disabled}\n      onClick={handleOnClick}\n      {...props}\n    >\n      {children}\n    </UI>\n  )\n  //\n}\n\nexport default Button\nButton.displayName = 'Button'\n","import React from 'react'\nimport UI from '#components/ui'\n\n/*\n * CardProps interface\n *\n * Extends ComponentProps. Defines props for the Card component.\n *\n * @property {('div' | 'aside' | 'section' | 'article')} [elm='div'] - HTML element to render as\n */\nexport type CardProps = {\n  elm?: 'div' | 'aside' | 'section' | 'article'\n  title?: React.ReactNode\n  footer?: React.ReactNode\n} & React.ComponentProps<typeof UI>\n\n/*\n * Title component\n *\n * Renders a title for the Card component using the UI component.\n *\n * @param {Object} props - Component props\n * @param {ReactNode} props.children - Title content\n * @param {string} [props.className] - Additional CSS classes\n * @param {Object} [props.styles] - Inline styles\n *\n * @returns {ReactElement} Title component\n */\nexport const Title = ({\n  children,\n  className,\n  styles,\n  as = 'h3',\n  ...props\n}: React.PropsWithChildren<{\n  className?: string\n  styles?: React.CSSProperties\n  as?: React.ElementType\n}>) => {\n  return (\n    <UI\n      as={as}\n      className={`card-title ${className || ''}`}\n      styles={styles}\n      {...props}\n    >\n      {children}\n    </UI>\n  )\n}\n\nTitle.displayName = 'Title'\n\n/*\n * CardContent component\n *\n * Renders the content of the Card component using the UI component with an article element.\n *\n * @param {Object} props - Component props\n * @param {ReactNode} props.children - Content\n * @param {string} [props.className] - Additional CSS classes\n * @param {Object} [props.styles] - Inline styles\n *\n * @returns {ReactElement} CardContent component\n */\nexport const Content = ({\n  children,\n  className,\n  styles,\n  ...props\n}: React.PropsWithChildren<{\n  className?: string\n  styles?: React.CSSProperties\n}>) => {\n  return (\n    <UI\n      as=\"article\"\n      className={`card-content ${className || ''}`}\n      styles={styles}\n      {...props}\n    >\n      {children}\n    </UI>\n  )\n}\n\nContent.displayName = 'Content'\n\n/*\n * Footer component\n *\n * Renders a footer section for the Card component using the UI component.\n *\n * @param {Object} props - Component props\n * @param {ReactNode} props.children - Footer content\n * @param {string} [props.className] - Additional CSS classes\n * @param {Object} [props.styles] - Inline styles\n *\n * @returns {ReactElement} Footer component\n */\nexport const Footer = ({\n  children,\n  className,\n  styles,\n  ...props\n}: React.PropsWithChildren<{\n  className?: string\n  styles?: React.CSSProperties\n}>) => {\n  return (\n    <UI\n      as=\"div\"\n      className={`card-footer ${className || ''}`}\n      styles={styles}\n      {...props}\n    >\n      {children}\n    </UI>\n  )\n}\n\nFooter.displayName = 'Footer'\n\n/*\n * Card component\n *\n * Renders a card container.\n *\n * @param {CardProps} props - Component props\n * @param {('div' | 'aside' | 'section' | 'article')} [props.elm='div'] - Element to render as\n * @param {Object} [props.styles] - CSS styles to apply\n * @param {ReactNode} props.children - Card content\n * @param {boolean} [props.renderStyles=true] - Whether to render default styles\n * @param {string} [props.dataStyle] - data-card attribute value\n * @param {string} [props.id] - Unique ID\n * @returns {ReactElement} Card component\n */\nexport const Card = ({\n  elm = 'div',\n  styles,\n  children,\n  classes = 'shadow',\n  id,\n  ...props\n}: CardProps) => {\n  return (\n    <UI\n      as={elm}\n      id={id}\n      styles={styles}\n      className={classes}\n      data-card\n      {...props}\n    >\n      {children}\n    </UI>\n  )\n}\n\nexport default Card\nCard.displayName = 'Card'\nCard.Title = Title\nCard.Content = Content\nCard.Footer = Footer\n","import React from 'react'\nimport UI from '../ui'\n\nexport type FieldProps = {\n  /**\n   * The label content\n   */\n  label: React.ReactNode\n  children: React.ReactNode\n} & React.ComponentProps<'label'> &\n  Partial<React.ComponentProps<typeof UI>>\n/**\n * Field component that renders a label and children wrapped in a div element.\n * @param labelFor Defines the for attribute of the label element\n * @param styles Custom styles to be applied to the component\n * @param label The label content\n * @param children The children to be rendered inside the component\n * @param props Additional props to be spread to the component\n */\nexport const Field = ({\n  label,\n  labelFor,\n  id,\n  styles,\n  classes,\n  children,\n  ...props\n}: FieldProps) => {\n  return (\n    <UI\n      as=\"div\"\n      id={id}\n      styles={styles}\n      className={classes}\n      data-style=\"fields\"\n      {...props}\n    >\n      <label htmlFor={labelFor}>{label}</label>\n      {children}\n    </UI>\n  )\n}\n\nexport default Field\nField.displayName = 'Field'\n","import UI from '../ui'\nimport React, { ReactNode } from 'react'\n\ntype ComponentProps = React.ComponentProps<typeof UI>\n\n/**\n * Renders children elements without any wrapping component.\n * Can be used as a placeholder when no semantic landmark is needed.\n */\nexport const Landmarks = (children?: React.FC) => <>{children}</>\n\ntype HeaderProps = {\n  headerBackground?: ReactNode\n} & ComponentProps\n/**\n * Header component.\n *\n * Renders a header landmark with a section child.\n *\n * @param children - The content to render inside the header.\n * @param styles - Optional styles object.\n * @param props - Other props.\n */\nexport const Header = ({\n  id,\n  children,\n  headerBackground,\n  styles,\n  classes,\n  ...props\n}: HeaderProps) => {\n  return (\n    <UI as=\"header\" id={id} styles={styles} className={classes} {...props}>\n      {headerBackground}\n      <UI as=\"section\">{children}</UI>\n    </UI>\n  )\n}\n\n/**\n * Main component.\n *\n * Renders a main landmark.\n *\n * @param children - The content to render inside the main element.\n * @param styles - Optional styles object.\n * @param props - Other props.\n */\nexport const Main = ({\n  id,\n  children,\n  styles,\n  classes,\n  ...props\n}: ComponentProps) => {\n  return (\n    <UI as=\"main\" id={id} styles={styles} {...props} className={classes}>\n      {children}\n    </UI>\n  )\n}\n\n/**\n * Footer component that renders a footer element with a section element inside.\n * @param {ReactNode} children - Child elements to render inside the section element.\n * @param styles - CSS styles to apply to the footer element.\n * @param props - Additional props to pass to the footer element.\n * @returns A React component that renders a footer element with a section element inside.\n */\nexport const Footer = ({\n  id,\n  classes,\n  children,\n  styles = {},\n  ...props\n}: ComponentProps) => {\n  return (\n    <UI as=\"footer\" id={id} className={classes} styles={styles} {...props}>\n      <UI as=\"section\">{children || 'Copyright © 2022'}</UI>\n    </UI>\n  )\n}\n\nexport const Aside = ({\n  id,\n  children,\n  styles = {},\n  classes,\n  ...props\n}: ComponentProps) => {\n  return (\n    <UI as=\"aside\" id={id} styles={styles} className={classes} {...props}>\n      <UI as=\"section\">{children}</UI>\n    </UI>\n  )\n}\n\n/**\n * Section component that renders a section element.\n *\n * @param children - Child elements to render inside the section.\n * @param styles - CSS styles to apply to the section.\n * @param props - Other props.\n */\nexport const Section = ({\n  id,\n  children,\n  styles,\n  classes,\n  ...props\n}: ComponentProps) => {\n  return (\n    <UI as=\"section\" id={id} styles={styles} className={classes} {...props}>\n      {children}\n    </UI>\n  )\n}\n\n/**\n * Article component renders an HTML <article> element.\n *\n * @param children - Child elements to render inside the article.\n * @param styles - CSS styles to apply to the article.\n * @param props - Additional props to pass to the article element.\n */\nexport const Article = ({\n  id,\n  children,\n\n  styles,\n  classes,\n  ...props\n}: ComponentProps) => {\n  return (\n    <UI as=\"article\" id={id} styles={styles} className={classes} {...props}>\n      {children}\n    </UI>\n  )\n}\n\nexport default Landmarks\n\nLandmarks.displayName = 'Landmarks'\nLandmarks.Header = Header\nLandmarks.Main = Main\nLandmarks.Footer = Footer\nLandmarks.Aside = Aside\nLandmarks.Section = Section\nLandmarks.Article = Article\n","import UI from '../ui'\nimport React from 'react'\n/*\n * ImageProps interface\n *\n * Extends ComponentProps and defines additional props for the Img component.\n *\n * @property {string} [src] - The image source URL\n * @property {string} alt - Required alt text for image accessibility\n * @property {number} width - Required width of image\n * @property {number} [height] - Optional height of image\n * @property {\"eager\" | \"lazy\"} [loading=\"lazy\"] - Loading behavior\n * @property {string} [placeholder] - Fallback placeholder image\n * @property {\"high\" | \"low\"} [fetchpriority=\"low\"] - Image fetch priority\n * @property {\"sync\" | \"async\" | \"auto\"} [decoding=\"auto\"] - Decode setting\n * @property {function} [imgError] - Error callback\n * @property {function} [imgLoaded] - Loaded callback\n */\nexport type ImageProps = React.ComponentProps<'img'> &\n  React.ComponentProps<typeof UI>\n\n/*\n * Img component\n *\n * Renders an <img> element with custom props.\n *\n * @param {string} src - The image source URL.\n * @param {string} alt - The alt text for the image.\n * @param {number} [width=480] - The width of the image.\n * @param {number} [height] - The height of the image.\n * @param {Object} [styles] - Additional CSS styles to apply.\n * @param {boolean} [renderStyles=true] - Whether to render the default styles.\n * @param {\"eager\" | \"lazy\"} [loading=\"lazy\"] - The loading attribute.\n * @param {string} [placeholder] - A placeholder image URL.\n * @param {\"high\" | \"low\"} [fetchpriority=\"low\"] - The fetchpriority attribute.\n * @param {\"sync\" | \"async\" | \"auto\"} [decoding=\"auto\"] - The decoding attribute.\n * @param {function} [imgLoaded] - Callback when image loads successfully.\n * @param {function} [imgError] - Callback when image errors.\n *\n * @returns {JSX.Element} The Img component.\n */\nexport const Img = ({\n  src = '//',\n  alt,\n  width = 480,\n  height,\n  styles,\n  loading = 'lazy',\n  placeholder = `https://via.placeholder.com/${width}?text=PLACEHOLDER`,\n  fetchpriority = 'low',\n  decoding = 'auto',\n  imgLoaded,\n  imgError,\n  ...props\n}: ImageProps) => {\n  const handleImgError = (\n    e: React.SyntheticEvent<HTMLImageElement, Event>,\n  ): void => {\n    if (imgError) {\n      imgError?.(e)\n      return\n    }\n    if (e.currentTarget.src !== placeholder) {\n      e.currentTarget.src = placeholder\n    }\n  }\n\n  const handleImgLoad = (\n    e: React.SyntheticEvent<HTMLImageElement, Event>,\n  ): void => {\n    imgLoaded?.(e)\n  }\n\n  return (\n    <UI\n      as=\"img\"\n      src={src}\n      alt={alt}\n      width={width}\n      height={height || 'auto'}\n      loading={loading}\n      style={styles}\n      onError={handleImgError}\n      onLoad={handleImgLoad}\n      fetchPriority={fetchpriority}\n      decoding={decoding}\n      {...props}\n    />\n  )\n}\n\nexport default Img\nImg.displayName = 'Img'\n","import React from 'react'\nimport FP from '../fp'\n\nexport type InputProps = {\n  /**\n   * The type of the input.\n   */\n  type?: 'text' | 'password' | 'email' | 'number' | 'tel' | 'url' | 'search'\n\n  /**\n   * Set the element as disabled\n   */\n  isDisabled?: boolean\n} & React.ComponentProps<typeof FP>\n\n/**\n * Input component that renders an HTML input element.\n * @param {InputProps} props - The input component props.\n * @returns {JSX.Element} - The input component.\n */\nexport const Input = ({\n  type = 'text',\n  name,\n  value,\n  placeholder,\n  id,\n  styles,\n  classes,\n  isDisabled,\n  disabled,\n  readonly,\n  required,\n  ref,\n  onChange,\n  onBlur,\n  onPointerDown,\n  ...props\n}: InputProps): JSX.Element => {\n  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    if (onChange && !disabled) {\n      onChange?.(e)\n    }\n  }\n\n  const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    if (onBlur && !disabled) {\n      onBlur?.(e)\n    }\n  }\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    if (onPointerDown && !disabled) {\n      e.preventDefault()\n      onPointerDown?.(e)\n    }\n  }\n\n  return (\n    <FP\n      as=\"input\"\n      id={id}\n      type={type}\n      placeholder={placeholder || `${required ? '*' : ''} ${type} input `}\n      className={classes}\n      styles={styles}\n      onChange={handleChange}\n      onBlur={handleBlur}\n      onKeyDown={handleKeyDown}\n      value={value}\n      name={name}\n      ref={ref}\n      aria-disabled={isDisabled}\n      tabIndex={isDisabled ? -1 : undefined}\n      aria-readonly={readonly}\n      aria-required={required}\n      required={required}\n      readOnly={readonly}\n      {...props}\n    />\n  )\n}\n\nInput.displayName = 'Input'\nexport default Input\n","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","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","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","import React from \"react\";\nimport { ComponentProps } from \"../../types\";\nimport { Button } from \"../buttons/button\";\nimport { ModalDialog } from \"./dialog\";\n\nexport interface ModalProps extends ComponentProps {\n  /**\n   * The child component/content for open button\n   */\n  openChild?: React.ReactNode;\n  /**\n   * The child component/content for close button\n   */\n  closeChild?: React.ReactNode;\n  /**\n   * The child component/content for modal header\n   */\n  modalHeader?: React.ReactNode;\n  /**\n   * The child component/content for modal footer\n   */\n  modalFooter?: React.ReactNode;\n  /**\n   * The child component/content for modal body\n   */\n  children: React.ReactNode;\n  /**\n   * Open modal on mount when set to true\n   */\n  showOpen?: boolean;\n}\nexport const Modal = ({\n  openChild,\n  closeChild,\n  modalHeader,\n  modalFooter,\n  children,\n  showOpen = false,\n  ...props\n}: ModalProps) => {\n  const dialogRef = React.useRef<HTMLDialogElement>(null);\n  const openModal = (): void => {\n    if (dialogRef.current) {\n      if (showOpen) dialogRef.current.show();\n      else dialogRef.current.showModal();\n    }\n  };\n  const closeModal = () => {\n    if (dialogRef.current) {\n      dialogRef.current.close();\n    }\n  };\n\n  return (\n    <>\n      <ModalDialog modalRef={dialogRef} openOnMount={showOpen} {...props}>\n        <section>\n          {modalHeader}\n          {children}\n          {modalFooter ?? (\n            <div>\n              <Button\n                type=\"button\"\n                pointerDown={() => {\n                  closeModal();\n                }}\n              >\n                {closeChild || \"Close\"}\n              </Button>{\" \"}\n            </div>\n          )}\n        </section>\n      </ModalDialog>\n      {!showOpen && (\n        <Button type=\"button\" pointerDown={openModal}>\n          {openChild || \"Open Modal\"}\n        </Button>\n      )}\n    </>\n  );\n};\n\nModal.displayName = \"Modal\";\n","import UI from \"../ui\";\nimport React from \"react\";\n\nexport type DialogProps = {\n  /**\n   * React ref for dialog element\n   */\n  modalRef: React.RefObject<HTMLDialogElement>;\n  /**\n   * Handle close modal event\n   */\n  closeModal?: (e: React.SyntheticEvent<HTMLDialogElement>) => void;\n  /**\n   * open modal on mount\n   */\n  openOnMount?: boolean;\n} & React.ComponentProps<typeof UI>;\n/**\n * Dialog component\n */\nexport const ModalDialog = ({\n  id,\n  children,\n  classes,\n  modalRef,\n  openOnMount,\n  ...props\n}: DialogProps) => {\n  const handleCloseModal = (e: React.SyntheticEvent<HTMLDialogElement>) => {\n    if (e.currentTarget === e.target) {\n      e.currentTarget.close();\n    }\n  };\n\n  return (\n    <UI\n      as=\"dialog\"\n      id={id}\n      classes={classes}\n      ref={modalRef}\n      open={openOnMount}\n      onClick={handleCloseModal}\n      {...props}\n    >\n      {children}\n    </UI>\n  );\n};\n\nexport default React.memo(ModalDialog);\nModalDialog.displayName = \"Dialog\";\n","import UI from '../ui'\nimport List from '../list/list'\nimport React from 'react'\n\nexport type NavListProps = React.ComponentProps<typeof List> & {\n  isBlock?: boolean\n}\nexport type NavItemProps = React.ComponentProps<typeof List.ListItem>\n\nexport type NavProps = React.ComponentProps<typeof UI>\n\n/**\n * Renders a NavList component.\n * @param {Object} props - The props for the component.\n * @param {ReactNode} props.children - The child elements.\n * @param {Object} props - Additional props to spread to the List component.\n * @returns {JSX.Element} The rendered NavList component.\n */\nexport const NavList = ({ isBlock, children, ...props }: NavListProps) => {\n  return (\n    <List type=\"ul\" {...props} data-list={`unstyled ${isBlock ? 'block' : ''}`}>\n      {children}\n    </List>\n  )\n}\n\n/**\n * Renders a NavItem component.\n * @param {Object} props - The props for the component.\n * @param {string} [props.id] - The id for the component.\n * @param {Object} [props.styles] - The styles for the component.\n * @param {string} [props.classes] - The classes for the component.\n * @param {ReactNode} props.children - The child elements.\n * @param {boolean} [props.inline=true] - Whether the item should display inline.\n * @param {Object} props - Additional props to spread to the ListItem component.\n * @returns {JSX.Element} The rendered NavItem component.\n */\nexport const NavItem = ({\n  id,\n  styles,\n  classes,\n  children,\n  ...props\n}: NavItemProps) => {\n  return (\n    <List.ListItem\n      type=\"li\"\n      id={id}\n      classes={classes}\n      styles={styles}\n      {...props}\n    >\n      {children}\n    </List.ListItem>\n  )\n}\n\n/**\n * Renders a Nav component.\n * @param {Object} props - The props for the component.\n * @param {ReactNode} props.children - The child elements.\n * @param {Object} props - Additional props to spread to the UI component.\n * @returns {JSX.Element} The rendered Nav component.\n */\nexport const Nav = ({ children, ...props }: NavProps) => {\n  return (\n    <UI as=\"nav\" {...props}>\n      {children}\n    </UI>\n  )\n}\n\nexport default Nav\nNav.displayName = 'Nav'\nNav.List = NavList\nNav.Item = NavItem\n","import React from 'react'\nimport usePopover from '#hooks/popover/use-popover'\n\n/**\n * Interface for props accepted by the Popover component\n *\n * @property {ReactNode} children - The content to show in the popover\n * @property {ReactNode} [content] - Optional alternative content for popover\n */\nexport type PopoverProps = {\n  children: React.ReactNode\n  popoverTrigger: React.ReactNode\n  styles?: {}\n}\n\nexport const defaultStyles = {\n  display: 'block',\n  position: 'absolute',\n  background: '#000',\n  border: '1px solid #010101',\n  padding: '10px',\n  color: '#fff',\n  transition: 'opacity .5s ease-in-out',\n} as React.CSSProperties\n\n/**\n * Popover component to display popover content.\n *\n * @param props - The props for the component\n * @param props.children - The content to show in the popover\n * @param props.popoverTrigger - The element that triggers the popover on hover\n *\n * @returns JSX.Element - The rendered JSX element for the Popover\n * @example - <Popover popoverTrigger={<button>Hover here</button>}>Popover content</Popover>\n *\n * The component uses the usePopover hook to handle popover visibility and positioning.\n *\n * It renders the triggerElement, and conditionally renders the popover content\n * positioned absolutely when visible.\n *\n * Inline styles handle visuals like background, border, padding, etc.\n *\n * Transforms and opacity animate the enter/exit transition of the popover.\n */\n\nexport const Popover = ({\n  children,\n  popoverTrigger,\n  styles,\n  ...props\n}: PopoverProps): JSX.Element => {\n  const hoverRef = React.useRef(null)\n  const popOverRef = React.useRef(null)\n  const { isVisible, popoverPosition, handlePointerEvent, handlePointerLeave } =\n    usePopover(hoverRef, popOverRef)\n  const popoverStyles = {\n    opacity: isVisible ? 1 : 0,\n    top: popoverPosition.top,\n    left: popoverPosition.left,\n    // transform: `translateY(${isVisible ? '0px' : '-50px'})`,\n    zIndex: 999,\n  } as React.CSSProperties\n\n  return (\n    <>\n      <div\n        ref={hoverRef}\n        onPointerEnter={handlePointerEvent}\n        onPointerLeave={handlePointerLeave}\n        {...props}\n      >\n        {popoverTrigger}\n      </div>\n      {isVisible && (\n        <div ref={popOverRef} style={{ ...popoverStyles, ...styles }}>\n          {children}\n        </div>\n      )}\n    </>\n  )\n}\n\nexport default Popover\nPopover.displayName = 'Popover'\nPopover.styles = defaultStyles\n","import FP from '../fp'\nimport { ComponentProps } from '../../types'\nimport React from 'react'\n\n\nexport const Caption = ({ children, ...props }: ComponentProps) => {\n  return (\n    <FP as=\"caption\" {...props}>\n      {children}\n    </FP>\n  )\n}\n\nexport const Thead = ({ children, ...props }: ComponentProps) => (\n  <FP as=\"thead\" {...props}>\n    {children}\n  </FP>\n)\n\nexport const Tbody = ({ children, ...props }: ComponentProps) => (\n  <FP as=\"tbody\" {...props}>\n    {children}\n  </FP>\n)\n\nexport const Tr = ({ children, ...props }: ComponentProps) => (\n  <FP as=\"tr\" {...props}>\n    {children}\n  </FP>\n)\n\nexport const Td = ({ children, ...props }: ComponentProps) => (\n  <FP as=\"td\" {...props}>\n    {children}\n  </FP>\n)\n\nexport const Table = ({ id, dataStyle, children, ...props }: ComponentProps) => {\n  return (\n    <FP\n      as=\"section\"\n      id={id}\n      {...props}\n      data-style=\"table-wrapper\"\n    >\n      <table>{children}</table>\n    </FP>\n  )\n}\n\nTable.displayName = 'Table'\nCaption.displayName = 'Caption'\nThead.displayName = 'Thead'\nTbody.displayName = 'Tbody'\nTr.displayName = 'Tr'\nTd.displayName = 'Td'\n\n","import { Table, Caption, Thead, Tbody, Td, Tr } from './table-elements'\nimport { ComponentProps } from '../../types'\n\nimport React from 'react'\n\nexport interface TableProps extends ComponentProps {\n  tblHead: React.ReactNode\n  tblBody: React.ReactNode\n  tblCaption?: React.ReactNode\n}\n\nexport type dataType = { id: number; items: string[] }[]\n\n/**\n * Render the `thead` by passing an array of names\n */\nexport const RenderHead = (data: []) => {\n  const head = data.map((item, index) => {\n    return <th key={index}>{item}</th>\n  })\n  return <tr>{head}</tr>\n}\n\n/**\n * Render the table body `tr`, `td` with the data provided\n */\nexport const RenderBody = (data: {}[]) => {\n  const rec = data.map((item, index) => {\n    return (\n      <tr key={index}>\n        {/* <td>{item?.id}</td>\n        <td>{item?.items}</td> */}\n      </tr>\n    )\n  })\n  return <Tbody>{rec}</Tbody>\n}\n\n/**\n * Render the table placing `caption`, `thead` and `tbody` in the correct order\n * caption is optional\n */\nexport const RenderTable = ({ tblBody, tblCaption, tblHead }: TableProps) => {\n  return (\n    <Table>\n      {tblCaption && <Caption>{tblCaption}</Caption>}\n      <Thead>\n        <Tr>{tblHead}</Tr>\n      </Thead>\n      <Tbody>{tblBody}</Tbody>\n    </Table>\n  )\n}\n\nRenderTable.displayName = 'TBL'\nRenderBody.displayName = 'renderBody'\nRenderHead.displayName = 'renderHead'\n","import React from 'react'\nimport UI from '#components/ui'\n\nexport type TagProps = {\n  /** HTML element to display the badge as span or p */\n  elm?: 'span' | 'p'\n  /**  Aria role for the component - conditional */\n  role: 'note' | 'status'\n} & React.ComponentProps<typeof UI>\n\nexport const Tag = ({\n  elm = 'span',\n  role = 'note',\n  children,\n  styles,\n  ...props\n}: TagProps) => {\n  return (\n    <UI as={elm} role={role} styles={styles} {...props}>\n      {children}\n    </UI>\n  )\n}\nexport default Tag\nTag.displayName = 'Tag'\n","import UI from \"#components/ui\";\nimport React from \"react\";\n\ntype DetailsProps = {\n  /**\n   * The summary text shown for the details.\n   * Required.\n   */\n  summary: React.ReactNode;\n\n  /**\n   * The aria-label  element for accessibility.\n   */\n  ariaLabel: string;\n} & React.ComponentProps<\"details\"> &\n  Partial<React.ComponentProps<typeof UI>>;\n\n/**3\n * Details component props interface.\n *\n * @param {React.CSSProperties} [styles] - CSS styles object.\n * @param {string} [classes] - Classnames string.\n * @param {boolean} [open] - Whether the details is open.\n * @param {(e: React.PointerEvent<HTMLDetailsElement>) => void} [onToggle] - onToggle callback.\n * @param {(e: React.PointerEvent<HTMLDetailsElement>) => void} [onPointerDown] - onPointerDown callback.\n * @param {ReactNode} children - The content inside the details.\n * @param {string} [ariaLabel] - aria-label for accessibility.\n * @param {React.Ref<any>} [ref] - Ref object.\n * @param {Object} props - Other props.\n */\nexport const Details = ({\n  summary,\n  icon,\n  styles,\n  classes,\n  ariaLabel,\n  name,\n  open,\n  onPointerDown,\n  onToggle,\n  children,\n  ref,\n  ...props\n}: DetailsProps) => {\n  const defaultStyles: React.CSSProperties = { ...styles };\n\n  const onPointerDownCallback = (e: React.PointerEvent<HTMLDetailsElement>) => {\n    if (onPointerDown) onPointerDown?.(e);\n    if (onPointerDown) onPointerDown?.(e);\n  };\n\n  const onToggleCallback = (e: React.PointerEvent<HTMLDetailsElement>) => {\n    if (onToggle) onPointerDown?.(e);\n  };\n  return (\n    <UI\n      as=\"details\"\n      style={defaultStyles}\n      className={classes}\n      onToggle={onToggleCallback}\n      ref={ref}\n      open={open}\n      aria-label={ariaLabel || \"Details dropdown\"}\n      // aria-roledescription=\"detail accordion\"\n      name={name}\n      {...props}\n    >\n      <UI as=\"summary\" onPointerDown={onPointerDownCallback}>\n        {icon}\n        {summary}\n      </UI>\n      <UI as=\"section\">{children}</UI>\n    </UI>\n  );\n};\n\nexport default Details;\nDetails.displayName = \"Details\";\n","// import FP from '../fp'\nimport React from 'react'\nimport UI from '#components/ui'\n\ntype InheritedProps = React.ComponentProps<typeof UI>\n\ntype TextElements =\n  | 'a'\n  | 'b'\n  | 'blockquote'\n  | 'b'\n  | 'blockquote'\n  | 'cite'\n  | 'code'\n  | 'em'\n  | 'i'\n  | 'em'\n  | 'i'\n  | 'kbd'\n  | 'mark'\n  | 'p'\n  | 's'\n  | 'small'\n  | 'span'\n  | 'span'\n  | 'strong'\n  | 'mark'\n  | 'p'\n  | 's'\n  | 'small'\n  | 'span'\n  | 'span'\n  | 'strong'\n  | 'sub'\n  | 'sup'\n  | 'time'\n  | 'time'\n  | 'u'\n\nexport type TextProps = {\n  /**\n   * Text element to to use\n   * Text element to to use\n   */\n  elm?: TextElements\n  /** Pass a text element or string */\n  text?: string\n} & InheritedProps\n\nexport const Text = ({\n  elm = 'p',\n  id,\n  text,\n  styles,\n  classes,\n  children,\n  ...props\n}: TextProps) => {\n  return (\n    <UI as={elm} id={id} styles={styles} className={classes} {...props}>\n      <UI as={elm} id={id} styles={styles} className={classes} {...props}>\n        {children || text}\n      </UI>\n    </UI>\n  )\n}\n\ntype TitleProps = {\n  /**\n   * HTML headings\n   */\n  elm?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'\n} & InheritedProps\n\nexport const Title = ({\n  elm = 'h3',\n  id,\n  children,\n  styles,\n  classes,\n  ...props\n}: TitleProps) => {\n  return (\n    <Text as={elm} id={id} styles={styles} className={classes} {...props}>\n      {children}\n    </Text>\n  )\n}\n\nexport default Text\n\nText.displayName = 'Text'\nTitle.displayName = 'Title'\n","import React from 'react'\nimport UI from '../ui'\n\nexport type TextareaProps = React.ComponentProps<'textarea'> &\n  React.ComponentProps<typeof UI>\n\n/**\n * Textarea component.\n *\n * @param value - The value of the textarea.\n * @param rows - The number of rows.\n * @param cols - The number of columns.\n * @param id - The id of the textarea.\n * @param name - The name of the textarea.\n * @param required - Whether the textarea is required.\n * @param disabled - Whether the textarea is disabled.\n * @param readOnly - Whether the textarea is read only.\n * @param onBlur - Blur event handler.\n * @param onPointerDown - Pointer down event handler.\n * @param onChange - Change event handler.\n * @param ref - Ref for the textarea.\n * @param styles - Styles object for the textarea.\n * @param textareaRef - Ref specifically for the textarea element.\n * @param props - Other props.\n */\nexport const Textarea = ({\n  id,\n  classes,\n  value,\n  rows = 5,\n  cols = 25,\n  name,\n  required,\n  disabled,\n  readOnly,\n  onBlur,\n  onPointerDown,\n  onChange,\n  ref,\n  styles,\n  placeholder,\n  ...props\n}: TextareaProps) => {\n  const handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n    if (onChange && !disabled) {\n      onChange?.(e)\n    }\n  }\n\n  const handleBlur = (e: React.FocusEvent<HTMLTextAreaElement>) => {\n    if (onBlur && !disabled) {\n      onBlur?.(e)\n    }\n  }\n\n  const handlePointerDown = (e: React.PointerEvent<HTMLTextAreaElement>) => {\n    if (onPointerDown && !disabled) {\n      onPointerDown?.(e)\n    }\n  }\n\n  return (\n    <UI\n      as=\"textarea\"\n      id={id}\n      name={name}\n      rows={rows}\n      cols={cols}\n      styles={styles}\n      className={classes}\n      data-style=\"textarea\"\n      required={required}\n      value={value}\n      aria-disabled={disabled}\n      readOnly={readOnly}\n      onChange={handleChange}\n      onBlur={handleBlur}\n      onPointerDown={handlePointerDown}\n      ref={ref}\n      placeholder={placeholder || `${required ? '*' : ''} Message`}\n      {...props}\n    />\n  )\n}\n\nexport default Textarea\nTextarea.displayName = 'Textarea'\n","import React from 'react'\nimport UI from '#components/ui'\nimport { type } from 'os'\n\nexport type TitleProps = {\n  children: React.ReactNode\n  type: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'\n  ui?: string\n} & React.ComponentProps<typeof UI>\n\nconst Heading = ({\n  type = 'h3',\n  id,\n  styles,\n  ui,\n  children,\n  ...props\n}: TitleProps) => {\n  return (\n    <UI as={type} id={id} styles={styles} data-ui={ui} {...props}>\n      {children}\n    </UI>\n  )\n}\n\nexport default Heading\nHeading.displayName = 'Heading'\n","// Code: Breadcrumb component\nimport React from 'react'\nimport UI from '#components/ui'\nimport { Truncate } from '#libs/content'\nimport Link from '#components/link/link'\n\n// TYPES\n\ntype customRoute = {\n  /** The path or id for routing */\n  path?: string\n  /** The display name */\n  name: string\n  /** The url if linking out */\n  url?: string\n}\n\ntype BreadcrumbProps = {\n  /** Array of custom route objects */\n  routes?: customRoute[]\n  /** Starting route node */\n  startRoute?: React.ReactNode\n  /* Starting route url */\n  startRouteUrl?: string\n  /** Spacer node between routes */\n  spacer?: React.ReactNode\n  /** String representing current route */\n  currentRoute?: string\n  /** Prefix breadcrumb aria-label - \"prefix breadcrumb\" */\n  ariaLabelPrefix?: string\n  /** Truncate breadcrumb text after this length */\n  truncateLength?: number\n  /** Link props for breadcrumb links */\n  linkProps?: React.ComponentProps<typeof Link>\n} & React.ComponentProps<typeof UI>\n\n// Components\n\n/**\n * Items component.\n *\n * @param styles - Styles object for the item.\n * @param id - Id for the item.\n * @param classes - Class names for the item.\n * @param children - Child components.\n * @param props - Other props.\n */\nconst Items = ({\n  styles,\n  id,\n  classes,\n  children,\n  ...props\n}: React.ComponentProps<typeof UI>) => {\n  return (\n    <li data-list=\"unstyled inline\" {...props}>\n      {children}\n    </li>\n  )\n}\n\n/**\n * List component.\n *\n * @param children - The content to render inside the list.\n * @param props - Additional props to pass to the UI component.\n */\nconst List = ({ children, ...props }: React.ComponentProps<typeof UI>) => {\n  return (\n    <UI as=\"ol\" data-list=\"unstyled inline\" {...props}>\n      {children}\n    </UI>\n  )\n}\n\n/**\n * Nav component.\n *\n * @param styles - Styles object for the nav.\n * @param id - Id for the nav.\n * @param classes - Class names for the nav.\n * @param children - Child components.\n * @param props - Other props.\n */\nconst Nav = ({\n  styles,\n  id,\n  classes,\n  children,\n  ...props\n}: React.ComponentProps<typeof UI>) => {\n  return (\n    <UI as=\"nav\" id={id} styles={styles} className={classes} {...props}>\n      <List>{children}</List>\n    </UI>\n  )\n}\n\n/**\n * Navigation component for breadcrumbs.\n *\n * @param props - Props for the navigation component.\n * @param props.startRoute - Starting route node. Default 'Home'.\n * @param props.currentRoute - String representing current route.\n * @param props.spacer - Spacer node between routes. Default '&#47;'.\n * @param props.routes - Array of custom route objects.\n * @param props.styles - Styles object for the nav.\n * @param props.id - Id for the nav.\n * @param props.classes - Class names for the nav.\n * @param props.children - Child components.\n */\nexport const Breadcrumb = ({\n  startRoute = 'Home',\n  startRouteUrl = \"/\",\n  currentRoute,\n  spacer = <>&#47;</>,\n  routes,\n  styles,\n  id,\n  classes,\n  ariaLabelPrefix,\n  truncateLength = 15,\n  linkProps,\n  ...props\n}: BreadcrumbProps): React.JSX.Element => {\n  const [currentPath, setCurrentPath] = React.useState('')\n  React.useEffect(() => {\n    const path = currentRoute || window.location.pathname\n    if (path.length) {\n      setCurrentPath(path)\n    }\n  }, [currentRoute])\n\n  /**\n   * Gets the path name for the given path segment.\n   *\n   * @param pathSegment - The path segment (string or number) to get the path name for.\n   * @returns The path name object for the given path segment.\n   */\n  const getPathName = (pathSegment: string): customRoute => {\n    const route = routes?.find((route) => route.path === pathSegment)\n\n    return {\n      path: route?.path || pathSegment,\n      name: route?.name || pathSegment,\n      url: route?.url || pathSegment,\n    }\n  }\n\n  /** Array of path segments from current path */\n  const segments = currentPath.split('/').filter((segment) => segment)\n  /** Index of last item in segments array */\n  const lastSegment = segments.length - 1\n\n  /** Unique id for breadcrumb */\n  const uuid = React.useId()\n\n\n  return currentPath.length ? (\n    <Nav\n      id={id}\n      {...props}\n      styles={styles}\n      className={classes}\n      aria-label={ariaLabelPrefix}\n    >\n      <Items key={`${startRoute}-${uuid}`}>\n        <Link href={startRouteUrl} {...linkProps}>{startRoute}</Link>\n      </Items>\n      <>\n      {segments.length ? (\n        segments.map((segment: any, index: number) => {\n          const currentSegment = getPathName(segment)\n          const { name, url, path } = currentSegment\n          return index === lastSegment ? (\n            <>\n              {typeof segments[lastSegment] === 'string' &&\n                segments[lastSegment].length > 3 &&\n                segments[lastSegment] !== segments[lastSegment - 1] && (\n                  <Items  key={`${path || index}-${uuid}`}>\n                     \n                      <span aria-hidden=\"true\">{spacer}</span>\n                      <a\n                      href=\"#\"\n                        aria-current=\"page\"\n                        aria-label={\n                          name.length > truncateLength ? name : undefined\n                        }\n                      >\n                        {Truncate(decodeURIComponent(name), truncateLength)}\n                      </a>\n                     \n                  </Items>\n                )}\n            </>\n          ) : (\n            <Items key={`${currentSegment?.name}-${uuid}`}>\n              <span aria-hidden=\"true\">{spacer}</span>\n              <span>\n                <Link\n                  href={url}\n                  aria-label={name.length > truncateLength ? name : undefined}\n                 {...linkProps}\n                >\n                  {Truncate(decodeURIComponent(name), truncateLength)}\n                </Link>\n              </span>\n            </Items>\n          );\n        })\n      ) : (\n        null\n      )}\n      </>\n    </Nav>\n  ) : (\n    <></>\n  )\n}\n\nexport default Breadcrumb\n\nBreadcrumb.displayName = 'BreadCrumb'\nBreadcrumb.Nav = Nav\nBreadcrumb.List = List\nBreadcrumb.Items = Items\n","/**\n * Converts a string to a slug by:\n * - Converting to lowercase\n * - Trimming whitespace\n * - Removing non-word and non-hyphen characters\n * - Replacing sequences of whitespace and hyphens with a single hyphen\n * - Removing leading and trailing hyphens\n *\n * @param str - The string to slugify\n * @returns The slugified string\n */\nexport const Slugify = (str: string) => {\n  return str\n    .toLowerCase()\n    .trim()\n    .replace(/[^\\w\\s-]/g, '')\n    .replace(/[\\s_-]+/g, '-')\n    .replace(/^-+|-+$/g, '')\n}\n\n/**\n * Truncates a string to a maximum length.\n *\n * @param str - The string to truncate.\n * @param length - The maximum length of the truncated string. Defaults to 15.\n * @returns The truncated string, with ellipses appended if truncated.\n */\nexport const Truncate = (str: string, length: number = 15) => {\n  return str.length > length ? `${str.slice(0, length)}...` : str\n}\n","import React, { useState, ChangeEvent, useEffect } from 'react'\nimport { useTextToSpeech } from './useTextToSpeech'\nimport Textarea from '#components/form/textarea.jsx'\nimport TextToSpeechControls from './views/TextToSpeechControls'\n\n/**\n * Props for the TextToSpeechComponent.\n * @interface TextToSpeechComponentProps\n */\ninterface TextToSpeechComponentProps {\n  /** Initial text to be spoken. Defaults to an empty string. */\n  initialText?: string\n  /** Whether to show the text input field. Defaults to true. */\n  showTextInput?: boolean\n  /** The voice to be used for speech synthesis. */\n  voice?: SpeechSynthesisVoice | undefined\n  /** The pitch of the voice. Defaults to 1. */\n  pitch?: number\n  /** The rate of speech. Defaults to 1. */\n  rate?: number\n  /** The language to be used for speech synthesis. */\n  language?: string\n  /** Player label */\n  label?: string | React.ReactNode\n  /** Callback function to be called when speech ends. */\n  onEnd?: () => void\n}\n\n/**\n * A component that converts text to speech using the Web Speech API.\n * @param {TextToSpeechComponentProps} props - The props for the component.\n * @returns {JSX.Element} The rendered TextToSpeechComponent.\n */\nexport const TextToSpeech: React.FC<TextToSpeechComponentProps> = ({\n  initialText = '',\n  showTextInput = false,\n  voice,\n  pitch = 1,\n  rate = 1,\n  language,\n  label,\n  onEnd,\n}) => {\n  const {\n    speak,\n    pause,\n    resume,\n    cancel,\n    isSpeaking,\n    isPaused,\n    getAvailableLanguages,\n    availableVoices,\n  } = useTextToSpeech()\n  const [text, setText] = useState<string>(initialText)\n  console.log(getAvailableLanguages())\n\n  useEffect(() => {\n    setText(initialText)\n  }, [initialText])\n\n  const handleSpeak = (): void => {\n    if (text.trim() !== '') {\n      speak(text, { voice, pitch, rate }, handleEnd)\n    }\n  }\n\n  const handleChange = (e: ChangeEvent<HTMLTextAreaElement>): void => {\n    setText(e.target.value)\n  }\n\n  const handleEnd = (): void => {\n    if (onEnd) {\n      onEnd()\n    }\n  }\n\n  return (\n    <>\n      {showTextInput && <Textarea value={text} onChange={handleChange} />}\n      <TextToSpeechControls\n        label={label}\n        isSpeaking={isSpeaking}\n        isPaused={isPaused}\n        onSpeak={handleSpeak}\n        onPause={pause}\n        onResume={resume}\n        onCancel={cancel}\n      />\n    </>\n  )\n}\n\nexport default TextToSpeech\nTextToSpeech.displayName = 'TextToSpeechComponent'\n","import { useState, useEffect } from 'react'\n\n/**\n * Options for configuring speech synthesis.\n * @interface SpeechOptions\n */\ninterface SpeechOptions {\n  /** The language for speech synthesis (e.g., 'en-US') */\n  lang?: string\n\n  /** The pitch of the voice (0 to 2) */\n  pitch?: number\n  /** The speed of the voice (0.1 to 10) */\n  rate?: number\n\n  /** The voice to use for speech synthesis */\n  voice?: SpeechSynthesisVoice\n}\n/**\n * Custom hook to handle text-to-speech functionality.\n *\n * @param {SpeechSynthesisVoice} [initialVoice] - The initial voice to use for speech synthesis.\n * @returns {Object} An object containing methods to control speech synthesis and state variables.\n */\nexport const useTextToSpeech = (initialVoice?: SpeechSynthesisVoice) => {\n  const [availableVoices, setAvailableVoices] = useState<\n    SpeechSynthesisVoice[]\n  >([])\n  const [currentVoice, setCurrentVoice] = useState<\n    SpeechSynthesisVoice | undefined\n  >(initialVoice)\n\n  const [isSpeaking, setIsSpeaking] = useState<boolean>(false)\n  const [isPaused, setIsPaused] = useState<boolean>(false)\n  const [utterance, setUtterance] = useState<SpeechSynthesisUtterance | null>(\n    null,\n  )\n\n  useEffect(() => {\n    const updateVoices = () => {\n      const voices = window.speechSynthesis.getVoices()\n      setAvailableVoices(voices)\n\n      // Set default voice to Google US English if available\n      const googleVoice = voices.find(\n        (voice) => voice.name === 'Google US English',\n      )\n      if (googleVoice) {\n        setCurrentVoice(googleVoice)\n      } else {\n        // Fallback to the first English voice if Google voice is not available\n        const englishVoice = voices.find((voice) =>\n          voice.lang.startsWith('en-'),\n        )\n        if (englishVoice) {\n          setCurrentVoice(englishVoice)\n        }\n      }\n    }\n\n    updateVoices()\n    window.speechSynthesis.onvoiceschanged = updateVoices\n\n    return () => {\n      window.speechSynthesis.onvoiceschanged = null\n    }\n  }, [])\n\n  /**\n   * Gets the list of available languages for speech synthesis.\n   * @returns {string[]} An array of available language codes.\n   */\n  const getAvailableLanguages = () => {\n    return [...new Set(availableVoices.map((voice) => voice.lang))]\n  }\n\n  /**\n   * Initiates speech synthesis for the given text.\n   *\n   * @param {string} text - The text to be spoken.\n   * @param {SpeechOptions} [options={}] - Options for speech synthesis.\n   * @param {Function} [onEnd] - Callback function to be called when speech ends.\n   */\n  const speak = (\n    text: string,\n    options: SpeechOptions = {},\n    onEnd?: () => void,\n  ) => {\n    const utterance = new SpeechSynthesisUtterance(text)\n\n    utterance.lang = options.lang ?? 'en-US'\n    utterance.pitch = options.pitch ?? 1\n    utterance.rate = options.rate ?? 1\n    utterance.voice = currentVoice ?? options.voice ?? null\n\n    utterance.onend = () => {\n      setIsSpeaking(false)\n      setIsPaused(false)\n      if (onEnd) {\n        onEnd()\n      }\n    }\n\n    if ('speechSynthesis' in window) {\n      window.speechSynthesis.speak(utterance)\n      setUtterance(utterance)\n      setIsSpeaking(true)\n      setIsPaused(false)\n    } else {\n      console.error('Speech synthesis not supported')\n      // Handle the error appropriately\n    }\n  }\n\n  /**\n   * Changes the current voice used for speech synthesis.\n   * @param {SpeechSynthesisVoice} voice - The new voice to use.\n   */\n  const changeVoice = (voice: SpeechSynthesisVoice) => {\n    setCurrentVoice(voice)\n  }\n\n  /**\n   * Pauses the ongoing speech synthesis.\n   */\n  const pause = () => {\n    if (isSpeaking && !isPaused) {\n      window.speechSynthesis.pause()\n      setIsPaused(true)\n    }\n  }\n\n  /**\n   * Resumes the paused speech synthesis.\n   */\n  const resume = () => {\n    if (isSpeaking && isPaused) {\n      window.speechSynthesis.resume()\n      setIsPaused(false)\n    }\n  }\n\n  /**\n   * Cancels the ongoing speech synthesis.\n   */\n  const cancel = () => {\n    if (isSpeaking) {\n      window.speechSynthesis.cancel()\n      setIsSpeaking(false)\n      setIsPaused(false)\n    }\n  }\n\n  return {\n    /** Initiates speech synthesis for the given text */\n    speak,\n    /** Pauses the ongoing speech synthesis */\n    pause,\n    /** Resumes the paused speech synthesis */\n    resume,\n    /** Cancels the ongoing speech synthesis */\n    cancel,\n    /** Indicates whether speech synthesis is currently active */\n    isSpeaking,\n    /** Indicates whether speech synthesis is currently paused */\n    isPaused,\n    /** Array of available voices for speech synthesis */\n    availableVoices,\n    /** Changes the current voice used for speech synthesis */\n    changeVoice,\n    /** The currently selected voice for speech synthesis */\n    currentVoice,\n    /** Gets the list of available languages for speech synthesis */\n    getAvailableLanguages,\n  }\n}\n","import React from 'react'\nimport Icon from '#components/icons/icon'\nimport UI from '#components/ui'\nimport { FC } from 'react'\n\n/**\n * Props for the TextToSpeechControls component.\n * @interface TextToSpeechControlsProps\n */\ninterface TextToSpeechControlsProps {\n  /** Optional label for the controls */\n  label?: string | React.ReactNode\n  /** Indicates if the text-to-speech is currently speaking */\n  isSpeaking: boolean\n  /** Indicates if the text-to-speech is paused */\n  isPaused: boolean\n  /** Function to start speaking */\n  onSpeak: () => void\n  /** Function to pause speaking */\n  onPause: () => void\n  /** Function to resume speaking */\n  onResume: () => void\n  /** Function to cancel speaking */\n  onCancel: () => void\n}\n\n/**\n * TTSButtonComponent props\n * @interface TTSButtonComponentProps\n */\ninterface TTSButtonComponentProps {\n  /** The content of the button */\n  children: React.ReactNode\n  /** Function to call when the button is clicked */\n  onClick: () => void\n}\n\n/**\n * TTSButtonComponent is a reusable button component for text-to-speech controls.\n * @param {TTSButtonComponentProps} props - The component props\n * @returns {React.ReactElement} The rendered button\n */\nexport const TTSButtonComponent: React.FC<TTSButtonComponentProps> = ({\n  children,\n  onClick,\n}) => {\n  return (\n    <UI\n      as=\"button\"\n      type=\"button\"\n      className=\"tts-border\"\n      data-btn=\"sm text pill\"\n      onClick={onClick}\n    >\n      {children}\n    </UI>\n  )\n}\n\nexport const TTSButton = React.memo(TTSButtonComponent)\n\n/**\n * TextToSpeechControlsComponent interface extends FC<TextToSpeechControlsProps>\n * and includes a TTSButton property.\n * @interface TextToSpeechControlsComponent\n * @extends {FC<TextToSpeechControlsProps>}\n */\ninterface TextToSpeechControlsComponent extends FC<TextToSpeechControlsProps> {\n  /** The TTSButton component used within TextToSpeechControls */\n  TTSButton: typeof TTSButton\n}\n\n/**\n * TextToSpeechControls component provides a user interface for controlling text-to-speech functionality.\n * @param {TextToSpeechControlsProps} props - The component props\n * @returns {React.ReactElement} The rendered TextToSpeechControls component\n */\nconst TextToSpeechControls: TextToSpeechControlsComponent = ({\n  label,\n  isSpeaking,\n  isPaused,\n  onSpeak,\n  onPause,\n  onResume,\n  onCancel,\n}) => {\n  const iconSize = 16\n\n  return (\n    <UI as=\"div\" data-tts>\n      {label && <p>{label}</p>}\n      {!isSpeaking && (\n        <TTSButton aria-label=\"Speak\" onClick={onSpeak}>\n          <Icon.PlaySolid size={iconSize} />\n        </TTSButton>\n      )}\n      {isSpeaking && !isPaused && (\n        <TTSButton aria-label=\"Pause\" onClick={onPause}>\n          <Icon.PauseSolid size={iconSize} />\n        </TTSButton>\n      )}\n      {isPaused && (\n        <TTSButton aria-label=\"Resume\" onClick={onResume}>\n          <Icon.ResumeSolid size={iconSize} />\n        </TTSButton>\n      )}\n      <TTSButton aria-label=\"Stop\" onClick={onCancel}>\n        <Icon.StopSolid size={iconSize} />\n      </TTSButton>\n    </UI>\n  )\n}\n\nTextToSpeechControls.displayName = 'TextToSpeechControls'\nTextToSpeechControls.TTSButton = TTSButton\n\nexport default TextToSpeechControls\n","import React from \"react\";\nimport UI from \"#components/ui\";\nimport DialogHeader from \"./view/dialog-header\";\n\nexport type DialogProps = {\n  isOpen?: boolean;\n  onOpen?: () => void;\n  onClose?: () => void;\n  onCancel?: () => void;\n  dialogTitle?: string;\n  showDialogHeader?: boolean;\n  isAlertDialog?: boolean;\n  children: React.ReactNode;\n};\n\nexport const Dialog = ({\n  isOpen = true,\n  dialogTitle = \"Dialog\",\n  onOpen,\n  onClose,\n  onCancel,\n  showDialogHeader = true,\n  isAlertDialog,\n  children,\n  ...props\n}: DialogProps): JSX.Element => {\n  const dialogRef = React.useRef<HTMLDialogElement>(null);\n  const [dialogOpen, setDialogOpen] = React.useState(isOpen);\n\n  React.useEffect(() => {\n    if (isOpen && onOpen) {\n      dialogRef.current?.showModal();\n      onOpen();\n    }\n    setDialogOpen(isOpen);\n  }, [isOpen]);\n\n  const handleCancelEvent = (e: React.SyntheticEvent<HTMLDialogElement>) => {\n    if (e.currentTarget === e.target) {\n      if (onCancel) {\n        onCancel();\n      }\n    }\n  };\n\n  const handleCloseEvent = (e: React.SyntheticEvent<HTMLDialogElement>) => {\n    if (e.currentTarget === e.target) {\n      if (onClose) {\n        onClose();\n      }\n      isOpen = false;\n      dialogRef.current?.close();\n    }\n  };\n\n  const closeDialog = () => {\n    if (onClose) {\n      onClose();\n    }\n    isOpen = false;\n    dialogRef.current?.close();\n  };\n\n  return (\n    <UI\n      as=\"dialog\"\n      open={dialogOpen}\n      ref={dialogRef}\n      role={isAlertDialog ? \"alertdialog\" : undefined}\n      onCancel={handleCancelEvent}\n      onClose={handleCloseEvent}\n      {...props}\n    >\n      {showDialogHeader && (\n        <DialogHeader dialogTitle={dialogTitle} onClose={closeDialog} />\n      )}\n      {children}\n    </UI>\n  );\n};\n\nexport default React.memo(Dialog);\nDialog.displayName = \"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  onClose: () => void;\n};\n\nconst DialogHeader = ({\n  dialogTitle,\n  onClose,\n}: DialogHeaderProps): JSX.Element => {\n  return (\n    <UI as=\"div\" classes=\"dialog-header\">\n      {dialogTitle && <Heading type=\"h3\">{dialogTitle}</Heading>}\n      <Button\n        type=\"button\"\n        onClick={onClose}\n        classes=\"transparent\"\n        data-btn=\"icon pill\"\n      >\n        <Icon.Remove size={16} />\n      </Button>\n    </UI>\n  );\n};\n\nexport default React.memo(DialogHeader);\nDialogHeader.displayName = \"DialogHeader\";\n"]}
+{"version":3,"sources":["../src/components/buttons/button.tsx","../src/components/cards/card.tsx","../src/components/form/fields.tsx","../src/components/layout/landmarks.tsx","../src/components/images/img.tsx","../src/components/form/inputs.tsx","../src/components/fp.tsx","../src/components/link/link.tsx","../src/components/list/list.tsx","../src/components/modal/modal.tsx","../src/components/modal/dialog.tsx","../src/components/nav/nav.tsx","../src/components/popover/popover.tsx","../src/components/tables/table-elements.tsx","../src/components/tables/table.tsx","../src/components/tag/tag.tsx","../src/components/details/details.tsx","../src/components/text/text.tsx","../src/components/form/textarea.tsx","../src/components/heading/heading.tsx","../src/components/breadcrumbs/breadcrumb.tsx","../src/libs/content.ts","../src/components/text-to-speech/TextToSpeech.tsx","../src/components/text-to-speech/useTextToSpeech.tsx","../src/components/text-to-speech/views/TextToSpeechControls.tsx","../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","Button","type","children","styles","disabled","classes","onPointerDown","onPointerOver","onPointerLeave","onClick","props","handlePointerDown","e","ui_default","button_default","Title","className","as","Content","Footer","Card","elm","id","Field","label","labelFor","Landmarks","Header","headerBackground","Main","Aside","Section","Article","Img","src","alt","width","height","loading","placeholder","fetchpriority","decoding","imgLoaded","imgError","FP","defaultStyles","ref","Component","styleObj","fp_default","Input","name","value","isDisabled","readonly","required","onChange","onBlur","handleChange","handleBlur","handleKeyDown","Link","href","target","rel","prefetch","btnStyle","relValue","link_default","ListItem","List","variant","role","list_default","ModalDialog","modalRef","openOnMount","dialog_default","Modal","openChild","closeChild","modalHeader","modalFooter","showOpen","dialogRef","openModal","closeModal","NavList","isBlock","NavItem","Nav","Popover","popoverTrigger","hoverRef","popOverRef","isVisible","popoverPosition","handlePointerEvent","handlePointerLeave","use_popover_default","popoverStyles","Caption","Thead","Tbody","Tr","Td","Table","dataStyle","RenderHead","data","head","item","index","RenderBody","rec","RenderTable","tblBody","tblCaption","tblHead","Tag","Details","summary","icon","ariaLabel","open","onToggle","onPointerDownCallback","Text","text","Textarea","rows","cols","readOnly","textarea_default","Heading","ui","heading_default","Truncate","str","length","Items","Breadcrumb","startRoute","startRouteUrl","currentRoute","spacer","routes","ariaLabelPrefix","truncateLength","linkProps","currentPath","setCurrentPath","path","getPathName","pathSegment","route","segments","segment","lastSegment","uuid","currentSegment","url","useState","useEffect","useTextToSpeech","initialVoice","availableVoices","setAvailableVoices","currentVoice","setCurrentVoice","isSpeaking","setIsSpeaking","isPaused","setIsPaused","utterance","setUtterance","updateVoices","voices","googleVoice","voice","englishVoice","options","onEnd","TTSButtonComponent","TTSButton","TextToSpeechControls","onSpeak","onPause","onResume","onCancel","icon_default","TextToSpeechControls_default","TextToSpeech","initialText","showTextInput","pitch","rate","language","speak","pause","resume","cancel","getAvailableLanguages","setText","handleSpeak","handleEnd","useRef","DialogHeader","dialogTitle","dialog_header_default","DialogFooter","onClose","onConfirm","confirmLabel","cancelLabel","dialog_footer_default","useCallback","useDialogClickHandler","handleClose","dialogDimensions","Dialog","showDialog","isAlertDialog","dialogLabel","hideFooter","isOpen","setIsOpen","dialog","handleClickOutside"],"mappings":"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","sourcesContent":["import UI from '../ui'\nimport React from 'react'\n\nexport type ButtonProps = Partial<React.ComponentProps<typeof UI>> & {\n    /**\n     * The button type\n     * Required - 'button' | 'submit' | 'reset'\n     */\n    type: 'button' | 'submit' | 'reset'\n  }\n\nexport const Button = ({\n  type = 'button',\n  children,\n  styles,\n  disabled,\n  classes,\n  onPointerDown,\n  onPointerOver,\n  onPointerLeave,\n  onClick,\n  ...props\n}: ButtonProps) => {\n  /**\n   * Handles the pointer down event on the button.\n   * Only triggers the onPointerDown callback if the button is not disabled.\n   * @param e The pointer event object from the button element\n   */\n  const handlePointerDown = (e: React.PointerEvent<HTMLButtonElement>) => {\n    if (!disabled) {\n      onPointerDown?.(e)\n    }\n  }\n\n  /**\n     * Handles the pointer over event on the button.\n     * Only triggers the onPointerOver callback if the button is not disabled.\n     * @param e The pointer event object from the button element\n     */\n  const handlePointerOver = (e: React.PointerEvent<HTMLButtonElement>) => {\n    if (!disabled) {\n      onPointerOver?.(e)\n    }\n  }\n\n  /**\n     * Handles the pointer leave event on the button.\n     * Only triggers the onPointerLeave callback if the button is not disabled.\n     * @param e The pointer event object from the button element\n     */\n  const handlePointerLeave = (e: React.PointerEvent<HTMLButtonElement>) => {\n    if (!disabled) {\n      onPointerLeave?.(e)\n    }\n  }\n\n  /**\n     * Handles the click event on the button.\n     * Only triggers the onClick callback if the button is not disabled.\n     * @param e The mouse event object from the button element\n     */\n  const handleOnClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n    if (!disabled) {\n       onClick?.(e)\n    }\n  }\n\n\n  /* Returning a button element. */\n  return (\n    <UI\n      as=\"button\"\n      type={type}\n      onPointerOver={handlePointerOver}\n      onPointerDown={handlePointerDown}\n      onPointerLeave={handlePointerLeave}\n      onKeyDown={handlePointerDown}\n      style={styles}\n      className={classes}\n      aria-disabled={disabled}\n      onClick={handleOnClick}\n      {...props}\n    >\n      {children}\n    </UI>\n  )\n  //\n}\n\nexport default Button\nButton.displayName = 'Button'\n","import React from 'react'\nimport UI from '#components/ui'\n\n/*\n * CardProps interface\n *\n * Extends ComponentProps. Defines props for the Card component.\n *\n * @property {('div' | 'aside' | 'section' | 'article')} [elm='div'] - HTML element to render as\n */\nexport type CardProps = {\n  elm?: 'div' | 'aside' | 'section' | 'article'\n  title?: React.ReactNode\n  footer?: React.ReactNode\n} & React.ComponentProps<typeof UI>\n\n/*\n * Title component\n *\n * Renders a title for the Card component using the UI component.\n *\n * @param {Object} props - Component props\n * @param {ReactNode} props.children - Title content\n * @param {string} [props.className] - Additional CSS classes\n * @param {Object} [props.styles] - Inline styles\n *\n * @returns {ReactElement} Title component\n */\nexport const Title = ({\n  children,\n  className,\n  styles,\n  as = 'h3',\n  ...props\n}: React.PropsWithChildren<{\n  className?: string\n  styles?: React.CSSProperties\n  as?: React.ElementType\n}>) => {\n  return (\n    <UI\n      as={as}\n      className={`card-title ${className || ''}`}\n      styles={styles}\n      {...props}\n    >\n      {children}\n    </UI>\n  )\n}\n\nTitle.displayName = 'Title'\n\n/*\n * CardContent component\n *\n * Renders the content of the Card component using the UI component with an article element.\n *\n * @param {Object} props - Component props\n * @param {ReactNode} props.children - Content\n * @param {string} [props.className] - Additional CSS classes\n * @param {Object} [props.styles] - Inline styles\n *\n * @returns {ReactElement} CardContent component\n */\nexport const Content = ({\n  children,\n  className,\n  styles,\n  ...props\n}: React.PropsWithChildren<{\n  className?: string\n  styles?: React.CSSProperties\n}>) => {\n  return (\n    <UI\n      as=\"article\"\n      className={`card-content ${className || ''}`}\n      styles={styles}\n      {...props}\n    >\n      {children}\n    </UI>\n  )\n}\n\nContent.displayName = 'Content'\n\n/*\n * Footer component\n *\n * Renders a footer section for the Card component using the UI component.\n *\n * @param {Object} props - Component props\n * @param {ReactNode} props.children - Footer content\n * @param {string} [props.className] - Additional CSS classes\n * @param {Object} [props.styles] - Inline styles\n *\n * @returns {ReactElement} Footer component\n */\nexport const Footer = ({\n  children,\n  className,\n  styles,\n  ...props\n}: React.PropsWithChildren<{\n  className?: string\n  styles?: React.CSSProperties\n}>) => {\n  return (\n    <UI\n      as=\"div\"\n      className={`card-footer ${className || ''}`}\n      styles={styles}\n      {...props}\n    >\n      {children}\n    </UI>\n  )\n}\n\nFooter.displayName = 'Footer'\n\n/*\n * Card component\n *\n * Renders a card container.\n *\n * @param {CardProps} props - Component props\n * @param {('div' | 'aside' | 'section' | 'article')} [props.elm='div'] - Element to render as\n * @param {Object} [props.styles] - CSS styles to apply\n * @param {ReactNode} props.children - Card content\n * @param {boolean} [props.renderStyles=true] - Whether to render default styles\n * @param {string} [props.dataStyle] - data-card attribute value\n * @param {string} [props.id] - Unique ID\n * @returns {ReactElement} Card component\n */\nexport const Card = ({\n  elm = 'div',\n  styles,\n  children,\n  classes = 'shadow',\n  id,\n  ...props\n}: CardProps) => {\n  return (\n    <UI\n      as={elm}\n      id={id}\n      styles={styles}\n      className={classes}\n      data-card\n      {...props}\n    >\n      {children}\n    </UI>\n  )\n}\n\nexport default Card\nCard.displayName = 'Card'\nCard.Title = Title\nCard.Content = Content\nCard.Footer = Footer\n","import React from 'react'\nimport UI from '../ui'\n\nexport type FieldProps = {\n  /**\n   * The label content\n   */\n  label: React.ReactNode\n  children: React.ReactNode\n} & React.ComponentProps<'label'> &\n  Partial<React.ComponentProps<typeof UI>>\n/**\n * Field component that renders a label and children wrapped in a div element.\n * @param labelFor Defines the for attribute of the label element\n * @param styles Custom styles to be applied to the component\n * @param label The label content\n * @param children The children to be rendered inside the component\n * @param props Additional props to be spread to the component\n */\nexport const Field = ({\n  label,\n  labelFor,\n  id,\n  styles,\n  classes,\n  children,\n  ...props\n}: FieldProps) => {\n  return (\n    <UI\n      as=\"div\"\n      id={id}\n      styles={styles}\n      className={classes}\n      data-style=\"fields\"\n      {...props}\n    >\n      <label htmlFor={labelFor}>{label}</label>\n      {children}\n    </UI>\n  )\n}\n\nexport default Field\nField.displayName = 'Field'\n","import UI from '../ui'\nimport React, { ReactNode } from 'react'\n\ntype ComponentProps = React.ComponentProps<typeof UI>\n\n/**\n * Renders children elements without any wrapping component.\n * Can be used as a placeholder when no semantic landmark is needed.\n */\nexport const Landmarks = (children?: React.FC) => <>{children}</>\n\ntype HeaderProps = {\n  headerBackground?: ReactNode\n} & ComponentProps\n/**\n * Header component.\n *\n * Renders a header landmark with a section child.\n *\n * @param children - The content to render inside the header.\n * @param styles - Optional styles object.\n * @param props - Other props.\n */\nexport const Header = ({\n  id,\n  children,\n  headerBackground,\n  styles,\n  classes,\n  ...props\n}: HeaderProps) => {\n  return (\n    <UI as=\"header\" id={id} styles={styles} className={classes} {...props}>\n      {headerBackground}\n      <UI as=\"section\">{children}</UI>\n    </UI>\n  )\n}\n\n/**\n * Main component.\n *\n * Renders a main landmark.\n *\n * @param children - The content to render inside the main element.\n * @param styles - Optional styles object.\n * @param props - Other props.\n */\nexport const Main = ({\n  id,\n  children,\n  styles,\n  classes,\n  ...props\n}: ComponentProps) => {\n  return (\n    <UI as=\"main\" id={id} styles={styles} {...props} className={classes}>\n      {children}\n    </UI>\n  )\n}\n\n/**\n * Footer component that renders a footer element with a section element inside.\n * @param {ReactNode} children - Child elements to render inside the section element.\n * @param styles - CSS styles to apply to the footer element.\n * @param props - Additional props to pass to the footer element.\n * @returns A React component that renders a footer element with a section element inside.\n */\nexport const Footer = ({\n  id,\n  classes,\n  children,\n  styles = {},\n  ...props\n}: ComponentProps) => {\n  return (\n    <UI as=\"footer\" id={id} className={classes} styles={styles} {...props}>\n      <UI as=\"section\">{children || 'Copyright © 2022'}</UI>\n    </UI>\n  )\n}\n\nexport const Aside = ({\n  id,\n  children,\n  styles = {},\n  classes,\n  ...props\n}: ComponentProps) => {\n  return (\n    <UI as=\"aside\" id={id} styles={styles} className={classes} {...props}>\n      <UI as=\"section\">{children}</UI>\n    </UI>\n  )\n}\n\n/**\n * Section component that renders a section element.\n *\n * @param children - Child elements to render inside the section.\n * @param styles - CSS styles to apply to the section.\n * @param props - Other props.\n */\nexport const Section = ({\n  id,\n  children,\n  styles,\n  classes,\n  ...props\n}: ComponentProps) => {\n  return (\n    <UI as=\"section\" id={id} styles={styles} className={classes} {...props}>\n      {children}\n    </UI>\n  )\n}\n\n/**\n * Article component renders an HTML <article> element.\n *\n * @param children - Child elements to render inside the article.\n * @param styles - CSS styles to apply to the article.\n * @param props - Additional props to pass to the article element.\n */\nexport const Article = ({\n  id,\n  children,\n\n  styles,\n  classes,\n  ...props\n}: ComponentProps) => {\n  return (\n    <UI as=\"article\" id={id} styles={styles} className={classes} {...props}>\n      {children}\n    </UI>\n  )\n}\n\nexport default Landmarks\n\nLandmarks.displayName = 'Landmarks'\nLandmarks.Header = Header\nLandmarks.Main = Main\nLandmarks.Footer = Footer\nLandmarks.Aside = Aside\nLandmarks.Section = Section\nLandmarks.Article = Article\n","import UI from '../ui'\nimport React from 'react'\n/*\n * ImageProps interface\n *\n * Extends ComponentProps and defines additional props for the Img component.\n *\n * @property {string} [src] - The image source URL\n * @property {string} alt - Required alt text for image accessibility\n * @property {number} width - Required width of image\n * @property {number} [height] - Optional height of image\n * @property {\"eager\" | \"lazy\"} [loading=\"lazy\"] - Loading behavior\n * @property {string} [placeholder] - Fallback placeholder image\n * @property {\"high\" | \"low\"} [fetchpriority=\"low\"] - Image fetch priority\n * @property {\"sync\" | \"async\" | \"auto\"} [decoding=\"auto\"] - Decode setting\n * @property {function} [imgError] - Error callback\n * @property {function} [imgLoaded] - Loaded callback\n */\nexport type ImageProps = React.ComponentProps<'img'> &\n  React.ComponentProps<typeof UI>\n\n/*\n * Img component\n *\n * Renders an <img> element with custom props.\n *\n * @param {string} src - The image source URL.\n * @param {string} alt - The alt text for the image.\n * @param {number} [width=480] - The width of the image.\n * @param {number} [height] - The height of the image.\n * @param {Object} [styles] - Additional CSS styles to apply.\n * @param {boolean} [renderStyles=true] - Whether to render the default styles.\n * @param {\"eager\" | \"lazy\"} [loading=\"lazy\"] - The loading attribute.\n * @param {string} [placeholder] - A placeholder image URL.\n * @param {\"high\" | \"low\"} [fetchpriority=\"low\"] - The fetchpriority attribute.\n * @param {\"sync\" | \"async\" | \"auto\"} [decoding=\"auto\"] - The decoding attribute.\n * @param {function} [imgLoaded] - Callback when image loads successfully.\n * @param {function} [imgError] - Callback when image errors.\n *\n * @returns {JSX.Element} The Img component.\n */\nexport const Img = ({\n  src = '//',\n  alt,\n  width = 480,\n  height,\n  styles,\n  loading = 'lazy',\n  placeholder = `https://via.placeholder.com/${width}?text=PLACEHOLDER`,\n  fetchpriority = 'low',\n  decoding = 'auto',\n  imgLoaded,\n  imgError,\n  ...props\n}: ImageProps) => {\n  const handleImgError = (\n    e: React.SyntheticEvent<HTMLImageElement, Event>,\n  ): void => {\n    if (imgError) {\n      imgError?.(e)\n      return\n    }\n    if (e.currentTarget.src !== placeholder) {\n      e.currentTarget.src = placeholder\n    }\n  }\n\n  const handleImgLoad = (\n    e: React.SyntheticEvent<HTMLImageElement, Event>,\n  ): void => {\n    imgLoaded?.(e)\n  }\n\n  return (\n    <UI\n      as=\"img\"\n      src={src}\n      alt={alt}\n      width={width}\n      height={height || 'auto'}\n      loading={loading}\n      style={styles}\n      onError={handleImgError}\n      onLoad={handleImgLoad}\n      fetchPriority={fetchpriority}\n      decoding={decoding}\n      {...props}\n    />\n  )\n}\n\nexport default Img\nImg.displayName = 'Img'\n","import React from 'react'\nimport FP from '../fp'\n\nexport type InputProps = {\n  /**\n   * The type of the input.\n   */\n  type?: 'text' | 'password' | 'email' | 'number' | 'tel' | 'url' | 'search'\n\n  /**\n   * Set the element as disabled\n   */\n  isDisabled?: boolean\n} & React.ComponentProps<typeof FP>\n\n/**\n * Input component that renders an HTML input element.\n * @param {InputProps} props - The input component props.\n * @returns {JSX.Element} - The input component.\n */\nexport const Input = ({\n  type = 'text',\n  name,\n  value,\n  placeholder,\n  id,\n  styles,\n  classes,\n  isDisabled,\n  disabled,\n  readonly,\n  required,\n  ref,\n  onChange,\n  onBlur,\n  onPointerDown,\n  ...props\n}: InputProps): JSX.Element => {\n  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    if (onChange && !disabled) {\n      onChange?.(e)\n    }\n  }\n\n  const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    if (onBlur && !disabled) {\n      onBlur?.(e)\n    }\n  }\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    if (onPointerDown && !disabled) {\n      e.preventDefault()\n      onPointerDown?.(e)\n    }\n  }\n\n  return (\n    <FP\n      as=\"input\"\n      id={id}\n      type={type}\n      placeholder={placeholder || `${required ? '*' : ''} ${type} input `}\n      className={classes}\n      styles={styles}\n      onChange={handleChange}\n      onBlur={handleBlur}\n      onKeyDown={handleKeyDown}\n      value={value}\n      name={name}\n      ref={ref}\n      aria-disabled={isDisabled}\n      tabIndex={isDisabled ? -1 : undefined}\n      aria-readonly={readonly}\n      aria-required={required}\n      required={required}\n      readOnly={readonly}\n      {...props}\n    />\n  )\n}\n\nInput.displayName = 'Input'\nexport default Input\n","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","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","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","import React from \"react\";\nimport { ComponentProps } from \"../../types\";\nimport { Button } from \"../buttons/button\";\nimport { ModalDialog } from \"./dialog\";\n\nexport interface ModalProps extends ComponentProps {\n  /**\n   * The child component/content for open button\n   */\n  openChild?: React.ReactNode;\n  /**\n   * The child component/content for close button\n   */\n  closeChild?: React.ReactNode;\n  /**\n   * The child component/content for modal header\n   */\n  modalHeader?: React.ReactNode;\n  /**\n   * The child component/content for modal footer\n   */\n  modalFooter?: React.ReactNode;\n  /**\n   * The child component/content for modal body\n   */\n  children: React.ReactNode;\n  /**\n   * Open modal on mount when set to true\n   */\n  showOpen?: boolean;\n}\nexport const Modal = ({\n  openChild,\n  closeChild,\n  modalHeader,\n  modalFooter,\n  children,\n  showOpen = false,\n  ...props\n}: ModalProps) => {\n  const dialogRef = React.useRef<HTMLDialogElement>(null);\n  const openModal = (): void => {\n    if (dialogRef.current) {\n      if (showOpen) dialogRef.current.show();\n      else dialogRef.current.showModal();\n    }\n  };\n  const closeModal = () => {\n    if (dialogRef.current) {\n      dialogRef.current.close();\n    }\n  };\n\n  return (\n    <>\n      <ModalDialog modalRef={dialogRef} openOnMount={showOpen} {...props}>\n        <section>\n          {modalHeader}\n          {children}\n          {modalFooter ?? (\n            <div>\n              <Button\n                type=\"button\"\n                pointerDown={() => {\n                  closeModal();\n                }}\n              >\n                {closeChild || \"Close\"}\n              </Button>{\" \"}\n            </div>\n          )}\n        </section>\n      </ModalDialog>\n      {!showOpen && (\n        <Button type=\"button\" pointerDown={openModal}>\n          {openChild || \"Open Modal\"}\n        </Button>\n      )}\n    </>\n  );\n};\n\nModal.displayName = \"Modal\";\n","import UI from \"../ui\";\nimport React from \"react\";\n\nexport type DialogProps = {\n  /**\n   * React ref for dialog element\n   */\n  modalRef: React.RefObject<HTMLDialogElement>;\n  /**\n   * Handle close modal event\n   */\n  closeModal?: (e: React.SyntheticEvent<HTMLDialogElement>) => void;\n  /**\n   * open modal on mount\n   */\n  openOnMount?: boolean;\n} & React.ComponentProps<typeof UI>;\n/**\n * Dialog component\n */\nexport const ModalDialog = ({\n  id,\n  children,\n  classes,\n  modalRef,\n  openOnMount,\n  ...props\n}: DialogProps) => {\n  const handleCloseModal = (e: React.SyntheticEvent<HTMLDialogElement>) => {\n    if (e.currentTarget === e.target) {\n      e.currentTarget.close();\n    }\n  };\n\n  return (\n    <UI\n      as=\"dialog\"\n      id={id}\n      classes={classes}\n      ref={modalRef}\n      open={openOnMount}\n      onClick={handleCloseModal}\n      {...props}\n    >\n      {children}\n    </UI>\n  );\n};\n\nexport default React.memo(ModalDialog);\nModalDialog.displayName = \"Dialog\";\n","import UI from '../ui'\nimport List from '../list/list'\nimport React from 'react'\n\nexport type NavListProps = React.ComponentProps<typeof List> & {\n  isBlock?: boolean\n}\nexport type NavItemProps = React.ComponentProps<typeof List.ListItem>\n\nexport type NavProps = React.ComponentProps<typeof UI>\n\n/**\n * Renders a NavList component.\n * @param {Object} props - The props for the component.\n * @param {ReactNode} props.children - The child elements.\n * @param {Object} props - Additional props to spread to the List component.\n * @returns {JSX.Element} The rendered NavList component.\n */\nexport const NavList = ({ isBlock, children, ...props }: NavListProps) => {\n  return (\n    <List type=\"ul\" {...props} data-list={`unstyled ${isBlock ? 'block' : ''}`}>\n      {children}\n    </List>\n  )\n}\n\n/**\n * Renders a NavItem component.\n * @param {Object} props - The props for the component.\n * @param {string} [props.id] - The id for the component.\n * @param {Object} [props.styles] - The styles for the component.\n * @param {string} [props.classes] - The classes for the component.\n * @param {ReactNode} props.children - The child elements.\n * @param {boolean} [props.inline=true] - Whether the item should display inline.\n * @param {Object} props - Additional props to spread to the ListItem component.\n * @returns {JSX.Element} The rendered NavItem component.\n */\nexport const NavItem = ({\n  id,\n  styles,\n  classes,\n  children,\n  ...props\n}: NavItemProps) => {\n  return (\n    <List.ListItem\n      type=\"li\"\n      id={id}\n      classes={classes}\n      styles={styles}\n      {...props}\n    >\n      {children}\n    </List.ListItem>\n  )\n}\n\n/**\n * Renders a Nav component.\n * @param {Object} props - The props for the component.\n * @param {ReactNode} props.children - The child elements.\n * @param {Object} props - Additional props to spread to the UI component.\n * @returns {JSX.Element} The rendered Nav component.\n */\nexport const Nav = ({ children, ...props }: NavProps) => {\n  return (\n    <UI as=\"nav\" {...props}>\n      {children}\n    </UI>\n  )\n}\n\nexport default Nav\nNav.displayName = 'Nav'\nNav.List = NavList\nNav.Item = NavItem\n","import React from 'react'\nimport usePopover from '#hooks/popover/use-popover'\n\n/**\n * Interface for props accepted by the Popover component\n *\n * @property {ReactNode} children - The content to show in the popover\n * @property {ReactNode} [content] - Optional alternative content for popover\n */\nexport type PopoverProps = {\n  children: React.ReactNode\n  popoverTrigger: React.ReactNode\n  styles?: {}\n}\n\nexport const defaultStyles = {\n  display: 'block',\n  position: 'absolute',\n  background: '#000',\n  border: '1px solid #010101',\n  padding: '10px',\n  color: '#fff',\n  transition: 'opacity .5s ease-in-out',\n} as React.CSSProperties\n\n/**\n * Popover component to display popover content.\n *\n * @param props - The props for the component\n * @param props.children - The content to show in the popover\n * @param props.popoverTrigger - The element that triggers the popover on hover\n *\n * @returns JSX.Element - The rendered JSX element for the Popover\n * @example - <Popover popoverTrigger={<button>Hover here</button>}>Popover content</Popover>\n *\n * The component uses the usePopover hook to handle popover visibility and positioning.\n *\n * It renders the triggerElement, and conditionally renders the popover content\n * positioned absolutely when visible.\n *\n * Inline styles handle visuals like background, border, padding, etc.\n *\n * Transforms and opacity animate the enter/exit transition of the popover.\n */\n\nexport const Popover = ({\n  children,\n  popoverTrigger,\n  styles,\n  ...props\n}: PopoverProps): JSX.Element => {\n  const hoverRef = React.useRef(null)\n  const popOverRef = React.useRef(null)\n  const { isVisible, popoverPosition, handlePointerEvent, handlePointerLeave } =\n    usePopover(hoverRef, popOverRef)\n  const popoverStyles = {\n    opacity: isVisible ? 1 : 0,\n    top: popoverPosition.top,\n    left: popoverPosition.left,\n    // transform: `translateY(${isVisible ? '0px' : '-50px'})`,\n    zIndex: 999,\n  } as React.CSSProperties\n\n  return (\n    <>\n      <div\n        ref={hoverRef}\n        onPointerEnter={handlePointerEvent}\n        onPointerLeave={handlePointerLeave}\n        {...props}\n      >\n        {popoverTrigger}\n      </div>\n      {isVisible && (\n        <div ref={popOverRef} style={{ ...popoverStyles, ...styles }}>\n          {children}\n        </div>\n      )}\n    </>\n  )\n}\n\nexport default Popover\nPopover.displayName = 'Popover'\nPopover.styles = defaultStyles\n","import FP from '../fp'\nimport { ComponentProps } from '../../types'\nimport React from 'react'\n\n\nexport const Caption = ({ children, ...props }: ComponentProps) => {\n  return (\n    <FP as=\"caption\" {...props}>\n      {children}\n    </FP>\n  )\n}\n\nexport const Thead = ({ children, ...props }: ComponentProps) => (\n  <FP as=\"thead\" {...props}>\n    {children}\n  </FP>\n)\n\nexport const Tbody = ({ children, ...props }: ComponentProps) => (\n  <FP as=\"tbody\" {...props}>\n    {children}\n  </FP>\n)\n\nexport const Tr = ({ children, ...props }: ComponentProps) => (\n  <FP as=\"tr\" {...props}>\n    {children}\n  </FP>\n)\n\nexport const Td = ({ children, ...props }: ComponentProps) => (\n  <FP as=\"td\" {...props}>\n    {children}\n  </FP>\n)\n\nexport const Table = ({ id, dataStyle, children, ...props }: ComponentProps) => {\n  return (\n    <FP\n      as=\"section\"\n      id={id}\n      {...props}\n      data-style=\"table-wrapper\"\n    >\n      <table>{children}</table>\n    </FP>\n  )\n}\n\nTable.displayName = 'Table'\nCaption.displayName = 'Caption'\nThead.displayName = 'Thead'\nTbody.displayName = 'Tbody'\nTr.displayName = 'Tr'\nTd.displayName = 'Td'\n\n","import { Table, Caption, Thead, Tbody, Td, Tr } from './table-elements'\nimport { ComponentProps } from '../../types'\n\nimport React from 'react'\n\nexport interface TableProps extends ComponentProps {\n  tblHead: React.ReactNode\n  tblBody: React.ReactNode\n  tblCaption?: React.ReactNode\n}\n\nexport type dataType = { id: number; items: string[] }[]\n\n/**\n * Render the `thead` by passing an array of names\n */\nexport const RenderHead = (data: []) => {\n  const head = data.map((item, index) => {\n    return <th key={index}>{item}</th>\n  })\n  return <tr>{head}</tr>\n}\n\n/**\n * Render the table body `tr`, `td` with the data provided\n */\nexport const RenderBody = (data: {}[]) => {\n  const rec = data.map((item, index) => {\n    return (\n      <tr key={index}>\n        {/* <td>{item?.id}</td>\n        <td>{item?.items}</td> */}\n      </tr>\n    )\n  })\n  return <Tbody>{rec}</Tbody>\n}\n\n/**\n * Render the table placing `caption`, `thead` and `tbody` in the correct order\n * caption is optional\n */\nexport const RenderTable = ({ tblBody, tblCaption, tblHead }: TableProps) => {\n  return (\n    <Table>\n      {tblCaption && <Caption>{tblCaption}</Caption>}\n      <Thead>\n        <Tr>{tblHead}</Tr>\n      </Thead>\n      <Tbody>{tblBody}</Tbody>\n    </Table>\n  )\n}\n\nRenderTable.displayName = 'TBL'\nRenderBody.displayName = 'renderBody'\nRenderHead.displayName = 'renderHead'\n","import React from 'react'\nimport UI from '#components/ui'\n\nexport type TagProps = {\n  /** HTML element to display the badge as span or p */\n  elm?: 'span' | 'p'\n  /**  Aria role for the component - conditional */\n  role: 'note' | 'status'\n} & React.ComponentProps<typeof UI>\n\nexport const Tag = ({\n  elm = 'span',\n  role = 'note',\n  children,\n  styles,\n  ...props\n}: TagProps) => {\n  return (\n    <UI as={elm} role={role} styles={styles} {...props}>\n      {children}\n    </UI>\n  )\n}\nexport default Tag\nTag.displayName = 'Tag'\n","import UI from \"#components/ui\";\nimport React from \"react\";\n\ntype DetailsProps = {\n  /**\n   * The summary text shown for the details.\n   * Required.\n   */\n  summary: React.ReactNode;\n\n  /**\n   * The aria-label  element for accessibility.\n   */\n  ariaLabel: string;\n} & React.ComponentProps<\"details\"> &\n  Partial<React.ComponentProps<typeof UI>>;\n\n/**3\n * Details component props interface.\n *\n * @param {React.CSSProperties} [styles] - CSS styles object.\n * @param {string} [classes] - Classnames string.\n * @param {boolean} [open] - Whether the details is open.\n * @param {(e: React.PointerEvent<HTMLDetailsElement>) => void} [onToggle] - onToggle callback.\n * @param {(e: React.PointerEvent<HTMLDetailsElement>) => void} [onPointerDown] - onPointerDown callback.\n * @param {ReactNode} children - The content inside the details.\n * @param {string} [ariaLabel] - aria-label for accessibility.\n * @param {React.Ref<any>} [ref] - Ref object.\n * @param {Object} props - Other props.\n */\nexport const Details = ({\n  summary,\n  icon,\n  styles,\n  classes,\n  ariaLabel,\n  name,\n  open,\n  onPointerDown,\n  onToggle,\n  children,\n  ref,\n  ...props\n}: DetailsProps) => {\n  const defaultStyles: React.CSSProperties = { ...styles };\n\n  const onPointerDownCallback = (e: React.PointerEvent<HTMLDetailsElement>) => {\n    if (onPointerDown) onPointerDown?.(e);\n    if (onPointerDown) onPointerDown?.(e);\n  };\n\n  const onToggleCallback = (e: React.PointerEvent<HTMLDetailsElement>) => {\n    if (onToggle) onPointerDown?.(e);\n  };\n  return (\n    <UI\n      as=\"details\"\n      style={defaultStyles}\n      className={classes}\n      onToggle={onToggleCallback}\n      ref={ref}\n      open={open}\n      aria-label={ariaLabel || \"Details dropdown\"}\n      // aria-roledescription=\"detail accordion\"\n      name={name}\n      {...props}\n    >\n      <UI as=\"summary\" onPointerDown={onPointerDownCallback}>\n        {icon}\n        {summary}\n      </UI>\n      <UI as=\"section\">{children}</UI>\n    </UI>\n  );\n};\n\nexport default Details;\nDetails.displayName = \"Details\";\n","// import FP from '../fp'\nimport React from 'react'\nimport UI from '#components/ui'\n\ntype InheritedProps = React.ComponentProps<typeof UI>\n\ntype TextElements =\n  | 'a'\n  | 'b'\n  | 'blockquote'\n  | 'b'\n  | 'blockquote'\n  | 'cite'\n  | 'code'\n  | 'em'\n  | 'i'\n  | 'em'\n  | 'i'\n  | 'kbd'\n  | 'mark'\n  | 'p'\n  | 's'\n  | 'small'\n  | 'span'\n  | 'span'\n  | 'strong'\n  | 'mark'\n  | 'p'\n  | 's'\n  | 'small'\n  | 'span'\n  | 'span'\n  | 'strong'\n  | 'sub'\n  | 'sup'\n  | 'time'\n  | 'time'\n  | 'u'\n\nexport type TextProps = {\n  /**\n   * Text element to to use\n   * Text element to to use\n   */\n  elm?: TextElements\n  /** Pass a text element or string */\n  text?: string\n} & InheritedProps\n\nexport const Text = ({\n  elm = 'p',\n  id,\n  text,\n  styles,\n  classes,\n  children,\n  ...props\n}: TextProps) => {\n  return (\n    <UI as={elm} id={id} styles={styles} className={classes} {...props}>\n      <UI as={elm} id={id} styles={styles} className={classes} {...props}>\n        {children || text}\n      </UI>\n    </UI>\n  )\n}\n\ntype TitleProps = {\n  /**\n   * HTML headings\n   */\n  elm?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'\n} & InheritedProps\n\nexport const Title = ({\n  elm = 'h3',\n  id,\n  children,\n  styles,\n  classes,\n  ...props\n}: TitleProps) => {\n  return (\n    <Text as={elm} id={id} styles={styles} className={classes} {...props}>\n      {children}\n    </Text>\n  )\n}\n\nexport default Text\n\nText.displayName = 'Text'\nTitle.displayName = 'Title'\n","import React from 'react'\nimport UI from '../ui'\n\nexport type TextareaProps = React.ComponentProps<'textarea'> &\n  React.ComponentProps<typeof UI>\n\n/**\n * Textarea component.\n *\n * @param value - The value of the textarea.\n * @param rows - The number of rows.\n * @param cols - The number of columns.\n * @param id - The id of the textarea.\n * @param name - The name of the textarea.\n * @param required - Whether the textarea is required.\n * @param disabled - Whether the textarea is disabled.\n * @param readOnly - Whether the textarea is read only.\n * @param onBlur - Blur event handler.\n * @param onPointerDown - Pointer down event handler.\n * @param onChange - Change event handler.\n * @param ref - Ref for the textarea.\n * @param styles - Styles object for the textarea.\n * @param textareaRef - Ref specifically for the textarea element.\n * @param props - Other props.\n */\nexport const Textarea = ({\n  id,\n  classes,\n  value,\n  rows = 5,\n  cols = 25,\n  name,\n  required,\n  disabled,\n  readOnly,\n  onBlur,\n  onPointerDown,\n  onChange,\n  ref,\n  styles,\n  placeholder,\n  ...props\n}: TextareaProps) => {\n  const handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n    if (onChange && !disabled) {\n      onChange?.(e)\n    }\n  }\n\n  const handleBlur = (e: React.FocusEvent<HTMLTextAreaElement>) => {\n    if (onBlur && !disabled) {\n      onBlur?.(e)\n    }\n  }\n\n  const handlePointerDown = (e: React.PointerEvent<HTMLTextAreaElement>) => {\n    if (onPointerDown && !disabled) {\n      onPointerDown?.(e)\n    }\n  }\n\n  return (\n    <UI\n      as=\"textarea\"\n      id={id}\n      name={name}\n      rows={rows}\n      cols={cols}\n      styles={styles}\n      className={classes}\n      data-style=\"textarea\"\n      required={required}\n      value={value}\n      aria-disabled={disabled}\n      readOnly={readOnly}\n      onChange={handleChange}\n      onBlur={handleBlur}\n      onPointerDown={handlePointerDown}\n      ref={ref}\n      placeholder={placeholder || `${required ? '*' : ''} Message`}\n      {...props}\n    />\n  )\n}\n\nexport default Textarea\nTextarea.displayName = 'Textarea'\n","import React from 'react'\nimport UI from '#components/ui'\nimport { type } from 'os'\n\nexport type TitleProps = {\n  children: React.ReactNode\n  type: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'\n  ui?: string\n} & React.ComponentProps<typeof UI>\n\nconst Heading = ({\n  type = 'h3',\n  id,\n  styles,\n  ui,\n  children,\n  ...props\n}: TitleProps) => {\n  return (\n    <UI as={type} id={id} styles={styles} data-ui={ui} {...props}>\n      {children}\n    </UI>\n  )\n}\n\nexport default Heading\nHeading.displayName = 'Heading'\n","// Code: Breadcrumb component\nimport React from 'react'\nimport UI from '#components/ui'\nimport { Truncate } from '#libs/content'\nimport Link from '#components/link/link'\n\n// TYPES\n\ntype customRoute = {\n  /** The path or id for routing */\n  path?: string\n  /** The display name */\n  name: string\n  /** The url if linking out */\n  url?: string\n}\n\ntype BreadcrumbProps = {\n  /** Array of custom route objects */\n  routes?: customRoute[]\n  /** Starting route node */\n  startRoute?: React.ReactNode\n  /* Starting route url */\n  startRouteUrl?: string\n  /** Spacer node between routes */\n  spacer?: React.ReactNode\n  /** String representing current route */\n  currentRoute?: string\n  /** Prefix breadcrumb aria-label - \"prefix breadcrumb\" */\n  ariaLabelPrefix?: string\n  /** Truncate breadcrumb text after this length */\n  truncateLength?: number\n  /** Link props for breadcrumb links */\n  linkProps?: React.ComponentProps<typeof Link>\n} & React.ComponentProps<typeof UI>\n\n// Components\n\n/**\n * Items component.\n *\n * @param styles - Styles object for the item.\n * @param id - Id for the item.\n * @param classes - Class names for the item.\n * @param children - Child components.\n * @param props - Other props.\n */\nconst Items = ({\n  styles,\n  id,\n  classes,\n  children,\n  ...props\n}: React.ComponentProps<typeof UI>) => {\n  return (\n    <li data-list=\"unstyled inline\" {...props}>\n      {children}\n    </li>\n  )\n}\n\n/**\n * List component.\n *\n * @param children - The content to render inside the list.\n * @param props - Additional props to pass to the UI component.\n */\nconst List = ({ children, ...props }: React.ComponentProps<typeof UI>) => {\n  return (\n    <UI as=\"ol\" data-list=\"unstyled inline\" {...props}>\n      {children}\n    </UI>\n  )\n}\n\n/**\n * Nav component.\n *\n * @param styles - Styles object for the nav.\n * @param id - Id for the nav.\n * @param classes - Class names for the nav.\n * @param children - Child components.\n * @param props - Other props.\n */\nconst Nav = ({\n  styles,\n  id,\n  classes,\n  children,\n  ...props\n}: React.ComponentProps<typeof UI>) => {\n  return (\n    <UI as=\"nav\" id={id} styles={styles} className={classes} {...props}>\n      <List>{children}</List>\n    </UI>\n  )\n}\n\n/**\n * Navigation component for breadcrumbs.\n *\n * @param props - Props for the navigation component.\n * @param props.startRoute - Starting route node. Default 'Home'.\n * @param props.currentRoute - String representing current route.\n * @param props.spacer - Spacer node between routes. Default '&#47;'.\n * @param props.routes - Array of custom route objects.\n * @param props.styles - Styles object for the nav.\n * @param props.id - Id for the nav.\n * @param props.classes - Class names for the nav.\n * @param props.children - Child components.\n */\nexport const Breadcrumb = ({\n  startRoute = 'Home',\n  startRouteUrl = \"/\",\n  currentRoute,\n  spacer = <>&#47;</>,\n  routes,\n  styles,\n  id,\n  classes,\n  ariaLabelPrefix,\n  truncateLength = 15,\n  linkProps,\n  ...props\n}: BreadcrumbProps): React.JSX.Element => {\n  const [currentPath, setCurrentPath] = React.useState('')\n  React.useEffect(() => {\n    const path = currentRoute || window.location.pathname\n    if (path.length) {\n      setCurrentPath(path)\n    }\n  }, [currentRoute])\n\n  /**\n   * Gets the path name for the given path segment.\n   *\n   * @param pathSegment - The path segment (string or number) to get the path name for.\n   * @returns The path name object for the given path segment.\n   */\n  const getPathName = (pathSegment: string): customRoute => {\n    const route = routes?.find((route) => route.path === pathSegment)\n\n    return {\n      path: route?.path || pathSegment,\n      name: route?.name || pathSegment,\n      url: route?.url || pathSegment,\n    }\n  }\n\n  /** Array of path segments from current path */\n  const segments = currentPath.split('/').filter((segment) => segment)\n  /** Index of last item in segments array */\n  const lastSegment = segments.length - 1\n\n  /** Unique id for breadcrumb */\n  const uuid = React.useId()\n\n\n  return currentPath.length ? (\n    <Nav\n      id={id}\n      {...props}\n      styles={styles}\n      className={classes}\n      aria-label={ariaLabelPrefix}\n    >\n      <Items key={`${startRoute}-${uuid}`}>\n        <Link href={startRouteUrl} {...linkProps}>{startRoute}</Link>\n      </Items>\n      <>\n      {segments.length ? (\n        segments.map((segment: any, index: number) => {\n          const currentSegment = getPathName(segment)\n          const { name, url, path } = currentSegment\n          return index === lastSegment ? (\n            <>\n              {typeof segments[lastSegment] === 'string' &&\n                segments[lastSegment].length > 3 &&\n                segments[lastSegment] !== segments[lastSegment - 1] && (\n                  <Items  key={`${path || index}-${uuid}`}>\n                     \n                      <span aria-hidden=\"true\">{spacer}</span>\n                      <a\n                      href=\"#\"\n                        aria-current=\"page\"\n                        aria-label={\n                          name.length > truncateLength ? name : undefined\n                        }\n                      >\n                        {Truncate(decodeURIComponent(name), truncateLength)}\n                      </a>\n                     \n                  </Items>\n                )}\n            </>\n          ) : (\n            <Items key={`${currentSegment?.name}-${uuid}`}>\n              <span aria-hidden=\"true\">{spacer}</span>\n              <span>\n                <Link\n                  href={url}\n                  aria-label={name.length > truncateLength ? name : undefined}\n                 {...linkProps}\n                >\n                  {Truncate(decodeURIComponent(name), truncateLength)}\n                </Link>\n              </span>\n            </Items>\n          );\n        })\n      ) : (\n        null\n      )}\n      </>\n    </Nav>\n  ) : (\n    <></>\n  )\n}\n\nexport default Breadcrumb\n\nBreadcrumb.displayName = 'BreadCrumb'\nBreadcrumb.Nav = Nav\nBreadcrumb.List = List\nBreadcrumb.Items = Items\n","/**\n * Converts a string to a slug by:\n * - Converting to lowercase\n * - Trimming whitespace\n * - Removing non-word and non-hyphen characters\n * - Replacing sequences of whitespace and hyphens with a single hyphen\n * - Removing leading and trailing hyphens\n *\n * @param str - The string to slugify\n * @returns The slugified string\n */\nexport const Slugify = (str: string) => {\n  return str\n    .toLowerCase()\n    .trim()\n    .replace(/[^\\w\\s-]/g, '')\n    .replace(/[\\s_-]+/g, '-')\n    .replace(/^-+|-+$/g, '')\n}\n\n/**\n * Truncates a string to a maximum length.\n *\n * @param str - The string to truncate.\n * @param length - The maximum length of the truncated string. Defaults to 15.\n * @returns The truncated string, with ellipses appended if truncated.\n */\nexport const Truncate = (str: string, length: number = 15) => {\n  return str.length > length ? `${str.slice(0, length)}...` : str\n}\n","import React, { useState, ChangeEvent, useEffect } from 'react'\nimport { useTextToSpeech } from './useTextToSpeech'\nimport Textarea from '#components/form/textarea.jsx'\nimport TextToSpeechControls from './views/TextToSpeechControls'\n\n/**\n * Props for the TextToSpeechComponent.\n * @interface TextToSpeechComponentProps\n */\ninterface TextToSpeechComponentProps {\n  /** Initial text to be spoken. Defaults to an empty string. */\n  initialText?: string\n  /** Whether to show the text input field. Defaults to true. */\n  showTextInput?: boolean\n  /** The voice to be used for speech synthesis. */\n  voice?: SpeechSynthesisVoice | undefined\n  /** The pitch of the voice. Defaults to 1. */\n  pitch?: number\n  /** The rate of speech. Defaults to 1. */\n  rate?: number\n  /** The language to be used for speech synthesis. */\n  language?: string\n  /** Player label */\n  label?: string | React.ReactNode\n  /** Callback function to be called when speech ends. */\n  onEnd?: () => void\n}\n\n/**\n * A component that converts text to speech using the Web Speech API.\n * @param {TextToSpeechComponentProps} props - The props for the component.\n * @returns {JSX.Element} The rendered TextToSpeechComponent.\n */\nexport const TextToSpeech: React.FC<TextToSpeechComponentProps> = ({\n  initialText = '',\n  showTextInput = false,\n  voice,\n  pitch = 1,\n  rate = 1,\n  language,\n  label,\n  onEnd,\n}) => {\n  const {\n    speak,\n    pause,\n    resume,\n    cancel,\n    isSpeaking,\n    isPaused,\n    getAvailableLanguages,\n    availableVoices,\n  } = useTextToSpeech()\n  const [text, setText] = useState<string>(initialText)\n  console.log(getAvailableLanguages())\n\n  useEffect(() => {\n    setText(initialText)\n  }, [initialText])\n\n  const handleSpeak = (): void => {\n    if (text.trim() !== '') {\n      speak(text, { voice, pitch, rate }, handleEnd)\n    }\n  }\n\n  const handleChange = (e: ChangeEvent<HTMLTextAreaElement>): void => {\n    setText(e.target.value)\n  }\n\n  const handleEnd = (): void => {\n    if (onEnd) {\n      onEnd()\n    }\n  }\n\n  return (\n    <>\n      {showTextInput && <Textarea value={text} onChange={handleChange} />}\n      <TextToSpeechControls\n        label={label}\n        isSpeaking={isSpeaking}\n        isPaused={isPaused}\n        onSpeak={handleSpeak}\n        onPause={pause}\n        onResume={resume}\n        onCancel={cancel}\n      />\n    </>\n  )\n}\n\nexport default TextToSpeech\nTextToSpeech.displayName = 'TextToSpeechComponent'\n","import { useState, useEffect } from 'react'\n\n/**\n * Options for configuring speech synthesis.\n * @interface SpeechOptions\n */\ninterface SpeechOptions {\n  /** The language for speech synthesis (e.g., 'en-US') */\n  lang?: string\n\n  /** The pitch of the voice (0 to 2) */\n  pitch?: number\n  /** The speed of the voice (0.1 to 10) */\n  rate?: number\n\n  /** The voice to use for speech synthesis */\n  voice?: SpeechSynthesisVoice\n}\n/**\n * Custom hook to handle text-to-speech functionality.\n *\n * @param {SpeechSynthesisVoice} [initialVoice] - The initial voice to use for speech synthesis.\n * @returns {Object} An object containing methods to control speech synthesis and state variables.\n */\nexport const useTextToSpeech = (initialVoice?: SpeechSynthesisVoice) => {\n  const [availableVoices, setAvailableVoices] = useState<\n    SpeechSynthesisVoice[]\n  >([])\n  const [currentVoice, setCurrentVoice] = useState<\n    SpeechSynthesisVoice | undefined\n  >(initialVoice)\n\n  const [isSpeaking, setIsSpeaking] = useState<boolean>(false)\n  const [isPaused, setIsPaused] = useState<boolean>(false)\n  const [utterance, setUtterance] = useState<SpeechSynthesisUtterance | null>(\n    null,\n  )\n\n  useEffect(() => {\n    const updateVoices = () => {\n      const voices = window.speechSynthesis.getVoices()\n      setAvailableVoices(voices)\n\n      // Set default voice to Google US English if available\n      const googleVoice = voices.find(\n        (voice) => voice.name === 'Google US English',\n      )\n      if (googleVoice) {\n        setCurrentVoice(googleVoice)\n      } else {\n        // Fallback to the first English voice if Google voice is not available\n        const englishVoice = voices.find((voice) =>\n          voice.lang.startsWith('en-'),\n        )\n        if (englishVoice) {\n          setCurrentVoice(englishVoice)\n        }\n      }\n    }\n\n    updateVoices()\n    window.speechSynthesis.onvoiceschanged = updateVoices\n\n    return () => {\n      window.speechSynthesis.onvoiceschanged = null\n    }\n  }, [])\n\n  /**\n   * Gets the list of available languages for speech synthesis.\n   * @returns {string[]} An array of available language codes.\n   */\n  const getAvailableLanguages = () => {\n    return [...new Set(availableVoices.map((voice) => voice.lang))]\n  }\n\n  /**\n   * Initiates speech synthesis for the given text.\n   *\n   * @param {string} text - The text to be spoken.\n   * @param {SpeechOptions} [options={}] - Options for speech synthesis.\n   * @param {Function} [onEnd] - Callback function to be called when speech ends.\n   */\n  const speak = (\n    text: string,\n    options: SpeechOptions = {},\n    onEnd?: () => void,\n  ) => {\n    const utterance = new SpeechSynthesisUtterance(text)\n\n    utterance.lang = options.lang ?? 'en-US'\n    utterance.pitch = options.pitch ?? 1\n    utterance.rate = options.rate ?? 1\n    utterance.voice = currentVoice ?? options.voice ?? null\n\n    utterance.onend = () => {\n      setIsSpeaking(false)\n      setIsPaused(false)\n      if (onEnd) {\n        onEnd()\n      }\n    }\n\n    if ('speechSynthesis' in window) {\n      window.speechSynthesis.speak(utterance)\n      setUtterance(utterance)\n      setIsSpeaking(true)\n      setIsPaused(false)\n    } else {\n      console.error('Speech synthesis not supported')\n      // Handle the error appropriately\n    }\n  }\n\n  /**\n   * Changes the current voice used for speech synthesis.\n   * @param {SpeechSynthesisVoice} voice - The new voice to use.\n   */\n  const changeVoice = (voice: SpeechSynthesisVoice) => {\n    setCurrentVoice(voice)\n  }\n\n  /**\n   * Pauses the ongoing speech synthesis.\n   */\n  const pause = () => {\n    if (isSpeaking && !isPaused) {\n      window.speechSynthesis.pause()\n      setIsPaused(true)\n    }\n  }\n\n  /**\n   * Resumes the paused speech synthesis.\n   */\n  const resume = () => {\n    if (isSpeaking && isPaused) {\n      window.speechSynthesis.resume()\n      setIsPaused(false)\n    }\n  }\n\n  /**\n   * Cancels the ongoing speech synthesis.\n   */\n  const cancel = () => {\n    if (isSpeaking) {\n      window.speechSynthesis.cancel()\n      setIsSpeaking(false)\n      setIsPaused(false)\n    }\n  }\n\n  return {\n    /** Initiates speech synthesis for the given text */\n    speak,\n    /** Pauses the ongoing speech synthesis */\n    pause,\n    /** Resumes the paused speech synthesis */\n    resume,\n    /** Cancels the ongoing speech synthesis */\n    cancel,\n    /** Indicates whether speech synthesis is currently active */\n    isSpeaking,\n    /** Indicates whether speech synthesis is currently paused */\n    isPaused,\n    /** Array of available voices for speech synthesis */\n    availableVoices,\n    /** Changes the current voice used for speech synthesis */\n    changeVoice,\n    /** The currently selected voice for speech synthesis */\n    currentVoice,\n    /** Gets the list of available languages for speech synthesis */\n    getAvailableLanguages,\n  }\n}\n","import React from 'react'\nimport Icon from '#components/icons/icon'\nimport UI from '#components/ui'\nimport { FC } from 'react'\n\n/**\n * Props for the TextToSpeechControls component.\n * @interface TextToSpeechControlsProps\n */\ninterface TextToSpeechControlsProps {\n  /** Optional label for the controls */\n  label?: string | React.ReactNode\n  /** Indicates if the text-to-speech is currently speaking */\n  isSpeaking: boolean\n  /** Indicates if the text-to-speech is paused */\n  isPaused: boolean\n  /** Function to start speaking */\n  onSpeak: () => void\n  /** Function to pause speaking */\n  onPause: () => void\n  /** Function to resume speaking */\n  onResume: () => void\n  /** Function to cancel speaking */\n  onCancel: () => void\n}\n\n/**\n * TTSButtonComponent props\n * @interface TTSButtonComponentProps\n */\ninterface TTSButtonComponentProps {\n  /** The content of the button */\n  children: React.ReactNode\n  /** Function to call when the button is clicked */\n  onClick: () => void\n}\n\n/**\n * TTSButtonComponent is a reusable button component for text-to-speech controls.\n * @param {TTSButtonComponentProps} props - The component props\n * @returns {React.ReactElement} The rendered button\n */\nexport const TTSButtonComponent: React.FC<TTSButtonComponentProps> = ({\n  children,\n  onClick,\n}) => {\n  return (\n    <UI\n      as=\"button\"\n      type=\"button\"\n      className=\"tts-border\"\n      data-btn=\"sm text pill\"\n      onClick={onClick}\n    >\n      {children}\n    </UI>\n  )\n}\n\nexport const TTSButton = React.memo(TTSButtonComponent)\n\n/**\n * TextToSpeechControlsComponent interface extends FC<TextToSpeechControlsProps>\n * and includes a TTSButton property.\n * @interface TextToSpeechControlsComponent\n * @extends {FC<TextToSpeechControlsProps>}\n */\ninterface TextToSpeechControlsComponent extends FC<TextToSpeechControlsProps> {\n  /** The TTSButton component used within TextToSpeechControls */\n  TTSButton: typeof TTSButton\n}\n\n/**\n * TextToSpeechControls component provides a user interface for controlling text-to-speech functionality.\n * @param {TextToSpeechControlsProps} props - The component props\n * @returns {React.ReactElement} The rendered TextToSpeechControls component\n */\nconst TextToSpeechControls: TextToSpeechControlsComponent = ({\n  label,\n  isSpeaking,\n  isPaused,\n  onSpeak,\n  onPause,\n  onResume,\n  onCancel,\n}) => {\n  const iconSize = 16\n\n  return (\n    <UI as=\"div\" data-tts>\n      {label && <p>{label}</p>}\n      {!isSpeaking && (\n        <TTSButton aria-label=\"Speak\" onClick={onSpeak}>\n          <Icon.PlaySolid size={iconSize} />\n        </TTSButton>\n      )}\n      {isSpeaking && !isPaused && (\n        <TTSButton aria-label=\"Pause\" onClick={onPause}>\n          <Icon.PauseSolid size={iconSize} />\n        </TTSButton>\n      )}\n      {isPaused && (\n        <TTSButton aria-label=\"Resume\" onClick={onResume}>\n          <Icon.ResumeSolid size={iconSize} />\n        </TTSButton>\n      )}\n      <TTSButton aria-label=\"Stop\" onClick={onCancel}>\n        <Icon.StopSolid size={iconSize} />\n      </TTSButton>\n    </UI>\n  )\n}\n\nTextToSpeechControls.displayName = 'TextToSpeechControls'\nTextToSpeechControls.TTSButton = TTSButton\n\nexport default TextToSpeechControls\n","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/index.d.cts

@@ -1,7 +1,7 @@
-import { F as FP$1, C as ComponentProps$1 } from './icons-1f5afc0c.js';
-export { I as Icon } from './icons-1f5afc0c.js';
+import { F as FP$1, C as ComponentProps$1 } from './icons-31ace3de.js';
+export { I as Icon } from './icons-31ace3de.js';
 import * as React from 'react';
-import React__default, { ReactNode } from 'react';
+import React__default, { ReactNode, CSSProperties } from 'react';
 
 type ButtonProps = Partial<React__default.ComponentProps<typeof FP$1>> & {
     /**
@@ -542,19 +542,50 @@ interface TextToSpeechComponentProps {
  */
 declare const TextToSpeech: React__default.FC<TextToSpeechComponentProps>;
 
-type DialogProps = {
-    isOpen?: boolean;
-    onOpen?: () => void;
-    onClose?: () => void;
-    onCancel?: () => void;
-    dialogTitle?: string;
-    showDialogHeader?: boolean;
-    isAlertDialog?: boolean;
+/**
+ * Defines the props for the Dialog component.
+ *
+ * @property {boolean} [showDialog] - Determines whether the dialog should be shown.
+ * @property {boolean} [isAlertDialog] - Determines whether the dialog should be displayed as an alert dialog.
+ * @property {() => void} [onClose] - A callback function to be called when the dialog is closed.
+ * @property {string} dialogTitle - The title of the dialog.
+ * @property {string} [dialogLabel] - An optional label for the dialog.
+ * @property {React.ReactNode} children - The content to be displayed inside the dialog.
+ * @property {() => void | Promise<void>} [onConfirm] - A callback function to be called when the user confirms the dialog.
+ * @property {string} [confirmLabel] - The label for the confirm button.
+ * @property {string} [cancelLabel] - The label for the cancel button.
+ * @property {string} [className] - An optional CSS class name to be applied to the dialog.
+ * @property {CSSProperties} [styles] - Optional inline styles to be applied to the dialog.
+ */
+type DialogModalProps = React__default.ComponentProps<typeof FP$1> & React__default.ComponentProps<"dialog"> & {
+    dialogTitle: string;
+    dialogLabel?: string;
     children: React__default.ReactNode;
+    showDialog?: boolean;
+    isAlertDialog?: boolean;
+    onClose?: () => void;
+    onConfirm?: () => void | Promise<void>;
+    confirmLabel?: string;
+    cancelLabel?: string;
+    className?: string;
+    hideFooter?: boolean;
+    styles?: CSSProperties;
 };
-declare const Dialog: {
-    ({ isOpen, dialogTitle, onOpen, onClose, onCancel, showDialogHeader, isAlertDialog, children, ...props }: DialogProps): JSX.Element;
-    displayName: string;
-};
+/**
+ * Renders a dialog modal component with customizable content and behavior.
+ *
+ * @param showDialog - Determines whether the dialog should be shown.
+ * @param isAlertDialog - Determines whether the dialog should be displayed as an alert dialog.
+ * @param onClose - A callback function to be called when the dialog is closed.
+ * @param dialogTitle - The title of the dialog.
+ * @param dialogLabel - An optional label for the dialog.
+ * @param children - The content to be displayed inside the dialog.
+ * @param onConfirm - A callback function to be called when the user confirms the dialog.
+ * @param confirmLabel - The label for the confirm button.
+ * @param cancelLabel - The label for the cancel button.
+ * @param className - An optional CSS class name to be applied to the dialog.
+ * @param styles - Optional inline styles to be applied to the dialog.
+ */
+declare const Dialog: React__default.FC<DialogModalProps>;
 
 export { Article, Aside, FP as Box, Breadcrumb, Button, Caption, Card, Details, Dialog, FP, Field, Footer, Header, Img, Input, Landmarks, Link, List, Main, Modal, Nav, NavItem, NavItemProps, NavList, NavListProps, NavProps, Popover, Section, RenderTable as TBL, Table, Tag, TagProps, Tbody, Td, Text, TextProps, TextToSpeech, Textarea, TextareaProps, Thead, Title, TitleProps, Link as To, Tr };

package/libs/index.d.ts

@@ -1,7 +1,7 @@
-import { F as FP$1, C as ComponentProps$1 } from './icons-1f5afc0c.js';
-export { I as Icon } from './icons-1f5afc0c.js';
+import { F as FP$1, C as ComponentProps$1 } from './icons-31ace3de.js';
+export { I as Icon } from './icons-31ace3de.js';
 import * as React from 'react';
-import React__default, { ReactNode } from 'react';
+import React__default, { ReactNode, CSSProperties } from 'react';
 
 type ButtonProps = Partial<React__default.ComponentProps<typeof FP$1>> & {
     /**
@@ -542,19 +542,50 @@ interface TextToSpeechComponentProps {
  */
 declare const TextToSpeech: React__default.FC<TextToSpeechComponentProps>;
 
-type DialogProps = {
-    isOpen?: boolean;
-    onOpen?: () => void;
-    onClose?: () => void;
-    onCancel?: () => void;
-    dialogTitle?: string;
-    showDialogHeader?: boolean;
-    isAlertDialog?: boolean;
+/**
+ * Defines the props for the Dialog component.
+ *
+ * @property {boolean} [showDialog] - Determines whether the dialog should be shown.
+ * @property {boolean} [isAlertDialog] - Determines whether the dialog should be displayed as an alert dialog.
+ * @property {() => void} [onClose] - A callback function to be called when the dialog is closed.
+ * @property {string} dialogTitle - The title of the dialog.
+ * @property {string} [dialogLabel] - An optional label for the dialog.
+ * @property {React.ReactNode} children - The content to be displayed inside the dialog.
+ * @property {() => void | Promise<void>} [onConfirm] - A callback function to be called when the user confirms the dialog.
+ * @property {string} [confirmLabel] - The label for the confirm button.
+ * @property {string} [cancelLabel] - The label for the cancel button.
+ * @property {string} [className] - An optional CSS class name to be applied to the dialog.
+ * @property {CSSProperties} [styles] - Optional inline styles to be applied to the dialog.
+ */
+type DialogModalProps = React__default.ComponentProps<typeof FP$1> & React__default.ComponentProps<"dialog"> & {
+    dialogTitle: string;
+    dialogLabel?: string;
     children: React__default.ReactNode;
+    showDialog?: boolean;
+    isAlertDialog?: boolean;
+    onClose?: () => void;
+    onConfirm?: () => void | Promise<void>;
+    confirmLabel?: string;
+    cancelLabel?: string;
+    className?: string;
+    hideFooter?: boolean;
+    styles?: CSSProperties;
 };
-declare const Dialog: {
-    ({ isOpen, dialogTitle, onOpen, onClose, onCancel, showDialogHeader, isAlertDialog, children, ...props }: DialogProps): JSX.Element;
-    displayName: string;
-};
+/**
+ * Renders a dialog modal component with customizable content and behavior.
+ *
+ * @param showDialog - Determines whether the dialog should be shown.
+ * @param isAlertDialog - Determines whether the dialog should be displayed as an alert dialog.
+ * @param onClose - A callback function to be called when the dialog is closed.
+ * @param dialogTitle - The title of the dialog.
+ * @param dialogLabel - An optional label for the dialog.
+ * @param children - The content to be displayed inside the dialog.
+ * @param onConfirm - A callback function to be called when the user confirms the dialog.
+ * @param confirmLabel - The label for the confirm button.
+ * @param cancelLabel - The label for the cancel button.
+ * @param className - An optional CSS class name to be applied to the dialog.
+ * @param styles - Optional inline styles to be applied to the dialog.
+ */
+declare const Dialog: React__default.FC<DialogModalProps>;
 
 export { Article, Aside, FP as Box, Breadcrumb, Button, Caption, Card, Details, Dialog, FP, Field, Footer, Header, Img, Input, Landmarks, Link, List, Main, Modal, Nav, NavItem, NavItemProps, NavList, NavListProps, NavProps, Popover, Section, RenderTable as TBL, Table, Tag, TagProps, Tbody, Td, Text, TextProps, TextToSpeech, Textarea, TextareaProps, Thead, Title, TitleProps, Link as To, Tr };