Merge pull request #8 from themesberg/feat/control-stroke-width

feat: `strokeWidth` override
themesberg · Jun 25, 2024 · a0adad6 · a0adad6
2 parents 67a3b07 + 4f4905e
commit a0adad6
Show file tree

Hide file tree

Showing 287 changed files with 24 additions and 318 deletions.
diff --git a/.changeset/little-cooks-return.md b/.changeset/little-cooks-return.md
@@ -0,0 +1,5 @@
+---
+"flowbite-react-icons": patch
+---
+
+allow `strokeWidth` management from within the icon itself + `FlowbiteIcons` context
diff --git a/bun.lockb b/bun.lockb
diff --git a/package.json b/package.json
@@ -62,27 +62,27 @@
   },
   "devDependencies": {
     "@changesets/changelog-github": "0.5.0",
-    "@changesets/cli": "2.27.1",
+    "@changesets/cli": "2.27.6",
     "@ianvs/prettier-plugin-sort-imports": "4.2.1",
     "@rollup/plugin-alias": "5.1.0",
     "@svgr/cli": "8.1.0",
-    "@types/bun": "1.0.8",
-    "@types/react": "18.2.67",
-    "@typescript-eslint/eslint-plugin": "7.7.0",
-    "@typescript-eslint/parser": "7.7.0",
+    "@types/bun": "1.1.5",
+    "@types/react": "18.3.3",
+    "@typescript-eslint/eslint-plugin": "7.13.1",
+    "@typescript-eslint/parser": "7.13.1",
     "clean-package": "2.2.0",
     "eslint": "8.57.0",
     "eslint-config-prettier": "9.1.0",
-    "eslint-plugin-react": "7.34.1",
+    "eslint-plugin-react": "7.34.3",
     "ora": "8.0.1",
-    "prettier": "3.2.5",
-    "prettier-plugin-packagejson": "2.4.12",
-    "rimraf": "5.0.5",
-    "rollup": "4.13.0",
-    "rollup-plugin-dts": "6.1.0",
+    "prettier": "3.3.2",
+    "prettier-plugin-packagejson": "2.5.0",
+    "rimraf": "5.0.7",
+    "rollup": "4.18.0",
+    "rollup-plugin-dts": "6.1.1",
     "rollup-plugin-esbuild": "6.1.1",
     "rollup-plugin-use-client": "1.4.0",
-    "typescript": "5.4.2"
+    "typescript": "5.5.2"
   },
   "peerDependencies": {
     "react": ">=16",

diff --git a/src/components/base-icon.tsx b/src/components/base-icon.tsx
@@ -5,8 +5,6 @@ import type { FlowbiteIconProps } from "../types";
 export const BaseIcon = forwardRef<SVGSVGElement, FlowbiteIconProps>(
   (props, ref) => {
     const {
-      xmlns = "http://www.w3.org/2000/svg",
-      viewBox = "0 0 24 24",
       width,
       height,
       // custom
@@ -35,8 +33,6 @@ export const BaseIcon = forwardRef<SVGSVGElement, FlowbiteIconProps>(
     return (
       <svg
         ref={ref}
-        xmlns={xmlns}
-        viewBox={viewBox}
         width={width ?? size ?? theme.width ?? theme.size}
         height={height ?? size ?? theme.height ?? theme.size}
         {...mergedProps}

diff --git a/src/icons/outline/arrows/angle-down.tsx b/src/icons/outline/arrows/angle-down.tsx
@@ -11,7 +11,6 @@ const SvgAngleDown = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="m19 9-7 7-7-7"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/angle-left.tsx b/src/icons/outline/arrows/angle-left.tsx
@@ -11,7 +11,6 @@ const SvgAngleLeft = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="m15 19-7-7 7-7"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/angle-right.tsx b/src/icons/outline/arrows/angle-right.tsx
@@ -11,7 +11,6 @@ const SvgAngleRight = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="m9 5 7 7-7 7"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/angle-up.tsx b/src/icons/outline/arrows/angle-up.tsx
@@ -11,7 +11,6 @@ const SvgAngleUp = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="m5 15 7-7 7 7"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/arrow-down-to-bracket.tsx b/src/icons/outline/arrows/arrow-down-to-bracket.tsx
@@ -11,7 +11,6 @@ const SvgArrowDownToBracket = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="M4 15v2a3 3 0 0 0 3 3h10a3 3 0 0 0 3-3v-2m-8 1V4m0 12-4-4m4 4 4-4"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/arrow-down.tsx b/src/icons/outline/arrows/arrow-down.tsx
@@ -11,7 +11,6 @@ const SvgArrowDown = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="M12 19V5m0 14-4-4m4 4 4-4"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/arrow-left-to-bracket.tsx b/src/icons/outline/arrows/arrow-left-to-bracket.tsx
@@ -11,7 +11,6 @@ const SvgArrowLeftToBracket = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="M16 12H4m12 0-4 4m4-4-4-4m3-4h2a3 3 0 0 1 3 3v10a3 3 0 0 1-3 3h-2"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/arrow-left.tsx b/src/icons/outline/arrows/arrow-left.tsx
@@ -11,7 +11,6 @@ const SvgArrowLeft = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="M5 12h14M5 12l4-4m-4 4 4 4"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/arrow-right-alt.tsx b/src/icons/outline/arrows/arrow-right-alt.tsx
@@ -11,7 +11,6 @@ const SvgArrowRightAlt = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="M16.153 19 21 12l-4.847-7H3l4.848 7L3 19z"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/arrow-right-to-bracket.tsx b/src/icons/outline/arrows/arrow-right-to-bracket.tsx
@@ -11,7 +11,6 @@ const SvgArrowRightToBracket = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="M20 12H8m12 0-4 4m4-4-4-4M9 4H7a3 3 0 0 0-3 3v10a3 3 0 0 0 3 3h2"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/arrow-right.tsx b/src/icons/outline/arrows/arrow-right.tsx
@@ -11,7 +11,6 @@ const SvgArrowRight = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="M19 12H5m14 0-4 4m4-4-4-4"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/arrow-sort-letters.tsx b/src/icons/outline/arrows/arrow-sort-letters.tsx
@@ -11,7 +11,6 @@ const SvgArrowSortLetters = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="M7 4v16M7 4l3 3M7 4 4 7m9-3h6l-6 6h6m-6.5 10 3.5-7 3.5 7M14 18h4"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/arrow-up-down.tsx b/src/icons/outline/arrows/arrow-up-down.tsx
@@ -11,7 +11,6 @@ const SvgArrowUpDown = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="M8 20V7m0 13-4-4m4 4 4-4m4-12v13m0-13 4 4m-4-4-4 4"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/arrow-up-from-bracket.tsx b/src/icons/outline/arrows/arrow-up-from-bracket.tsx
@@ -11,7 +11,6 @@ const SvgArrowUpFromBracket = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="M4 15v2a3 3 0 0 0 3 3h10a3 3 0 0 0 3-3v-2M12 4v12m0-12 4 4m-4-4L8 8"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/arrow-up-right-down-left.tsx b/src/icons/outline/arrows/arrow-up-right-down-left.tsx
@@ -11,7 +11,6 @@ const SvgArrowUpRightDownLeft = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="M16 4h4m0 0v4m0-4-5 5M8 20H4m0 0v-4m0 4 5-5"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/arrow-up.tsx b/src/icons/outline/arrows/arrow-up.tsx
@@ -11,7 +11,6 @@ const SvgArrowUp = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="M12 6v13m0-13 4 4m-4-4-4 4"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/arrows-repeat-count.tsx b/src/icons/outline/arrows/arrows-repeat-count.tsx
@@ -11,7 +11,6 @@ const SvgArrowsRepeatCount = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="m16 4 3 3H5v3m3 10-3-3h14v-3m-9-2.5 2-1.5v4"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/arrows-repeat.tsx b/src/icons/outline/arrows/arrows-repeat.tsx
@@ -11,7 +11,6 @@ const SvgArrowsRepeat = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="m16 10 3-3m0 0-3-3m3 3H5v3m3 4-3 3m0 0 3 3m-3-3h14v-3"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/caret-down.tsx b/src/icons/outline/arrows/caret-down.tsx
@@ -11,7 +11,6 @@ const SvgCaretDown = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="M7.119 8h9.762a1 1 0 0 1 .772 1.636l-4.881 5.927a1 1 0 0 1-1.544 0l-4.88-5.927A1 1 0 0 1 7.118 8Z"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/caret-left.tsx b/src/icons/outline/arrows/caret-left.tsx
@@ -11,7 +11,6 @@ const SvgCaretLeft = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="M16 16.881V7.119a1 1 0 0 0-1.636-.772l-5.927 4.881a1 1 0 0 0 0 1.544l5.927 4.88a1 1 0 0 0 1.636-.77Z"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/caret-right.tsx b/src/icons/outline/arrows/caret-right.tsx
@@ -11,7 +11,6 @@ const SvgCaretRight = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="M8 16.881V7.119a1 1 0 0 1 1.636-.772l5.927 4.881a1 1 0 0 1 0 1.544l-5.927 4.88A1 1 0 0 1 8 16.882Z"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/caret-sort.tsx b/src/icons/outline/arrows/caret-sort.tsx
@@ -11,7 +11,6 @@ const SvgCaretSort = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="m8 10 4-6 4 6zm8 4-4 6-4-6z"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/caret-up.tsx b/src/icons/outline/arrows/caret-up.tsx
@@ -11,7 +11,6 @@ const SvgCaretUp = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="M16.881 16H7.119a1 1 0 0 1-.772-1.636l4.881-5.927a1 1 0 0 1 1.544 0l4.88 5.927a1 1 0 0 1-.77 1.636Z"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/chevron-double-down.tsx b/src/icons/outline/arrows/chevron-double-down.tsx
@@ -11,7 +11,6 @@ const SvgChevronDoubleDown = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="m8 7 4 4 4-4m-8 6 4 4 4-4"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/chevron-double-left.tsx b/src/icons/outline/arrows/chevron-double-left.tsx
@@ -11,7 +11,6 @@ const SvgChevronDoubleLeft = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="m17 16-4-4 4-4m-6 8-4-4 4-4"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/chevron-double-right.tsx b/src/icons/outline/arrows/chevron-double-right.tsx
@@ -11,7 +11,6 @@ const SvgChevronDoubleRight = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="m7 16 4-4-4-4m6 8 4-4-4-4"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/chevron-double-up.tsx b/src/icons/outline/arrows/chevron-double-up.tsx
@@ -11,7 +11,6 @@ const SvgChevronDoubleUp = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="m16 17-4-4-4 4m8-6-4-4-4 4"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/chevron-down.tsx b/src/icons/outline/arrows/chevron-down.tsx
@@ -11,7 +11,6 @@ const SvgChevronDown = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="m8 10 4 4 4-4"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/chevron-left.tsx b/src/icons/outline/arrows/chevron-left.tsx
@@ -11,7 +11,6 @@ const SvgChevronLeft = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="m14 8-4 4 4 4"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/chevron-right.tsx b/src/icons/outline/arrows/chevron-right.tsx
@@ -11,7 +11,6 @@ const SvgChevronRight = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="m10 16 4-4-4-4"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/chevron-sort.tsx b/src/icons/outline/arrows/chevron-sort.tsx
@@ -11,7 +11,6 @@ const SvgChevronSort = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="m8 15 4 4 4-4m0-6-4-4-4 4"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/chevron-up.tsx b/src/icons/outline/arrows/chevron-up.tsx
@@ -11,7 +11,6 @@ const SvgChevronUp = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="m16 14-4-4-4 4"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/compress.tsx b/src/icons/outline/arrows/compress.tsx
@@ -11,7 +11,6 @@ const SvgCompress = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="M4 8h4V4m12 4h-4V4M4 16h4v4m12-4h-4v4"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/expand.tsx b/src/icons/outline/arrows/expand.tsx
@@ -9,7 +9,6 @@ const SvgExpand = forwardRef<SVGSVGElement, PropsWithoutRef<FlowbiteIconProps>>(
         stroke="currentColor"
         strokeLinecap="round"
         strokeLinejoin="round"
-        strokeWidth={2}
         d="M8 4H4m0 0v4m0-4 5 5m7-5h4m0 0v4m0-4-5 5M8 20H4m0 0v-4m0 4 5-5m7 5h4m0 0v-4m0 4-5-5"
       />
     </BaseIcon>

diff --git a/src/icons/outline/arrows/forward.tsx b/src/icons/outline/arrows/forward.tsx
@@ -11,7 +11,6 @@ const SvgForward = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="M4.248 19C3.22 15.77 5.275 8.232 12.466 8.232V6.079a1.025 1.025 0 0 1 1.644-.862l5.479 4.307a1.108 1.108 0 0 1 0 1.723l-5.48 4.307a1.026 1.026 0 0 1-1.643-.861v-2.154C5.275 13.616 4.248 19 4.248 19"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/minimize.tsx b/src/icons/outline/arrows/minimize.tsx
@@ -11,7 +11,6 @@ const SvgMinimize = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="M5 9h4m0 0V5m0 4L4 4m15 5h-4m0 0V5m0 4 5-5M5 15h4m0 0v4m0-4-5 5m15-5h-4m0 0v4m0-4 5 5"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/redo.tsx b/src/icons/outline/arrows/redo.tsx
@@ -9,7 +9,6 @@ const SvgRedo = forwardRef<SVGSVGElement, PropsWithoutRef<FlowbiteIconProps>>(
         stroke="currentColor"
         strokeLinecap="round"
         strokeLinejoin="round"
-        strokeWidth={2}
         d="M21 9H8a5 5 0 0 0 0 10h9m4-10-4-4m4 4-4 4"
       />
     </BaseIcon>

diff --git a/src/icons/outline/arrows/refresh.tsx b/src/icons/outline/arrows/refresh.tsx
@@ -11,7 +11,6 @@ const SvgRefresh = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="M17.651 7.65a7.131 7.131 0 0 0-12.68 3.15M18.001 4v4h-4m-7.652 8.35a7.13 7.13 0 0 0 12.68-3.15M6 20v-4h4"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/reply-all.tsx b/src/icons/outline/arrows/reply-all.tsx
@@ -11,7 +11,6 @@ const SvgReplyAll = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="M8.757 6 3.24 10.95a1.05 1.05 0 0 0 0 1.549l5.611 5.088m5.73-3.214v1.615a.948.948 0 0 1-1.524.845l-5.108-4.251a1.1 1.1 0 0 1 0-1.646l5.108-4.251a.95.95 0 0 1 1.524.846v1.7c3.312 0 6 2.979 6 6.654v1.329a.7.7 0 0 1-1.345.353 5.17 5.17 0 0 0-4.652-3.191z"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/reply.tsx b/src/icons/outline/arrows/reply.tsx
@@ -9,7 +9,6 @@ const SvgReply = forwardRef<SVGSVGElement, PropsWithoutRef<FlowbiteIconProps>>(
         stroke="currentColor"
         strokeLinecap="round"
         strokeLinejoin="round"
-        strokeWidth={2}
         d="M14.5 8.046H11V6.119c0-.921-.9-1.446-1.524-.894l-5.108 4.49a1.2 1.2 0 0 0 0 1.739l5.108 4.49c.624.556 1.524.027 1.524-.893v-1.928h2a3.023 3.023 0 0 1 3 3.046V19a5.593 5.593 0 0 0-1.5-10.954"
       />
     </BaseIcon>

diff --git a/src/icons/outline/arrows/share-all.tsx b/src/icons/outline/arrows/share-all.tsx
@@ -11,7 +11,6 @@ const SvgShareAll = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="m15.141 6 5.518 4.95a1.05 1.05 0 0 1 0 1.549l-5.612 5.088m-6.154-3.214v1.615a.95.95 0 0 0 1.525.845l5.108-4.251a1.1 1.1 0 0 0 0-1.646l-5.108-4.251a.95.95 0 0 0-1.525.846v1.7c-3.312 0-6 2.979-6 6.654v1.329a.7.7 0 0 0 1.344.353 5.17 5.17 0 0 1 4.652-3.191z"
     />
   </BaseIcon>

diff --git a/src/icons/outline/arrows/sort-horizontal.tsx b/src/icons/outline/arrows/sort-horizontal.tsx
@@ -11,7 +11,6 @@ const SvgSortHorizontal = forwardRef<
       stroke="currentColor"
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={2}
       d="M4 16h13M4 16l4-4m-4 4 4 4M20 8H7m13 0-4 4m4-4-4-4"
     />
   </BaseIcon>