♻️ Refacto chips

packages/react/components/chips/Chips.tsx

@@ -1,9 +1,9 @@
-import React from "react"
-import { is } from "@/services"
-import { ChipsProps } from "./ChipsProps"
-import clsx from "clsx"
-import { hashClass } from "@/helpers"
-import { useTrilogyContext } from "@/context"
+import React from 'react'
+import { is } from '@/services'
+import { ChipsProps } from './ChipsProps'
+import clsx from 'clsx'
+import { hashClass } from '@/helpers'
+import { useTrilogyContext } from '@/context'
 
 /**
  * Chips Component - has to be in a ChipsList component
@@ -17,38 +17,13 @@ import { useTrilogyContext } from "@/context"
  * @param testId {string} Test Id for Test Integration
  * @param others
  */
-const Chips = ({
-  className,
-  onClick,
-  children,
-  active,
-  disabled,
-  id,
-  ...others
-}: ChipsProps): JSX.Element => {
+const Chips = ({ className, children, active = false, disabled, id, ...others }: ChipsProps): JSX.Element => {
   const { styled } = useTrilogyContext()
 
-  const classes = hashClass(
-    styled,
-    clsx(
-      "chips",
-      active && is("active"),
-      className
-    )
-  )
+  const classes = hashClass(styled, clsx('chips', active && is('active'), className))
 
   return (
-    <button
-      {...{ disabled: disabled }}
-      aria-disabled={disabled}
-      id={id}
-      aria-pressed={!!active}
-      className={classes}
-      onClick={(e) => {
-        onClick?.(e)
-      }}
-      {...others}
-    >
+    <button disabled={disabled} aria-disabled={disabled} id={id} aria-pressed={active} className={classes} {...others}>
       {children}
     </button>
   )

packages/react/components/chips/ChipsProps.ts

@@ -6,7 +6,7 @@ import { CommonProps } from '../../objects/facets/CommonProps'
  * Chips Interface
  */
 export interface ChipsProps extends Clickable, Accessibility, Dev, CommonProps {
-  children: string | React.ReactNode
+  children: React.ReactNode
   onClick?: ClickEvent
   active?: boolean
   disabled?: boolean

packages/react/components/chips/list/ChipsListProps.ts

@@ -4,7 +4,7 @@
 import { CommonProps } from '../../../objects/facets/CommonProps'
 
 export interface ChipsListProps extends CommonProps {
-  children?: React.ReactNode | React.ReactElement
+  children?: React.ReactNode
   multiple?: boolean
   scrollable?: boolean
 }