PR feedback

homebound-team · Aug 6, 2024 · e037c5a · e037c5a
1 parent de4a8b0
commit e037c5a
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 9 deletions.
diff --git a/src/components/Chip.stories.tsx b/src/components/Chip.stories.tsx
@@ -59,13 +59,24 @@ export function WithIcon() {
   );
 }
 
-export function WithStartAdorment() {
+export function WithCustomLabel() {
   return (
-    <div css={Css.wPx(200).$}>
-      <Chip startAdornment={<span css={Css.smBd.$}>K</span>} text="Kitchen" />
+    <div css={Css.wPx(200).df.gap1.$}>
+      <Chip
+        text={
+          <span css={Css.sm.df.gap1.$}>
+            <span css={Css.smBd.$}>K</span>
+            Kitchen
+          </span>
+        }
+      />
       <Chip
-        startAdornment={<span css={Css.smBd.$}>A</span>}
-        text="A very long chip name that will eventually truncate"
+        text={
+          <span css={Css.sm.df.gap1.$}>
+            <span css={Css.smBd.$}>B</span>
+            Bedroom
+          </span>
+        }
       />
     </div>
   );

diff --git a/src/components/Chip.tsx b/src/components/Chip.tsx
@@ -20,9 +20,8 @@ export const ChipTypes: Record<ChipType, ChipType> = {
 };
 
 export interface ChipProps<X> {
-  text: string;
+  text: ReactNode;
   title?: ReactNode;
-  startAdornment?: ReactNode;
   xss?: X;
   type?: ChipType;
   compact?: boolean;
@@ -35,7 +34,7 @@ export function Chip<X extends Only<Xss<Margin | "color" | "backgroundColor">, X
   ...props
 }: ChipProps<X>) {
   const { fieldProps } = usePresentationContext();
-  const { text, title, xss = {}, compact = fieldProps?.compact, icon, startAdornment } = props;
+  const { text, title, xss = {}, compact = fieldProps?.compact, icon } = props;
   const tid = useTestIds(props, "chip");
 
   return maybeTooltip({
@@ -51,7 +50,6 @@ export function Chip<X extends Only<Xss<Margin | "color" | "backgroundColor">, X
         {...tid}
       >
         {icon && <Icon icon={icon} inc={2} xss={Css.fs0.$} />}
-        {startAdornment}
         <span css={Css.lineClamp1.wbba.$}>{text}</span>
       </span>
     ),