semicons 0.0.1

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.
@@ -0,0 +1,10 @@
1
+
2
+ > semicons@0.0.1 build /Users/emily/workspace/sites/semicons/packages/vscode
3
+ > node esbuild.js
4
+
5
+
6
+ dist/extension.js 25.7kb
7
+ dist/extension.js.map 45.8kb
8
+
9
+ ⚡ Done in 30ms
10
+ Build completed: development
package/CHANGELOG.md ADDED
@@ -0,0 +1,7 @@
1
+ # semicons
2
+
3
+ ## 0.0.1
4
+
5
+ ### Patch Changes
6
+
7
+ - beta publish
package/LICENSE ADDED
@@ -0,0 +1,21 @@
1
+ MIT License
2
+
3
+ Copyright (c) 2026 semicons-dev
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/README.md ADDED
@@ -0,0 +1,175 @@
1
+ # Semicons VS Code Extension
2
+
3
+ Semantic icon token system for VS Code - provides completion, hover, diagnostics, and preview for icon tokens.
4
+
5
+ ## Features
6
+
7
+ - **Completion**: Auto-complete icon tokens in `<Icon name="...">` attributes
8
+ - **Hover**: Show token details on hover with preview command
9
+ - **Diagnostics**: Real-time validation of icon tokens
10
+ - **Preview**: Webview panel preview of icon tokens
11
+ - **Search**: QuickPick search for icon tokens
12
+
13
+ ## Requirements
14
+
15
+ - VS Code 1.90.0+
16
+ - Node.js 20+
17
+
18
+ ## Installation
19
+
20
+ ### Development
21
+
22
+ ```bash
23
+ cd packages/vscode
24
+ pnpm install
25
+ pnpm build
26
+ ```
27
+
28
+ ### Running in Extension Development Host
29
+
30
+ 1. Press `F5` to launch Extension Development Host
31
+ 2. Open a test workspace with a `semicons.config.ts` or run `pnpm semicons generate`
32
+ 3. Test completion, hover, and diagnostics in `.tsx`, `.vue`, or `.astro` files
33
+
34
+ ## Setup
35
+
36
+ ### 1. Generate Icons
37
+
38
+ ```bash
39
+ pnpm semicons generate
40
+ ```
41
+
42
+ This creates `src/icons.generated/registry.json` in your workspace.
43
+
44
+ ### 2. Configure VS Code Settings
45
+
46
+ The extension uses these settings (configurable in VS Code settings):
47
+
48
+ | Setting | Default | Description |
49
+ |---------|---------|-------------|
50
+ | `semicons.registryPath` | `src/icons.generated/registry.json` | Path to registry.json |
51
+ | `semicons.localIconDir` | `icons/local` | Directory for local icons |
52
+ | `semicons.iconComponentName` | `Icon` | Icon component name |
53
+
54
+ ### 3. Icon File Structure
55
+
56
+ Local icons should be placed in `icons/local/` directory:
57
+
58
+ ```
59
+ icons/
60
+ └── local/
61
+ ├── menu.svg
62
+ ├── menu-dark.svg
63
+ └── close.svg
64
+ ```
65
+
66
+ Reference them in your registry as `local:menu`, `local:menu-dark`, `local:close`.
67
+
68
+ ## Usage
69
+
70
+ ### Completion
71
+
72
+ In `.tsx`, `.vue`, or `.astro` files:
73
+
74
+ ```tsx
75
+ <Icon name="nav|igation:menu" />
76
+ ```
77
+
78
+ Type `navigation:` and select from completion list.
79
+
80
+ ### Hover
81
+
82
+ Hover over a token to see:
83
+ - Token name
84
+ - Asset reference
85
+ - A11y label
86
+ - Preview command link
87
+
88
+ ### Diagnostics
89
+
90
+ Invalid or deprecated tokens are highlighted:
91
+ - **Error**: Token not found or invalid format
92
+ - **Warning**: Deprecated token
93
+
94
+ ### Preview
95
+
96
+ Run `Semicons: Preview Icon` command or click preview link in hover to open webview panel with icon preview.
97
+
98
+ ### Search
99
+
100
+ Run `Semicons: Search Token` command to search and insert tokens via QuickPick.
101
+
102
+ ## Commands
103
+
104
+ | Command | Description |
105
+ |---------|-------------|
106
+ | `semicons.refreshRegistry` | Refresh registry from disk |
107
+ | `semicons.searchToken` | Search and insert token |
108
+ | `semicons.previewIcon` | Preview token in webview |
109
+
110
+ ## Supported File Types
111
+
112
+ - TypeScript React (`.tsx`)
113
+ - JavaScript React (`.jsx`)
114
+ - Vue (`.vue`)
115
+ - Astro (`.astro`)
116
+
117
+ ## Development
118
+
119
+ ### Build
120
+
121
+ ```bash
122
+ pnpm build # Production build
123
+ pnpm watch # Development watch mode
124
+ ```
125
+
126
+ ### Debug
127
+
128
+ 1. Press `F5` to start Extension Development Host
129
+ 2. Open test workspace
130
+ 3. Test features in real-time
131
+
132
+ ### Project Structure
133
+
134
+ ```
135
+ packages/vscode/
136
+ ├── package.json # Extension manifest
137
+ ├── tsconfig.json
138
+ ├── esbuild.js # Bundler script
139
+ ├── src/
140
+ │ ├── extension.ts # Entry point
141
+ │ ├── registry/
142
+ │ │ ├── types.ts # Type definitions
143
+ │ │ ├── loader.ts # Load registry.json
144
+ │ │ ├── cache.ts # Multi-folder cache
145
+ │ │ └── watcher.ts # FileSystemWatcher
146
+ │ ├── features/
147
+ │ │ ├── completion.ts
148
+ │ │ ├── hover.ts
149
+ │ │ ├── diagnostics.ts
150
+ │ │ └── commands.ts
151
+ │ ├── views/
152
+ │ │ └── previewWebview.ts
153
+ │ └── utils/
154
+ │ ├── config.ts
155
+ │ ├── path.ts
156
+ │ └── tokenParse.ts
157
+ └── README.md
158
+ ```
159
+
160
+ ## Publishing
161
+
162
+ ```bash
163
+ # Install vsce
164
+ npm install -g @vscode/vsce
165
+
166
+ # Package
167
+ vsce package
168
+
169
+ # Publish
170
+ vsce publish
171
+ ```
172
+
173
+ ## License
174
+
175
+ MIT