vite-plugin-material-symbols 0.2.2 → 0.3.0-beta.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -2,6 +2,13 @@
2
2
 
3
3
  ## Version 0
4
4
 
5
+ ### v0.3.0
6
+
7
+ - Fixed the leading slash problem in `dev` mode (serve mode);
8
+ - The `placeholder` option removed;
9
+ - Placing the `<link>` tag into `index.html` is no longer required:
10
+ - The plugin will add `<link>` tag to the `<head>` by itself.
11
+
5
12
  ### v0.2.2
6
13
 
7
14
  - Performance improvement:
package/README.md CHANGED
@@ -42,11 +42,7 @@ export default defineConfig({
42
42
  });
43
43
  ```
44
44
 
45
- Add the following line to the `<head>` of your `index.html`:
46
-
47
- ```html
48
- <link href="__MATERIAL_SYMBOLS__" rel="stylesheet" />
49
- ```
45
+ Ensure having `<head>` tag in your `index.html`.
50
46
 
51
47
  Ensure assigning the [required](https://developers.google.com/fonts/docs/material_symbols) `className` to your icons.
52
48
  When using Material UI it can be [globally configured](https://mui.com/material-ui/customization/theme-components/):
@@ -81,7 +77,7 @@ const Component = () => (
81
77
  );
82
78
  ```
83
79
 
84
- After running `vite build`, that link will have the URL of Material Symbols having the list of required icon names:
80
+ After running `vite build`, the `<link>` tag will be added to your `index.html` having the list of required icon names:
85
81
 
86
82
  ```html
87
83
  <link
@@ -104,10 +100,6 @@ component:
104
100
  type: string
105
101
  description: The name of JSX component to obtain the icon names from
106
102
  default: Icon
107
- placeholder:
108
- type: string
109
- description: The text within index.html that should be replaced
110
- default: __MATERIAL_SYMBOLS__
111
103
  getUrl:
112
104
  type: function
113
105
  description: Material Symbols CSS Provider
package/dist/index.d.ts CHANGED
@@ -1,4 +1,5 @@
1
- import type { Plugin } from "vite";
1
+ import { Plugin } from 'vite';
2
+
2
3
  type PluginOptions = {
3
4
  /**
4
5
  * Material Symbols CSS Provider. Default: outlined, no infill, 24px, weight 400
@@ -6,16 +7,12 @@ type PluginOptions = {
6
7
  * @default () => `https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined...&${iconNamesParam}`
7
8
  * */
8
9
  getUrl: (iconNamesParam: string) => string;
9
- /**
10
- * The text within index.html that should be replaced
11
- * @default __MATERIAL_SYMBOLS__
12
- * */
13
- placeholder: string;
14
10
  /**
15
11
  * The name of JSX component to obtain the icon names from
16
12
  * @default Icon
17
13
  * */
18
14
  component: string;
19
15
  };
20
- declare const plugin: ({ placeholder, component, getUrl, }?: Partial<PluginOptions>) => Plugin;
21
- export default plugin;
16
+ declare const plugin: ({ component, getUrl, }?: Partial<PluginOptions>) => Plugin;
17
+
18
+ export { plugin as default };
package/dist/index.js CHANGED
@@ -1 +1 @@
1
- import esquery from "esquery";const isStringLiteral=(h)=>h.type==="Literal"&&"value"in h&&typeof h.value==="string",defaultUrlProvider=(h)=>`https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0&${h}`,makeSelector=(h)=>[`CallExpression[callee.name='jsx'][arguments.0.name='${h}']`,".arguments","Property[key.name='children'] Literal"].join(" > "),makeIconNamesParam=(h)=>{if(!h.size)return "";const i=[];for(const j of h.values())i.push(j);return `icon_names=${i.toSorted().join(",")}`},plugin=({placeholder:h="__MATERIAL_SYMBOLS__",component:i="Icon",getUrl:j=defaultUrlProvider}={})=>{const k=new Set();return {name:"material-symbols",enforce:"pre",moduleParsed:function({id:l,ast:m}){if(!m)return;const n=esquery.query(m,makeSelector(i)).filter(isStringLiteral);for(const {value:o}of n)this.debug({id:l,message:o}),k.add(o)},transformIndexHtml:(l)=>l.replace(h,j(makeIconNamesParam(k)))}};var src_default=plugin;export {src_default as default};
1
+ import esquery from "esquery";const isStringLiteral=(h)=>h.type==="Literal"&&"value"in h&&typeof h.value==="string",defaultUrlProvider=(h)=>`https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0&${h}`,makeSelector=(h)=>[`CallExpression[callee.name='jsx'][arguments.0.name='${h}']`,".arguments","Property[key.name='children'] Literal"].join(" > "),makeIconNamesParam=(h)=>{if(!h.size)return "";const i=[];for(const j of h.values())i.push(j);return `icon_names=${i.toSorted().join(",")}`},plugin=({component:h="Icon",getUrl:i=defaultUrlProvider}={})=>{const j=new Set();return {name:"material-symbols",enforce:"pre",moduleParsed:function({id:k,ast:l}){if(!l)return;const m=esquery.query(l,makeSelector(h)).filter(isStringLiteral);for(const {value:n}of m)this.debug({id:k,message:n}),j.add(n)},transformIndexHtml:(k)=>({html:k,tags:[{injectTo:"head",tag:"link",attrs:{rel:"stylesheet",href:i(makeIconNamesParam(j))}}]})}};var src_default=plugin;export {src_default as default};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "vite-plugin-material-symbols",
3
- "version": "0.2.2",
3
+ "version": "0.3.0-beta.2",
4
4
  "description": "Selective loading of Material Symbols for production",
5
5
  "main": "dist/index.js",
6
6
  "repository": {
@@ -44,14 +44,14 @@
44
44
  "@tsconfig/bun": "^1.0.7",
45
45
  "@types/bun": "^1.1.14",
46
46
  "@types/esquery": "^1.5.4",
47
- "@types/react": "^18.3.12",
48
- "@types/react-dom": "^18.3.1",
47
+ "@types/react": "^19.0.0",
48
+ "@types/react-dom": "^19.0.0",
49
49
  "@types/semver": "^7.5.8",
50
50
  "@vitejs/plugin-react-swc": "^3.7.2",
51
- "react": "^18.3.1",
52
- "react-dom": "^18.3.1",
51
+ "react": "^19.0.0",
52
+ "react-dom": "^19.0.0",
53
53
  "semver": "^7.6.3",
54
- "tsdown": "^0.3.1",
54
+ "tsdown": "^0.5.0",
55
55
  "typescript": "^5.7.2"
56
56
  },
57
57
  "keywords": [