Center tag icon (#523)

* Center tag icon

* Update icons/tag.svg

Co-authored-by: Eric Fennis <eric.fennis@gmail.com>

Co-authored-by: Eric Fennis <eric.fennis@gmail.com>

icons/baseline.svg

@@ -0,0 +1,15 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M4 20h16" />
+  <path d="M6 16l6-12 6 12" />
+  <path d="M8 12h8" />
+</svg>

icons/keyboard.svg

@@ -0,0 +1,21 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <rect x="2" y="4" width="20" height="16" rx="2" ry="2" />
+  <path d="M6 8h.001" />
+  <path d="M10 8h.001" />
+  <path d="M14 8h.001" />
+  <path d="M18 8h.001" />
+  <path d="M8 12h.001" />
+  <path d="M12 12h.001" />
+  <path d="M16 12h.001" />
+  <path d="M7 16h10" />
+</svg>

icons/locate-off.svg

@@ -0,0 +1,19 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <line x1="2" x2="5" y1="12" y2="12" />
+  <line x1="19" x2="22" y1="12" y2="12" />
+  <line x1="12" x2="12" y1="2" y2="5" />
+  <line x1="12" x2="12" y1="19" y2="22" />
+  <path d="M7.11 7.11C5.83 8.39 5 10.1 5 12c0 3.87 3.13 7 7 7 1.9 0 3.61-.83 4.89-2.11" />
+  <path d="M18.71 13.96c.19-.63.29-1.29.29-1.96 0-3.87-3.13-7-7-7-.67 0-1.33.1-1.96.29" />
+  <line x1="2" x2="22" y1="2" y2="22" />
+</svg>

icons/tag.svg

@@ -9,6 +9,6 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <path d="M20.59 13.41l-7.17 7.17a2 2 0 01-2.83 0L2 12V2h10l8.59 8.59a2 2 0 010 2.82z" />
-  <line x1="7" y1="7" x2="7.01" y2="7" />
+  <path d="M2 12V2h10l9.44 9.44a2 2 0 0 1 0 2.82l-7.18 7.18a2 2 0 0 1-2.82 0L2 12Z" />
+  <path d="M7 7h.01" />
 </svg>

icons/waves.svg

@@ -0,0 +1,18 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M2 6c.6.5 1.2 1 2.5 1C7 7 7 5 9.5 5c1.3 0 1.9.5 2.5 1" />
+  <path d="M2 18c.6.5 1.2 1 2.5 1 2.5 0 2.5-2 5-2 1.3 0 1.9.5 2.5 1" />
+  <path d="M2 12c.6.5 1.2 1 2.5 1 2.5 0 2.5-2 5-2 1.3 0 1.9.5 2.5 1" />
+  <path d="M12 6c.6.5 1.2 1 2.5 1 2.5 0 2.5-2 5-2 1.3 0 1.9.5 2.5 1" />
+  <path d="M12 18c.6.5 1.2 1 2.5 1 2.5 0 2.5-2 5-2 1.3 0 1.9.5 2.5 1" />
+  <path d="M12 12c.6.5 1.2 1 2.5 1 2.5 0 2.5-2 5-2 1.3 0 1.9.5 2.5 1" />
+</svg>

packages/lucide-angular/package.json

@@ -1,7 +1,7 @@
 {
   "name": "lucide-angular",
   "description": "A Lucide icon library package for Angular applications",
-  "version": "0.17.6",
+  "version": "0.17.11",
   "author": "SMAH1",
   "license": "ISC",
   "homepage": "https://lucide.dev",

packages/lucide-figma/manifest.json

@@ -9,9 +9,18 @@
     "worker": "dist/src/worker/worker.html"
   },
   "parameterOnly": false,
-  "parameters": [{
-    "name": "Icon",
-    "key": "icon-name",
-    "description": "Enter the name of the icon you want to insert."
-  }]
+  "parameters": [
+    {
+      "name": "Icon",
+      "key": "icon-name",
+      "description": "Enter the name of the icon you want to insert."
+    },
+    {
+      "name": "Size",
+      "key": "size",
+      "description": "Enter the size of the icon.",
+      "allowFreeform": true,
+      "optional": true
+    }
+  ]
 }

packages/lucide-figma/src/components/EditBar/EditBar.tsx

@@ -0,0 +1,5 @@
+const EditBar = () => {
+
+}
+
+export default EditBar

packages/lucide-figma/src/components/Menu/Menu.scss

@@ -0,0 +1,30 @@
+.menu {
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+  height: 40px;
+  line-height: 40px;
+  border-bottom: 1px solid var(--color-border, #e5e5e5);
+  justify-content: flex-start;
+}
+
+.menu-item {
+  font-weight: 500;
+  font-size: 11px;
+  color: var(--color-text-tertiary, #b3b3b3);
+  padding: 0 8px;
+  text-transform: capitalize;
+  cursor: pointer;
+
+  &.active {
+    color: var(--color-text, #333333);
+  }
+
+  &:first-child {
+    padding-left: 16px;
+  }
+
+  &:last-child {
+    padding-right: 16px;
+  }
+}

packages/lucide-figma/src/components/Menu/Menu.tsx

@@ -0,0 +1,23 @@
+import { useState } from 'react'
+import './Menu.scss'
+
+interface MenuProps {
+  page: string
+  setPage: (page:string) => void
+}
+
+const menuItems = ['icons', 'info']
+
+const Menu = ({page, setPage = (page) => {}}: MenuProps) => {
+  return (
+    <nav className="menu">
+      {  menuItems.map((menuItem) => (
+         <div className={`menu-item ${page === menuItem ? 'active' : null }`} onClick={() => setPage(menuItem)}>
+          {menuItem}
+        </div>
+      )) }
+    </nav>
+  )
+}
+
+export default Menu

packages/lucide-figma/src/components/Menu/index.ts

@@ -0,0 +1 @@
+export { default } from './Menu'

packages/lucide-figma/src/components/SearchInput/SearchInput.scss

@@ -1,9 +1,11 @@
 .search-input {
+  position: relative;
+  display: flex;
+  align-items: center;
+
   .icon {
     position: absolute;
-    top: 0;
-    left: 0;
-    padding: 4px;
+    left: 16px;
   }
   input {
     width: 100%;

packages/lucide-figma/src/components/icons/SearchIcon.tsx

@@ -1,24 +1,22 @@
 import { createElement, forwardRef } from 'react'
 
-const SearchIcon = forwardRef((props: any, ref) => createElement(
-    'svg',
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      width: 32,
-      height: 32,
-      clipRule: 'evenodd',
-      fillRule: 'evenodd',
-      ref,
-      ...props,
-    },
-    [
-      createElement(
-        'path', {
-          d: 'm20 15c0 2.7614-2.2386 5-5 5s-5-2.2386-5-5 2.2386-5 5-5 5 2.2386 5 5zm-1.1256 4.5815c-1.0453.8849-2.3975 1.4185-3.8744 1.4185-3.3137 0-6-2.6863-6-6s2.6863-6 6-6 6 2.6863 6 6c0 1.4769-.5336 2.8291-1.4185 3.8744l4.2721 4.272-.7072.7072z',
-          key: 'path'
-        }
-      )
-    ]
-  ))
+
+const SearchIcon = (props: any) => (
+  <svg
+    width="11"
+    height="11"
+    viewBox="0 0 11 11"
+    xmlns="http://www.w3.org/2000/svg"
+    fill="currentColor"
+    {...props}
+  >
+    <path
+      d="M6.453 7.16C5.776 7.687 4.924 8 4 8 1.79 8 0 6.21 0 4c0-2.21 1.79-4 4-4 2.21 0 4 1.79 4 4 0 .924-.314 1.776-.84 2.453l3.194 3.193-.708.707L6.453 7.16zM7 4c0 1.657-1.343 3-3 3-1.657 0-3-1.343-3-3 0-1.657 1.343-3 3-3 1.657 0 3 1.343 3 3z"
+      fillRule="evenodd"
+      fillOpacity="1"
+      stroke="none"
+    />
+  </svg>
+)
 
 export default SearchIcon

packages/lucide-figma/src/interface/interface.scss

@@ -9,6 +9,17 @@
       format('woff');
 }
 
+@font-face {
+  font-family: Inter;
+  font-style: normal;
+  font-weight: 500;
+  font-display: swap;
+  src: url('https://rsms.me/inter/font-files/Inter-Medium.woff2?v=3.9')
+      format('woff2'),
+    url('https://rsms.me/inter/font-files/Inter-Medium.woff?v=3.9')
+      format('woff');
+}
+
 :root {
   --color-blue: #18a0fb;
   --color-black: #333;
@@ -47,3 +58,48 @@ footer {
     color: inherit;
   }
 }
+
+.floating {
+  position: absolute;
+  bottom: -10px;
+  left: 0;
+  padding: 10px;
+  background: blue;
+}
+
+.info-page {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 24px;
+}
+
+.lucide-logo {
+  width: 160px;
+}
+
+.version {
+  margin-top: 8px;
+  padding: 8px;
+  font-weight: bold;
+  font-size: 18px;
+  color: rgba(0, 0, 0, 0.5);
+}
+
+.link-list {
+  width: 160px;
+  margin: 0 auto;
+  padding-top: 24px;
+}
+
+.info-link {
+  color: var(--color-blue);
+  display: block;
+  padding: 2px 0;
+  text-decoration: none;
+
+  &:hover {
+    text-decoration: underline;
+  }
+}

packages/lucide-figma/src/interface/interface.tsx

@@ -1,15 +1,17 @@
 import { useEffect, useMemo, useState } from 'react'
-import { createReactComponent } from 'lucide-react'
 import ReactDOM from 'react-dom'
+import * as views from '../views'
+
+type Views = typeof views
 
-import IconButton from '../components/IconButton'
-import SearchInput from '../components/SearchInput'
 import useSearch, { Icon } from '../hooks/useSearch'
 
 import { getIcons } from '../api/fetchIcons'
 import './interface.scss'
+import Menu from '../components/Menu'
 
 function App() {
+  const [page, setPage] = useState('icons')
   const [query, setQuery] = useState('')
   const [icons, setIcons] = useState<Icon[]>([])
   const [tags, setTags] = useState({})
@@ -33,33 +35,20 @@ function App() {
     return null
   }
 
+  const View = views?.[page as keyof Views] ?? views.icons
+
   return (
     <div>
-      <SearchInput
-        value={query}
-        iconCount={icons.length}
-        onChange={(event)  => setQuery(event.target.value)}
+      <Menu page={page} setPage={setPage}/>
+      <View
+        {...{
+          query,
+          setQuery,
+          searchResults,
+          icons,
+          version
+        }}
       />
-      <main>
-        <div className='icon-grid'>
-          {searchResults.map(([name, iconNode] :any) => (
-            <IconButton
-              name={name}
-              key={name}
-              component={createReactComponent(name, iconNode)}
-            />
-          ))}
-        </div>
-        <footer>
-          <a
-            href="https://lucide.dev"
-            target="_blank"
-            className='footer-link'
-          >
-            Lucide v{version}
-          </a>
-        </footer>
-      </main>
     </div>
   )
 }

packages/lucide-figma/src/main.ts

@@ -5,6 +5,12 @@ figma.showUI(__uiFiles__.worker, { visible: false })
 
 let cachedIcons: LucideIcons
 
+type InsertableNodes = FrameNode | GroupNode
+
+function isInsertableNode (node: SceneNode): node is InsertableNodes {
+  return ['FRAME', 'GROUP'].includes(node.type)
+}
+
 const setResults = ({result, query, lucideIcons} : { result: SuggestionResults, query: string, lucideIcons: LucideIcons }) => {
   const icons = Object.entries(lucideIcons.iconNodes);
 
@@ -16,33 +22,65 @@ const setResults = ({result, query, lucideIcons} : { result: SuggestionResults,
   result.setSuggestions(suggestions)
 }
 
+// const styles = figma.getLocalPaintStyles();
+// const styleNames = styles.map((style) => style.name);
+// console.log(styleNames);
+
 figma.parameters.on('input', async ({ parameters, key, query, result }) => {
   if (key === 'icon-name') {
-    console.log('typ tpy', query);
     cachedIcons = await figma.clientStorage.getAsync(`lucide-icons`)
-    console.log('cachedIcons', cachedIcons);
 
     if(cachedIcons && cachedIcons.iconNodes && cachedIcons.tags) {
       setResults({result, query, lucideIcons: cachedIcons})
     }
   }
+  if(key === 'size') {
+    const iconSizes = [24,36,48,72]
+    result.setSuggestions(iconSizes.map((size)=>({
+      name: size.toString(),
+      data: size
+    })))
+  }
 })
 
-const drawIcon = ({icon: {name, svg}}: any) => {
+const drawIcon = ({icon: {name, svg, size }}: any) => {
   const min = 0
   const max = 100
   const randomPosition = () => Math.floor(Math.random() * (max - min + 1) + min)
+
   const icon = figma.createNodeFromSvg(svg)
+  icon.setPluginData('isLucideIcon', 'true')
+  icon.setPluginData('iconName', name)
+
+  const pluginData = icon.getPluginData('isLucideIcon')
 
   icon.name = name
   icon.x = Math.round(figma.viewport.center.x + randomPosition())
   icon.y = Math.round(figma.viewport.center.y + randomPosition())
+
+  if(figma.currentPage.selection.length) {
+    let currentSelection = figma.currentPage.selection[0]
+    const isLucideIcon = currentSelection.getPluginData('isLucideIcon')
+
+    // if(isLucideIcon && currentSelection?.parent) {
+    //   return
+    //   // currentSelection = currentSelection.parent as SceneNode
+    // }
+
+    if(!isLucideIcon && isInsertableNode(currentSelection)) {
+      icon.x = currentSelection.type === 'GROUP' ? currentSelection.x : 0
+      icon.y = currentSelection.type === 'GROUP' ? currentSelection.y : 0
+
+      currentSelection.appendChild(icon)
+    }
+  }
+
   figma.currentPage.selection = [icon]
 
   // lock children
-  icon.children.forEach((vectorNode, key) => {
-    icon.children[key].locked = true
-  });
+  // icon.children.forEach((vectorNode, key) => {
+  //   icon.children[key].locked = true
+  // });
 }
 
 const setCachedIcons = async (pluginMessage: any) => {
@@ -66,7 +104,6 @@ const getCachedIcons = async () => {
 getCachedIcons()
 
 figma.ui.onmessage = (event) => {
-  console.log(event, 'main');
   switch (event.type) {
     case "drawIcon":
       drawIcon(event)
@@ -90,7 +127,12 @@ figma.ui.onmessage = (event) => {
 
 figma.on('run', event => {
   if(event.parameters) {
-    figma.ui.postMessage({ type: 'getSvg', iconName: event.parameters['icon-name'], cachedIcons })
+    figma.ui.postMessage({
+      type: 'getSvg',
+      iconName: event.parameters['icon-name'],
+      size: event.parameters['size'],
+      cachedIcons
+    })
   } else {
     figma.showUI(__uiFiles__.interface, { width: 300, height: 400 })
   }

packages/lucide-figma/src/views/Icons.tsx

@@ -0,0 +1,53 @@
+import { createReactComponent } from 'lucide-react'
+
+import IconButton from '../components/IconButton'
+import SearchInput from '../components/SearchInput'
+import { Icon } from '../hooks/useSearch'
+
+interface PageProps {
+  query: string
+  setQuery: (query:string) => void
+  searchResults: Icon[]
+  icons: Icon[]
+  version: string
+}
+
+const Icons = ({
+  query,
+  setQuery,
+  searchResults,
+  icons,
+  version
+}: PageProps) => {
+  return (
+    <>
+      <SearchInput
+        value={query}
+        iconCount={icons.length}
+        onChange={(event)  => setQuery(event.target.value)}
+      />
+        <main>
+          <div className='icon-grid'>
+            {searchResults.map(([name, iconNode] :any) => (
+              <IconButton
+                name={name}
+                key={name}
+                component={createReactComponent(name, iconNode)}
+              />
+            ))}
+          </div>
+          <footer>
+            <a
+              href="https://lucide.dev"
+              target="_blank"
+              className='footer-link'
+            >
+              Lucide v{version}
+            </a>
+          </footer>
+        </main>
+    </>
+  )
+}
+
+export default Icons

packages/lucide-figma/src/views/Info.tsx

@@ -0,0 +1,64 @@
+import { SyntheticEvent } from "react"
+
+interface PageProps {
+  version: string
+}
+
+const Info = ({ version }: PageProps) => {
+  const menuItems = [
+    {
+      name: 'Report a bug',
+      url: 'https://github.com/lucide-icons/lucide/issues'
+    },
+    {
+      name: 'Contribute an icon',
+      url: 'https://github.com/lucide-icons/lucide/blob/master/CONTRIBUTING.md'
+    },
+    {
+      name: 'Website',
+      url: 'https://lucide.dev'
+    },
+    {
+      name: 'Repository',
+      url: 'https://github.com/lucide-icons/lucide'
+    },
+    {
+      name: 'License',
+      url: 'https://lucide.dev/license'
+    },
+    {
+      name: 'Community Page',
+      url: 'https://www.figma.com/community/plugin/939567362549682242/Lucide-Icons'
+    },
+    {
+      name: 'Supported Frameworks',
+      url: 'https://lucide.dev/packages'
+    }
+  ]
+
+  const onClick = (url: string) => (event: SyntheticEvent) => {
+    event.preventDefault()
+
+    window.open(url,'_blank')
+  }
+
+  return (
+    <div className="info-page">
+      <img src="https://lucide.dev/logo-text.svg" alt="Lucide Logo" className="lucide-logo"/>
+      <p className='version'>
+        v{version}
+      </p>
+      <section className="link-list">
+        {
+          menuItems.map(({ name, url }) => (
+            <a href={url} key={name} aria-label={name} className="info-link" onClick={onClick(url)}>
+              {name}
+            </a>
+          ))
+        }
+      </section>
+    </div>
+  )
+}
+
+export default Info

packages/lucide-figma/src/views/index.ts

@@ -0,0 +1,2 @@
+export { default as icons } from './Icons'
+export { default as info } from './Info'

packages/lucide-figma/src/worker/worker.ts

@@ -14,20 +14,26 @@ const getLatestIcons = async ({ cachedIcons }: any) => {
   }, "*")
 }
 
-const getSvg = async ({ cachedIcons, iconName }: { cachedIcons: LucideIcons, iconName: string }) => {
+const getSvg = async ({ cachedIcons, iconName, size = 24 }: { cachedIcons: LucideIcons, iconName: string, size: number }) => {
   if (!cachedIcons) {
     return;
   }
 
+  console.log( iconName, size)
+
   const iconNode = cachedIcons.iconNodes[iconName];
 
   if (iconNode) {
     const IconComponent = createReactComponent(iconName, iconNode)
-    const svg = renderToString(createElement(IconComponent));
+    const svg = renderToString(createElement(IconComponent, { size }));
 
     parent.postMessage({ pluginMessage: {
       type: 'drawIcon',
-      icon: { name, svg }
+      icon: {
+        name: iconName,
+        svg,
+        size
+      }
     }}, '*')
 
     parent.postMessage({ pluginMessage: {
@@ -56,5 +62,3 @@ window.onmessage = async (event) => {
       break;
   }
 }
-
-console.log('Hello world!')

packages/lucide-flutter/pubspec.yaml

@@ -1,6 +1,6 @@
 name: lucide_icons
 description: A Lucide icon library package for Flutter applications. Fork of Feather Icons, open for anyone to contribute icons.
-version: 0.17.6
+version: 0.17.11
 homepage: https://lucide.dev
 repository: https://github.com/lucide-icons/lucide
 

packages/lucide-preact/package.json

@@ -1,7 +1,7 @@
 {
   "name": "lucide-preact",
   "description": "A Lucide icon library package for Preact applications",
-  "version": "0.17.6",
+  "version": "0.17.11",
   "license": "ISC",
   "homepage": "https://lucide.dev",
   "bugs": "https://github.com/lucide-icons/lucide/issues",

packages/lucide-react/README.md

@@ -16,7 +16,7 @@ npm install lucide-react
 
 ## How to use
 
-It's build with ESmodules so it's completely threeshakable.
+It's built with ES modules so it's completely threeshakable.
 Each icon can be imported as a react component.
 
 ### Example
@@ -25,9 +25,7 @@ You can pass additional props to adjust the icon.
 
 ``` js
 import { Camera } from 'lucide-react';
-// Returns ReactComponent
 
-// Usage
 const App = () => {
   return <Camera color="red" size={48}/>
 };
@@ -48,19 +46,16 @@ export default App;
 You can also pass custom props that will be added in the svg as attributes.
 
 ``` js
-// Usage
 const App = () => {
   return <Camera fill="red"/>
 };
 ```
 
-### One generic icon component
+### Generic icon component
 
-It is possible to create one generic icon component to load icons.
+It is possible to create a generic icon component to load icons.
 
-> :warning: Example below importing all EsModules, caution  using this example, not recommended when you using bundlers, your application build size will grow strongly.
-
-#### Icon Component Example
+> :warning: The example below is importing all ES modules. This is **not** recommended when you using a bundler since your application build size will grow substantially.
 
 ``` js
 import * as icons from 'lucide-react';

packages/lucide-react/package.json

@@ -1,7 +1,7 @@
 {
   "name": "lucide-react",
   "description": "A Lucide icon library package for React applications",
-  "version": "0.17.6",
+  "version": "0.17.11",
   "license": "ISC",
   "homepage": "https://lucide.dev",
   "bugs": "https://github.com/lucide-icons/lucide/issues",

packages/lucide-svelte/package.json

@@ -1,7 +1,7 @@
 {
   "name": "lucide-svelte",
   "description": "A Lucide icon library package for Svelte applications",
-  "version": "0.17.6",
+  "version": "0.17.11",
   "license": "ISC",
   "homepage": "https://lucide.dev",
   "bugs": "https://github.com/lucide-icons/lucide/issues",

packages/lucide-vue-next/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lucide-vue-next",
-  "version": "0.17.6",
+  "version": "0.17.11",
   "author": "Eric Fennis",
   "description": "A Lucide icon library package for Vue 3 applications",
   "license": "ISC",
@@ -38,6 +38,6 @@
     "vue-jest": "^5.0.0-alpha.10"
   },
   "peerDependencies": {
-    "vue": "3.0.1"
+    "vue": ">=3.0.1"
   }
 }

packages/lucide-vue/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lucide-vue",
-  "version": "0.17.6",
+  "version": "0.17.11",
   "author": "Eric Fennis",
   "description": "A Lucide icon library package for Vue 2 applications",
   "license": "ISC",

packages/lucide/package.json

@@ -1,7 +1,7 @@
 {
   "name": "lucide",
   "description": "A Lucide icon library package for web and javascript applications.",
-  "version": "0.17.6",
+  "version": "0.17.11",
   "license": "ISC",
   "homepage": "https://lucide.dev",
   "bugs": "https://github.com/lucide-icons/lucide/issues",

site/public/framework-logos/laravel.svg

@@ -0,0 +1,3 @@
+<svg width="34.6" height="36" viewBox="0 0 50 52" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M49.626 11.564a.809.809 0 0 1 .028.209v10.972a.8.8 0 0 1-.402.694l-9.209 5.302V39.25c0 .286-.152.55-.4.694L20.42 51.01c-.044.025-.092.041-.14.058-.018.006-.035.017-.054.022a.805.805 0 0 1-.41 0c-.022-.006-.042-.018-.063-.026-.044-.016-.09-.03-.132-.054L.402 39.944A.801.801 0 0 1 0 39.25V6.334c0-.072.01-.142.028-.21.006-.023.02-.044.028-.067.015-.042.029-.085.051-.124.015-.026.037-.047.055-.071.023-.032.044-.065.071-.093.023-.023.053-.04.079-.06.029-.024.055-.05.088-.069h.001l9.61-5.533a.802.802 0 0 1 .8 0l9.61 5.533h.002c.032.02.059.045.088.068.026.02.055.038.078.06.028.029.048.062.072.094.017.024.04.045.054.071.023.04.036.082.052.124.008.023.022.044.028.068a.809.809 0 0 1 .028.209v20.559l8.008-4.611v-10.51c0-.07.01-.141.028-.208.007-.024.02-.045.028-.068.016-.042.03-.085.052-.124.015-.026.037-.047.054-.071.024-.032.044-.065.072-.093.023-.023.052-.04.078-.06.03-.024.056-.05.088-.069h.001l9.611-5.533a.801.801 0 0 1 .8 0l9.61 5.533c.034.02.06.045.09.068.025.02.054.038.077.06.028.029.048.062.072.094.018.024.04.045.054.071.023.039.036.082.052.124.009.023.022.044.028.068zm-1.574 10.718v-9.124l-3.363 1.936-4.646 2.675v9.124l8.01-4.611zm-9.61 16.505v-9.13l-4.57 2.61-13.05 7.448v9.216l17.62-10.144zM1.602 7.719v31.068L19.22 48.93v-9.214l-9.204-5.209-.003-.002-.004-.002c-.031-.018-.057-.044-.086-.066-.025-.02-.054-.036-.076-.058l-.002-.003c-.026-.025-.044-.056-.066-.084-.02-.027-.044-.05-.06-.078l-.001-.003c-.018-.03-.029-.066-.042-.1-.013-.03-.03-.058-.038-.09v-.001c-.01-.038-.012-.078-.016-.117-.004-.03-.012-.06-.012-.09v-.002-21.481L4.965 9.654 1.602 7.72zm8.81-5.994L2.405 6.334l8.005 4.609 8.006-4.61-8.006-4.608zm4.164 28.764l4.645-2.674V7.719l-3.363 1.936-4.646 2.675v20.096l3.364-1.937zM39.243 7.164l-8.006 4.609 8.006 4.609 8.005-4.61-8.005-4.608zm-.801 10.605l-4.646-2.675-3.363-1.936v9.124l4.645 2.674 3.364 1.937v-9.124zM20.02 38.33l11.743-6.704 5.87-3.35-8-4.606-9.211 5.303-8.395 4.833 7.993 4.524z" fill="#FF2D20" fill-rule="evenodd"/>
+</svg>

site/src/components/Header.tsx

@@ -12,6 +12,7 @@ import PreactLogo from '../../public/framework-logos/preact.svg';
 import AngularLogo from '../../public/framework-logos/angular.svg';
 import FlutterLogo from '../../public/framework-logos/flutter.svg';
 import SvelteLogo from '../../public/framework-logos/svelte.svg';
+import LaravelLogo from '../../public/framework-logos/laravel.svg';
 
 function generateZip(icons) {
   const zip = new JSZip();
@@ -71,6 +72,11 @@ const Header = ({ data }) => {
       Logo: FlutterLogo,
       href: '/docs/lucide-flutter',
     },
+    {
+      name: 'lucide-laravel',
+      Logo: LaravelLogo,
+      href: 'https://github.com/mallardduck/blade-lucide-icons',
+    }
   ];
 
   return (

tags.json

@@ -311,6 +311,11 @@
     "diagram",
     "graph"
   ],
+  "baseline": [
+    "text",
+    "format",
+    "color"
+  ],
   "battery": [
     "power",
     "electricity"
@@ -400,7 +405,8 @@
   ],
   "bold": [
     "text",
-    "strong"
+    "strong",
+    "format"
   ],
   "book": [
     "read",
@@ -1300,7 +1306,8 @@
   ],
   "italic": [
     "oblique",
-    "text"
+    "text",
+    "format"
   ],
   "japanese-yen": [
     "currency",
@@ -1313,6 +1320,12 @@
     "authentication",
     "secure"
   ],
+  "keyboard": [
+    "layout",
+    "spell",
+    "settings",
+    "mouse"
+  ],
   "landmark": [
     "bank",
     "building",
@@ -1446,6 +1459,12 @@
     "location",
     "cross"
   ],
+  "locate-off": [
+    "map",
+    "gps",
+    "location",
+    "cross"
+  ],
   "lock": [
     "security",
     "password",
@@ -2213,7 +2232,8 @@
   "strikethrough": [
     "cross out",
     "delete",
-    "remove"
+    "remove",
+    "format"
   ],
   "subscript": [
     "text"
@@ -2411,7 +2431,8 @@
     "weather"
   ],
   "underline": [
-    "text"
+    "text",
+    "format"
   ],
   "undo": [
     "redo",
@@ -2526,6 +2547,14 @@
     "clock",
     "time"
   ],
+  "waves": [
+    "water",
+    "sea",
+    "sound",
+    "hertz",
+    "wavelength",
+    "vibrate"
+  ],
   "webcam": [
     "camera",
     "security"