chore(color): update chip documentation

Author: matmkian

packages/site-demo/content/product/components/chip/react/default.tsx

@@ -6,7 +6,7 @@ export const App = ({ theme }: any) => (
     <>
         <Chip theme={theme}>Default</Chip>
 
-        <Chip before={<Icon icon={mdiEmail} size={Size.xs} />} theme={theme}>
+        <Chip before={<Icon icon={mdiEmail} size={Size.xs} theme={theme} />} theme={theme}>
             Default rich
         </Chip>
     </>

packages/site-demo/content/product/components/chip/react/dismissible.tsx

@@ -8,14 +8,14 @@ export const App = ({ theme }: any) => {
 
     return (
         <>
-            <Chip theme={theme} after={<Icon icon={mdiClose} size={Size.xs} />} onClick={onClick}>
+            <Chip theme={theme} after={<Icon icon={mdiClose} size={Size.xs} theme={theme} />} onClick={onClick}>
                 Dismissible
             </Chip>
 
             <Chip
                 theme={theme}
-                before={<Icon icon={mdiEmail} size={Size.xs} />}
-                after={<Icon icon={mdiClose} size={Size.xs} />}
+                before={<Icon icon={mdiEmail} size={Size.xs} theme={theme} />}
+                after={<Icon icon={mdiClose} size={Size.xs} theme={theme} />}
                 onClick={onClick}
             >
                 Dismissible rich

packages/site-demo/content/product/components/chip/react/filter.tsx

@@ -11,7 +11,7 @@ export const App = ({ theme }: any) => {
         <>
             <Chip
                 theme={theme}
-                after={<Icon icon={isSelected ? mdiCloseCircle : mdiMenuDown} size={Size.xs} />}
+                after={<Icon icon={isSelected ? mdiCloseCircle : mdiMenuDown} size={Size.xs} theme={theme} />}
                 isSelected={isSelected}
                 onClick={onClick}
                 onAfterClick={onAfterClick}
@@ -21,8 +21,8 @@ export const App = ({ theme }: any) => {
 
             <Chip
                 theme={theme}
-                before={<Icon icon={mdiFilterVariant} size={Size.xs} />}
-                after={<Icon icon={isSelected ? mdiCloseCircle : mdiMenuDown} size={Size.xs} />}
+                before={<Icon icon={mdiFilterVariant} size={Size.xs} theme={theme} />}
+                after={<Icon icon={isSelected ? mdiCloseCircle : mdiMenuDown} size={Size.xs} theme={theme} />}
                 isSelected={isSelected}
                 onClick={onClick}
                 onAfterClick={onAfterClick}

packages/site-demo/content/product/components/chip/react/small.tsx

@@ -12,11 +12,16 @@ export const App = ({ theme }: any) => {
                 Small
             </Chip>
 
-            <Chip theme={theme} size={Size.s} before={<Icon icon={mdiEmail} size={Size.xxs} />}>
+            <Chip theme={theme} size={Size.s} before={<Icon icon={mdiEmail} size={Size.xxs} theme={theme} />}>
                 Small rich
             </Chip>
 
-            <Chip theme={theme} size={Size.s} after={<Icon icon={mdiClose} size={Size.xxs} />} onClick={onClick}>
+            <Chip
+                theme={theme}
+                size={Size.s}
+                after={<Icon icon={mdiClose} size={Size.xxs} theme={theme} />}
+                onClick={onClick}
+            >
                 Small dismissible
             </Chip>
         </>