adam/vscode-front-matter
1
0
Fork 0
mirror of https://github.com/estruyf/vscode-front-matter.git synced 2026-06-25 20:41:40 +02:00
Code Issues Packages Projects Releases Wiki Activity

Updated icons

Browse Source
This commit is contained in:
Elio Struyf
2024-01-15 13:48:21 +01:00
parent 51517c6a43
commit e161fe23d5
74 changed files with 316 additions and 275 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package-lock.json
Generated
+7 -3
View File
@@ -13,7 +13,7 @@
"@bendera/vscode-webview-elements": "0.6.2",
"@estruyf/vscode": "^1.1.0",
"@headlessui/react": "^1.7.17",
"@heroicons/react": "1.0.4",
"@heroicons/react": "^2.1.1",
"@iarna/toml": "2.2.3",
"@octokit/rest": "^18.12.0",
"@popperjs/core": "^2.11.6",
@@ -364,7 +364,9 @@
}
},
"node_modules/@heroicons/react": {
"version": "1.0.4",
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/@heroicons/react/-/react-2.1.1.tgz",
"integrity": "sha512-JyyN9Lo66kirbCMuMMRPtJxtKJoIsXKS569ebHGGRKbl8s4CtUfLnyKJxteA+vIKySocO4s1SkTkGS4xtG/yEA==",
"dev": true,
"peerDependencies": {
"react": ">= 16"
@@ -13333,7 +13335,9 @@
}
},
"@heroicons/react": {
"version": "1.0.4",
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/@heroicons/react/-/react-2.1.1.tgz",
"integrity": "sha512-JyyN9Lo66kirbCMuMMRPtJxtKJoIsXKS569ebHGGRKbl8s4CtUfLnyKJxteA+vIKySocO4s1SkTkGS4xtG/yEA==",
"dev": true,
"requires": {}
},
package.json
+153 -122
View File
@@ -10,7 +10,8 @@
"color": "#0e131f",
"theme": "dark"
},
"badges": [{
"badges": [
{
"description": "version",
"url": "https://img.shields.io/github/package-json/v/estruyf/vscode-front-matter?color=green&label=vscode-front-matter&style=flat-square",
"href": "https://github.com/estruyf/vscode-front-matter"
@@ -70,7 +71,8 @@
"**/.frontmatter/config/*.json": "jsonc"
}
},
"keybindings": [{
"keybindings": [
{
"command": "frontMatter.dashboard",
"key": "alt+d"
},
@@ -88,19 +90,23 @@
}
],
"viewsContainers": {
"activitybar": [{
"id": "frontmatter-explorer",
"title": "FM",
"icon": "$(fm-logo)"
}]
"activitybar": [
{
"id": "frontmatter-explorer",
"title": "FM",
"icon": "$(fm-logo)"
}
]
},
"views": {
"frontmatter-explorer": [{
"id": "frontMatter.explorer",
"name": "Front Matter",
"icon": "$(fm-logo)",
"type": "webview"
}]
"frontmatter-explorer": [
{
"id": "frontMatter.explorer",
"name": "Front Matter",
"icon": "$(fm-logo)",
"type": "webview"
}
]
},
"configuration": {
"title": "%settings.configuration.title%",
@@ -168,7 +174,8 @@
"frontMatter.content.defaultFileType": {
"type": "string",
"default": "md",
"oneOf": [{
"oneOf": [
{
"enum": [
"md",
"mdx"
@@ -184,7 +191,8 @@
"frontMatter.content.defaultSorting": {
"type": "string",
"default": "",
"oneOf": [{
"oneOf": [
{
"enum": [
"LastModifiedAsc",
"LastModifiedDesc",
@@ -536,7 +544,8 @@
"command": {
"$id": "#scriptCommand",
"type": "string",
"anyOf": [{
"anyOf": [
{
"enum": [
"node",
"bash",
@@ -743,7 +752,8 @@
"title",
"file"
],
"anyOf": [{
"anyOf": [
{
"required": [
"schema"
]
@@ -797,7 +807,8 @@
"id",
"path"
],
"anyOf": [{
"anyOf": [
{
"required": [
"schema"
]
@@ -1198,7 +1209,8 @@
"default": "",
"description": "%setting.frontMatter.taxonomy.contentTypes.items.properties.fields.items.properties.taxonomyId.description%",
"not": {
"anyOf": [{
"anyOf": [
{
"const": ""
},
{
@@ -1392,7 +1404,8 @@
"type",
"name"
],
"allOf": [{
"allOf": [
{
"if": {
"properties": {
"type": {
@@ -1592,48 +1605,51 @@
"fields"
]
},
"default": [{
"name": "default",
"pageBundle": false,
"fields": [{
"title": "Title",
"name": "title",
"type": "string"
},
{
"title": "Description",
"name": "description",
"type": "string"
},
{
"title": "Publishing date",
"name": "date",
"type": "datetime",
"default": "{{now}}",
"isPublishDate": true
},
{
"title": "Content preview",
"name": "preview",
"type": "image"
},
{
"title": "Is in draft",
"name": "draft",
"type": "boolean"
},
{
"title": "Tags",
"name": "tags",
"type": "tags"
},
{
"title": "Categories",
"name": "categories",
"type": "categories"
}
]
}],
"default": [
{
"name": "default",
"pageBundle": false,
"fields": [
{
"title": "Title",
"name": "title",
"type": "string"
},
{
"title": "Description",
"name": "description",
"type": "string"
},
{
"title": "Publishing date",
"name": "date",
"type": "datetime",
"default": "{{now}}",
"isPublishDate": true
},
{
"title": "Content preview",
"name": "preview",
"type": "image"
},
{
"title": "Is in draft",
"name": "draft",
"type": "boolean"
},
{
"title": "Tags",
"name": "tags",
"type": "tags"
},
{
"title": "Categories",
"name": "categories",
"type": "categories"
}
]
}
],
"scope": "Taxonomy"
},
"frontMatter.taxonomy.customTaxonomy": {
@@ -1646,7 +1662,8 @@
"type": "string",
"description": "%setting.frontMatter.taxonomy.customTaxonomy.items.properties.id.description%",
"not": {
"anyOf": [{
"anyOf": [
{
"const": ""
},
{
@@ -1838,7 +1855,8 @@
}
}
},
"commands": [{
"commands": [
{
"command": "frontMatter.project.switch",
"title": "%command.frontMatter.project.switch%",
"category": "Front Matter",
@@ -2155,12 +2173,15 @@
"category": "Front Matter"
}
],
"submenus": [{
"id": "frontmatter.submenu",
"label": "Front Matter"
}],
"submenus": [
{
"id": "frontmatter.submenu",
"label": "Front Matter"
}
],
"menus": {
"editor/title": [{
"editor/title": [
{
"command": "frontMatter.markup.heading",
"group": "navigation@-133",
"when": "frontMatter:file:isValid == true && frontMatter:markdown:wysiwyg"
@@ -2241,11 +2262,14 @@
"when": "resourceFilename == 'frontmatter.json'"
}
],
"explorer/context": [{
"submenu": "frontmatter.submenu",
"group": "frontmatter@1"
}],
"frontmatter.submenu": [{
"explorer/context": [
{
"submenu": "frontmatter.submenu",
"group": "frontmatter@1"
}
],
"frontmatter.submenu": [
{
"command": "frontMatter.createFromTemplate",
"when": "explorerResourceIsFolder",
"group": "frontmatter@1"
@@ -2261,7 +2285,8 @@
"group": "frontmatter@3"
}
],
"commandPalette": [{
"commandPalette": [
{
"command": "frontMatter.init",
"when": "frontMatterCanInit"
},
@@ -2410,7 +2435,8 @@
"when": "frontMatter:file:isValid == true"
}
],
"view/title": [{
"view/title": [
{
"command": "frontMatter.chatbot",
"group": "navigation@0",
"when": "view == frontMatter.explorer"
@@ -2442,52 +2468,57 @@
}
]
},
"grammars": [{
"path": "./syntaxes/hugo.tmLanguage.json",
"scopeName": "frontmatter.markdown.hugo",
"injectTo": [
"text.html.markdown"
]
}],
"walkthroughs": [{
"id": "frontmatter.welcome",
"title": "Get started with Front Matter",
"description": "Discover the features of Front Matter and learn how to use the CMS for your SSG or static site.",
"steps": [{
"id": "frontmatter.welcome.init",
"title": "Get started",
"description": "Initial steps to get started.\n[Open dashboard](command:frontMatter.dashboard)",
"media": {
"markdown": "assets/walkthrough/get-started.md"
"grammars": [
{
"path": "./syntaxes/hugo.tmLanguage.json",
"scopeName": "frontmatter.markdown.hugo",
"injectTo": [
"text.html.markdown"
]
}
],
"walkthroughs": [
{
"id": "frontmatter.welcome",
"title": "Get started with Front Matter",
"description": "Discover the features of Front Matter and learn how to use the CMS for your SSG or static site.",
"steps": [
{
"id": "frontmatter.welcome.init",
"title": "Get started",
"description": "Initial steps to get started.\n[Open dashboard](command:frontMatter.dashboard)",
"media": {
"markdown": "assets/walkthrough/get-started.md"
},
"completionEvents": [
"onContext:frontMatterInitialized"
]
},
"completionEvents": [
"onContext:frontMatterInitialized"
]
},
{
"id": "frontmatter.welcome.documentation",
"title": "Documentation",
"description": "Check out the documentation for Front Matter.\n[View our documentation](https://frontmatter.codes/docs)",
"media": {
"markdown": "assets/walkthrough/documentation.md"
{
"id": "frontmatter.welcome.documentation",
"title": "Documentation",
"description": "Check out the documentation for Front Matter.\n[View our documentation](https://frontmatter.codes/docs)",
"media": {
"markdown": "assets/walkthrough/documentation.md"
},
"completionEvents": [
"onLink:https://frontmatter.codes/docs"
]
},
"completionEvents": [
"onLink:https://frontmatter.codes/docs"
]
},
{
"id": "frontmatter.welcome.supporter",
"title": "Support the project",
"description": "Become a supporter.\n[Support the project](https://github.com/sponsors/estruyf)",
"media": {
"markdown": "assets/walkthrough/support-the-project.md"
},
"completionEvents": [
"onLink:https://github.com/sponsors/estruyf"
]
}
]
}]
{
"id": "frontmatter.welcome.supporter",
"title": "Support the project",
"description": "Become a supporter.\n[Support the project](https://github.com/sponsors/estruyf)",
"media": {
"markdown": "assets/walkthrough/support-the-project.md"
},
"completionEvents": [
"onLink:https://github.com/sponsors/estruyf"
]
}
]
}
]
},
"scripts": {
"dev:ext": "npm run clean && npm run localization:generate && npm-run-all --parallel watch:*",
@@ -2519,7 +2550,7 @@
"@bendera/vscode-webview-elements": "0.6.2",
"@estruyf/vscode": "^1.1.0",
"@headlessui/react": "^1.7.17",
"@heroicons/react": "1.0.4",
"@heroicons/react": "^2.1.1",
"@iarna/toml": "2.2.3",
"@octokit/rest": "^18.12.0",
"@popperjs/core": "^2.11.6",
@@ -2624,4 +2655,4 @@
"vsce": {
"dependencies": false
}
}
}
src/components/uniforms-frontmatter/ListAddField.tsx
+1 -1
View File
@@ -1,4 +1,4 @@
import { PlusIcon } from '@heroicons/react/outline';
import { PlusIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { HTMLFieldProps, connectField, filterDOMProps, joinName, useField } from 'uniforms';
import './ListAddField.css';
src/components/uniforms-frontmatter/ListDelField.tsx
+1 -1
View File
@@ -1,4 +1,4 @@
import { TrashIcon } from '@heroicons/react/outline';
import { TrashIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { HTMLFieldProps, connectField, filterDOMProps, joinName, useField } from 'uniforms';
import './ListDelField.css';
src/dashboardWebView/components/Chatbot/Chatbox.tsx
+1 -1
View File
@@ -1,4 +1,4 @@
import { PaperAirplaneIcon } from '@heroicons/react/outline';
import { PaperAirplaneIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { useCallback } from 'react';
import useThemeColors from '../../hooks/useThemeColors';
src/dashboardWebView/components/Chatbot/Feedback.tsx
+4 -4
View File
@@ -1,6 +1,6 @@
import * as React from 'react';
import { ThumbDownIcon, ThumbUpIcon } from '@heroicons/react/outline';
import { ThumbDownIcon as ThumbDownSolidIcon, ThumbUpIcon as ThumbUpSolidIcon } from '@heroicons/react/solid';
import { HandThumbDownIcon, HandThumbUpIcon } from '@heroicons/react/24/outline';
import { HandThumbDownIcon as ThumbDownSolidIcon, HandThumbUpIcon as ThumbUpSolidIcon } from '@heroicons/react/24/solid';
import { useCallback } from 'react';
import { useSettingsContext } from '../../providers/SettingsProvider';
@@ -53,7 +53,7 @@ export const Feedback: React.FunctionComponent<IFeedbackProps> = ({
isUpVoted ? (
<ThumbUpSolidIcon className='h-4 w-4 text-[var(--vscode-textLink-foreground)]' />
) : (
<ThumbUpIcon className='h-4 w-4' />
<HandThumbUpIcon className='h-4 w-4' />
)
}
</button>
@@ -64,7 +64,7 @@ export const Feedback: React.FunctionComponent<IFeedbackProps> = ({
isDownVoted ? (
<ThumbDownSolidIcon className='h-4 w-4 text-[var(--vscode-textLink-foreground)]' />
) : (
<ThumbDownIcon className='h-4 w-4' />
<HandThumbDownIcon className='h-4 w-4' />
)
}
</button>
src/dashboardWebView/components/Common/ChoiceButton.tsx
+1 -1
View File
@@ -1,5 +1,5 @@
import { Menu } from '@headlessui/react';
import { ChevronDownIcon } from '@heroicons/react/outline';
import { ChevronDownIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import useThemeColors from '../../hooks/useThemeColors';
import { MenuItem, MenuItems } from '../Menu';
src/dashboardWebView/components/Contents/ContentActions.tsx
+4 -4
View File
@@ -1,6 +1,6 @@
import { Messenger, messageHandler } from '@estruyf/vscode/dist/client';
import { Menu } from '@headlessui/react';
import { EyeIcon, GlobeIcon, TerminalIcon, TrashIcon } from '@heroicons/react/outline';
import { EyeIcon, GlobeEuropeAfricaIcon, CommandLineIcon, TrashIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { CustomScript, ScriptType } from '../../../models';
import { DashboardMessage } from '../../DashboardMessage';
@@ -112,7 +112,7 @@ export const ContentActions: React.FunctionComponent<IContentActionsProps> = ({
key={script.title}
title={
<div className="flex items-center">
<TerminalIcon className="mr-2 h-5 w-5 flex-shrink-0" aria-hidden={true} />{' '}
<CommandLineIcon className="mr-2 h-5 w-5 flex-shrink-0" aria-hidden={true} />{' '}
<span>{script.title}</span>
</div>
}
@@ -145,7 +145,7 @@ export const ContentActions: React.FunctionComponent<IContentActionsProps> = ({
{
settings?.websiteUrl && (
<QuickAction title={l10n.t(LocalizationKey.commonOpenOnWebsite)} onClick={openOnWebsite}>
<GlobeIcon className={`w-4 h-4`} aria-hidden="true" />
<GlobeEuropeAfricaIcon className={`w-4 h-4`} aria-hidden="true" />
</QuickAction>
)
}
@@ -195,7 +195,7 @@ export const ContentActions: React.FunctionComponent<IContentActionsProps> = ({
<MenuItem
title={
<div className="flex items-center">
<GlobeIcon className="mr-2 h-5 w-5 flex-shrink-0" aria-hidden={true} />{' '}
<GlobeEuropeAfricaIcon className="mr-2 h-5 w-5 flex-shrink-0" aria-hidden={true} />{' '}
<span>{l10n.t(LocalizationKey.commonOpenOnWebsite)}</span>
</div>
}
src/dashboardWebView/components/Contents/Overview.tsx
+1 -1
View File
@@ -1,5 +1,5 @@
import { Disclosure } from '@headlessui/react';
import { ChevronRightIcon } from '@heroicons/react/solid';
import { ChevronRightIcon } from '@heroicons/react/24/solid';
import * as React from 'react';
import { useCallback, useMemo } from 'react';
import { useRecoilState, useRecoilValue } from 'recoil';
src/dashboardWebView/components/DataView/DataView.tsx
+2 -2
View File
@@ -15,7 +15,7 @@ import { arrayMoveImmutable } from 'array-move';
import { EmptyView } from './EmptyView';
import { Container } from './SortableContainer';
import { SortableItem } from './SortableItem';
import { ChevronRightIcon, DatabaseIcon } from '@heroicons/react/outline';
import { ChevronRightIcon, CircleStackIcon } from '@heroicons/react/24/outline';
import { ToastContainer, toast, Slide } from 'react-toastify';
import 'react-toastify/dist/ReactToastify.css';
import { DataType } from '../../../models/DataType';
@@ -297,7 +297,7 @@ export const DataView: React.FunctionComponent<IDataViewProps> = (
'text-[var(--frontmatter-text)]'
)
}`}>
<DatabaseIcon className="w-32 h-32" />
<CircleStackIcon className="w-32 h-32" />
<p className="text-3xl mt-2">{l10n.t(LocalizationKey.dashboardDataViewDataViewNoDataFiles)}</p>
<p className="text-xl mt-4">
<a
src/dashboardWebView/components/DataView/EmptyView.tsx
+1 -1
View File
@@ -1,4 +1,4 @@
import { ExclamationCircleIcon } from '@heroicons/react/outline';
import { ExclamationCircleIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import useThemeColors from '../../hooks/useThemeColors';
import * as l10n from '@vscode/l10n';
src/dashboardWebView/components/DataView/SortableItem.tsx
+2 -2
View File
@@ -1,4 +1,4 @@
import { PencilIcon, SelectorIcon, TrashIcon } from '@heroicons/react/outline';
import { PencilIcon, ChevronDownIcon, TrashIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { SortableHandle, SortableElement } from 'react-sortable-hoc';
import useThemeColors from '../../hooks/useThemeColors';
@@ -16,7 +16,7 @@ export interface ISortableItemProps {
onDeleteItem: (index: number) => void;
}
const DragHandle = SortableHandle(() => <SelectorIcon className={`w-6 h-6 cursor-move hover:text-[var(--frontmatter-link-hover)]`} />);
const DragHandle = SortableHandle(() => <ChevronDownIcon className={`w-6 h-6 cursor-move hover:text-[var(--frontmatter-link-hover)]`} />);
export const SortableItem = SortableElement(
({
src/dashboardWebView/components/ErrorView/index.tsx
+2 -2
View File
@@ -1,4 +1,4 @@
import { ExclamationIcon } from '@heroicons/react/solid';
import { ExclamationTriangleIcon } from '@heroicons/react/24/solid';
import * as React from 'react';
import useThemeColors from '../../hooks/useThemeColors';
import * as l10n from '@vscode/l10n';
@@ -13,7 +13,7 @@ export const ErrorView: React.FunctionComponent<IErrorViewProps> = (
return (
<main className={`h-full w-full flex flex-col justify-center items-center space-y-2`}>
<ExclamationIcon className={`w-24 h-24 ${getColors(`text-red-500`, `text-[var(--vscode-editorError-foreground)]`)}`} />
<ExclamationTriangleIcon className={`w-24 h-24 ${getColors(`text-red-500`, `text-[var(--vscode-editorError-foreground)]`)}`} />
<p className="text-xl">{l10n.t(LocalizationKey.commonErrorMessage)}</p>
<p className="text-base">{l10n.t(LocalizationKey.dashboardErrorViewDescription)}</p>
</main>
src/dashboardWebView/components/Header/Breadcrumb.tsx
+2 -2
View File
@@ -1,4 +1,4 @@
import { CollectionIcon } from '@heroicons/react/outline';
import { HomeModernIcon } from '@heroicons/react/24/outline';
import { basename, join } from 'path';
import * as React from 'react';
import { useRecoilState, useRecoilValue } from 'recoil';
@@ -91,7 +91,7 @@ export const Breadcrumb: React.FunctionComponent<IBreadcrumbProps> = (
`text-[var(--vscode-tab-inactiveForeground)] hover:text-[var(--vscode-tab-activeForeground)]`
)}
>
<CollectionIcon className="flex-shrink-0 h-5 w-5" aria-hidden="true" />
<HomeModernIcon className="flex-shrink-0 h-5 w-5" aria-hidden="true" />
<span className="sr-only">{l10n.t(LocalizationKey.dashboardHeaderBreadcrumbHome)}</span>
</button>
</div>
src/dashboardWebView/components/Header/ClearFilters.tsx
+1 -1
View File
@@ -1,4 +1,4 @@
import { XCircleIcon } from '@heroicons/react/solid';
import { XCircleIcon } from '@heroicons/react/24/solid';
import * as React from 'react';
import { useRecoilValue, useResetRecoilState } from 'recoil';
import {
src/dashboardWebView/components/Header/Filter.tsx
+2 -2
View File
@@ -1,5 +1,5 @@
import { Menu } from '@headlessui/react';
import { FilterIcon } from '@heroicons/react/solid';
import { FunnelIcon } from '@heroicons/react/24/solid';
import * as React from 'react';
import { MenuButton, MenuItem, MenuItems } from '../Menu';
import * as l10n from '@vscode/l10n';
@@ -30,7 +30,7 @@ export const Filter: React.FunctionComponent<IFilterProps> = ({
<MenuButton
label={
<>
<FilterIcon className={`inline-block w-5 h-5 mr-1`} />
<FunnelIcon className={`inline-block w-5 h-5 mr-1`} />
<span>{label}</span>
</>
}
src/dashboardWebView/components/Header/FilterInput.tsx
+2 -2
View File
@@ -1,4 +1,4 @@
import { SearchIcon, XCircleIcon } from '@heroicons/react/solid';
import { MagnifyingGlassIcon, XCircleIcon } from '@heroicons/react/24/solid';
import * as React from 'react';
import useThemeColors from '../../hooks/useThemeColors';
import * as l10n from '@vscode/l10n';
@@ -31,7 +31,7 @@ export const FilterInput: React.FunctionComponent<IFilterInputProps> = ({
</label>
<div className="relative flex justify-center">
<div className="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
<SearchIcon className={`h-5 w-5 ${getColors(`text-gray-400`, 'text-[var(--vscode-input-foreground)]')}`} aria-hidden="true" />
<MagnifyingGlassIcon className={`h-5 w-5 ${getColors(`text-gray-400`, 'text-[var(--vscode-input-foreground)]')}`} aria-hidden="true" />
</div>
<input
src/dashboardWebView/components/Header/Header.tsx
+2 -2
View File
@@ -16,7 +16,7 @@ import { ChoiceButton } from '../Common/ChoiceButton';
import { MediaHeaderBottom } from '../Media/MediaHeaderBottom';
import { Tabs } from './Tabs';
import { CustomScript } from '../../../models';
import { LightningBoltIcon, PlusIcon } from '@heroicons/react/outline';
import { BoltIcon, PlusIcon } from '@heroicons/react/24/outline';
import { useLocation, useNavigate } from 'react-router-dom';
import { routePaths } from '../..';
import { useEffect, useMemo } from 'react';
@@ -81,7 +81,7 @@ export const Header: React.FunctionComponent<IHeaderProps> = ({
.map((s, idx) => ({
title: (
<div key={idx} className="flex items-center">
<LightningBoltIcon className="w-4 h-4 mr-2" />
<BoltIcon className="w-4 h-4 mr-2" />
<span>{s.title}</span>
</div>
),
src/dashboardWebView/components/Header/ProjectSwitcher.tsx
+2 -2
View File
@@ -1,6 +1,6 @@
import { messageHandler } from '@estruyf/vscode/dist/client';
import { Menu } from '@headlessui/react';
import { SwitchHorizontalIcon } from '@heroicons/react/outline';
import { ArrowsRightLeftIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { useRecoilValue } from 'recoil';
import { DashboardMessage } from '../../DashboardMessage';
@@ -37,7 +37,7 @@ export const ProjectSwitcher: React.FunctionComponent<IProjectSwitcherProps> = (
<MenuButton
label={(
<div className="inline-flex items-center">
<SwitchHorizontalIcon className="h-4 w-4 mr-2" />
<ArrowsRightLeftIcon className="h-4 w-4 mr-2" />
<span>{l10n.t(LocalizationKey.dashboardHeaderProjectSwitcherLabel)}</span>
</div>
)}
src/dashboardWebView/components/Header/RefreshDashboardData.tsx
+2 -2
View File
@@ -1,5 +1,5 @@
import { Messenger } from '@estruyf/vscode/dist/client';
import { RefreshIcon } from '@heroicons/react/outline';
import { ArrowPathIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { useCallback } from 'react';
import { useRecoilState, useRecoilValue, useResetRecoilState } from 'recoil';
@@ -67,7 +67,7 @@ export const RefreshDashboardData: React.FunctionComponent<IRefreshDashboardData
title={l10n.t(LocalizationKey.dashboardHeaderRefreshDashboardLabel)}
onClick={refresh}
>
<RefreshIcon className={`h-5 w-5`} />
<ArrowPathIcon className={`h-5 w-5`} />
<span className="sr-only">{l10n.t(LocalizationKey.dashboardHeaderRefreshDashboardLabel)}</span>
</button>
);
src/dashboardWebView/components/Header/Searchbox.tsx
+2 -2
View File
@@ -1,4 +1,4 @@
import { SearchIcon, XCircleIcon } from '@heroicons/react/solid';
import { MagnifyingGlassIcon, XCircleIcon } from '@heroicons/react/24/solid';
import * as React from 'react';
import { useRecoilState, useRecoilValue } from 'recoil';
import { useDebounce } from '../../../hooks/useDebounce';
@@ -48,7 +48,7 @@ export const Searchbox: React.FunctionComponent<ISearchboxProps> = ({
</label>
<div className="relative flex justify-center">
<div className="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
<SearchIcon className={`h-5 w-5 ${getColors(`text-gray-400`, 'text-[var(--vscode-input-foreground)]')}`} aria-hidden="true" />
<MagnifyingGlassIcon className={`h-5 w-5 ${getColors(`text-gray-400`, 'text-[var(--vscode-input-foreground)]')}`} aria-hidden="true" />
</div>
<input
src/dashboardWebView/components/Header/SyncButton.tsx
+2 -2
View File
@@ -1,6 +1,6 @@
import { Messenger } from '@estruyf/vscode/dist/client';
import { EventData } from '@estruyf/vscode/dist/models';
import { RefreshIcon } from '@heroicons/react/outline';
import { ArrowPathIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { useEffect, useState } from 'react';
import { useRecoilValue } from 'recoil';
@@ -57,7 +57,7 @@ export const SyncButton: React.FunctionComponent<ISyncButtonProps> = (
onClick={pull}
disabled={isSyncing}
>
<RefreshIcon
<ArrowPathIcon
className={`w-4 h-4 mr-2 ${isSyncing ? 'animate-reverse-spin' : ''}`}
aria-hidden="true"
/>
src/dashboardWebView/components/Header/Tabs.tsx
+3 -3
View File
@@ -1,4 +1,4 @@
import { DatabaseIcon, PhotographIcon, ScissorsIcon, TagIcon } from '@heroicons/react/outline';
import { CircleStackIcon, PhotoIcon, ScissorsIcon, TagIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { useRecoilValue } from 'recoil';
import { FeatureFlag } from '../../../components/features/FeatureFlag';
@@ -33,7 +33,7 @@ export const Tabs: React.FunctionComponent<ITabsProps> = ({
</li>
<li className="mr-2" role="presentation">
<Tab navigationType={NavigationType.Media} onNavigate={onNavigate}>
<PhotographIcon className={`h-6 w-auto mr-2`} />
<PhotoIcon className={`h-6 w-auto mr-2`} />
<span>{l10n.t(LocalizationKey.dashboardHeaderTabsMedia)}</span>
</Tab>
</li>
@@ -48,7 +48,7 @@ export const Tabs: React.FunctionComponent<ITabsProps> = ({
<FeatureFlag features={mode?.features || []} flag={FEATURE_FLAG.dashboard.data.view}>
<li className="mr-2" role="presentation">
<Tab navigationType={NavigationType.Data} onNavigate={onNavigate}>
<DatabaseIcon className={`h-6 w-auto mr-2`} />
<CircleStackIcon className={`h-6 w-auto mr-2`} />
<span>{l10n.t(LocalizationKey.dashboardHeaderTabsData)}</span>
</Tab>
</li>
src/dashboardWebView/components/Header/ViewSwitch.tsx
+3 -3
View File
@@ -1,7 +1,7 @@
import * as React from 'react';
import { useRecoilState, useRecoilValue } from 'recoil';
import { ViewAtom, SettingsSelector } from '../../state';
import { ViewListIcon, ViewGridIcon } from '@heroicons/react/solid';
import { Bars4Icon, Squares2X2Icon } from '@heroicons/react/24/solid';
import { Messenger } from '@estruyf/vscode/dist/client';
import { DashboardMessage } from '../../DashboardMessage';
import { DashboardViewType } from '../../models';
@@ -40,7 +40,7 @@ export const ViewSwitch: React.FunctionComponent<IViewSwitchProps> = (
type={`button`}
onClick={toggleView}
>
<ViewGridIcon className={`w-4 h-4`} />
<Squares2X2Icon className={`w-4 h-4`} />
<span className={`sr-only`}>
{l10n.t(LocalizationKey.dashboardHeaderViewSwitchToGrid)}
</span>
@@ -52,7 +52,7 @@ export const ViewSwitch: React.FunctionComponent<IViewSwitchProps> = (
type={`button`}
onClick={toggleView}
>
<ViewListIcon className={`w-4 h-4`} />
<Bars4Icon className={`w-4 h-4`} />
<span className={`sr-only`}>
{l10n.t(LocalizationKey.dashboardHeaderViewSwitchToList)}
</span>
src/dashboardWebView/components/Layout/SponsorMsg.tsx
+1 -1
View File
@@ -1,4 +1,4 @@
import { HeartIcon, StarIcon } from '@heroicons/react/outline';
import { HeartIcon, StarIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { REVIEW_LINK, SPONSOR_LINK } from '../../../constants';
import { VersionInfo } from '../../../models';
src/dashboardWebView/components/Media/DetailsSlideOver.tsx
+3 -3
View File
@@ -1,5 +1,5 @@
import { Dialog, Transition } from '@headlessui/react';
import { PencilAltIcon, XIcon } from '@heroicons/react/outline';
import { PencilSquareIcon, XMarkIcon } from '@heroicons/react/24/outline';
import { format } from 'date-fns';
import { basename } from 'path';
import * as React from 'react';
@@ -129,7 +129,7 @@ export const DetailsSlideOver: React.FunctionComponent<IDetailsSlideOverProps> =
onClick={onDismiss}
>
<span className="sr-only">{l10n.t(LocalizationKey.dashboardMediaPanelClose)}</span>
<XIcon className="h-6 w-6" aria-hidden="true" />
<XMarkIcon className="h-6 w-6" aria-hidden="true" />
</button>
</div>
</div>
@@ -270,7 +270,7 @@ export const DetailsSlideOver: React.FunctionComponent<IDetailsSlideOverProps> =
<h3 className={`text-base flex items-center text-[var(--vscode-foreground)]`}>
<span>{l10n.t(LocalizationKey.dashboardMediaMetadataPanelFormMetadataTitle)}</span>
<button onClick={onEdit}>
<PencilAltIcon className="w-4 h-4 ml-2" aria-hidden="true" />
<PencilSquareIcon className="w-4 h-4 ml-2" aria-hidden="true" />
<span className="sr-only">{l10n.t(LocalizationKey.commonEdit)}</span>
</button>
</h3>
src/dashboardWebView/components/Media/FolderCreation.tsx
+4 -4
View File
@@ -1,5 +1,5 @@
import * as React from 'react';
import { FolderAddIcon, LightningBoltIcon } from '@heroicons/react/outline';
import { FolderPlusIcon, BoltIcon } from '@heroicons/react/24/outline';
import { useRecoilValue } from 'recoil';
import { DashboardMessage } from '../../DashboardMessage';
import {
@@ -86,7 +86,7 @@ export const FolderCreation: React.FunctionComponent<IFolderCreationProps> = (
title={l10n.t(LocalizationKey.dashboardMediaFolderCreationHexoCreate)}
onClick={onAssetFolderCreation}
>
<FolderAddIcon className={`mr-2 h-6 w-6`} />
<FolderPlusIcon className={`mr-2 h-6 w-6`} />
<span className={``}>{l10n.t(LocalizationKey.dashboardMediaFolderCreationHexoCreate)}</span>
</button>
);
@@ -102,7 +102,7 @@ export const FolderCreation: React.FunctionComponent<IFolderCreationProps> = (
title={l10n.t(LocalizationKey.dashboardMediaFolderCreationFolderCreate)}
choices={scripts.map((s) => ({
title: s.title,
icon: <LightningBoltIcon className="w-4 h-4 mr-2" />,
icon: <BoltIcon className="w-4 h-4 mr-2" />,
onClick: () => runCustomScript(s)
}))}
onClick={onFolderCreation}
@@ -124,7 +124,7 @@ export const FolderCreation: React.FunctionComponent<IFolderCreationProps> = (
title={l10n.t(LocalizationKey.dashboardMediaFolderCreationFolderCreate)}
onClick={onFolderCreation}
>
<FolderAddIcon className={`mr-2 h-6 w-6`} />
<FolderPlusIcon className={`mr-2 h-6 w-6`} />
<span className={``}>{l10n.t(LocalizationKey.dashboardMediaFolderCreationFolderCreate)}</span>
</button>
</div>
src/dashboardWebView/components/Media/FolderItem.tsx
+1 -1
View File
@@ -1,4 +1,4 @@
import { FolderIcon } from '@heroicons/react/solid';
import { FolderIcon } from '@heroicons/react/24/solid';
import { basename, join } from 'path';
import * as React from 'react';
import { useRecoilState } from 'recoil';
src/dashboardWebView/components/Media/Item.tsx
+12 -12
View File
@@ -2,17 +2,17 @@ import { Messenger } from '@estruyf/vscode/dist/client';
import { Menu } from '@headlessui/react';
import {
ClipboardIcon,
CodeIcon,
CodeBracketIcon,
DocumentIcon,
EyeIcon,
MusicNoteIcon,
MusicalNoteIcon,
PencilIcon,
PhotographIcon,
PhotoIcon,
PlusIcon,
TerminalIcon,
CommandLineIcon,
TrashIcon,
VideoCameraIcon
} from '@heroicons/react/outline';
} from '@heroicons/react/24/outline';
import { basename, dirname } from 'path';
import * as React from 'react';
import { useCallback, useEffect, useMemo, useState } from 'react';
@@ -315,7 +315,7 @@ export const Item: React.FunctionComponent<IItemProps> = ({
key={script.title}
title={
<div className="flex items-center">
<TerminalIcon className="mr-2 h-5 w-5 flex-shrink-0" aria-hidden={true} />{' '}
<CommandLineIcon className="mr-2 h-5 w-5 flex-shrink-0" aria-hidden={true} />{' '}
<span>{script.title}</span>
</div>
}
@@ -361,7 +361,7 @@ export const Item: React.FunctionComponent<IItemProps> = ({
}
if (isImageFile) {
return <PhotographIcon className={`h-1/2 ${colors}`} />;
return <PhotoIcon className={`h-1/2 ${colors}`} />;
}
if (isVideoFile) {
@@ -369,7 +369,7 @@ export const Item: React.FunctionComponent<IItemProps> = ({
}
if (isAudioFile) {
icon = <MusicNoteIcon className={`h-4/6 ${colors}`} />;
icon = <MusicalNoteIcon className={`h-4/6 ${colors}`} />;
}
return (
@@ -471,7 +471,7 @@ export const Item: React.FunctionComponent<IItemProps> = ({
className={`h-1/3 text-white hover:text-[var(--vscode-button-background)]`}
onClick={insertSnippet}
>
<CodeIcon
<CodeBracketIcon
className={`w-full h-full hover:drop-shadow-md `}
aria-hidden="true"
/>
@@ -513,7 +513,7 @@ export const Item: React.FunctionComponent<IItemProps> = ({
{viewData?.data?.position && mediaSnippets.length > 0 && (
<QuickAction title={l10n.t(LocalizationKey.commonInsertSnippet)} onClick={insertSnippet}>
<CodeIcon className={`w-4 h-4`} aria-hidden="true" />
<CodeBracketIcon className={`w-4 h-4`} aria-hidden="true" />
</QuickAction>
)}
</>
@@ -570,7 +570,7 @@ export const Item: React.FunctionComponent<IItemProps> = ({
key={idx}
title={
<div className="flex items-center">
<CodeIcon
<CodeBracketIcon
className="mr-2 h-5 w-5 flex-shrink-0"
aria-hidden={true}
/>{' '}
@@ -668,7 +668,7 @@ export const Item: React.FunctionComponent<IItemProps> = ({
{showSnippetSelection && (
<InfoDialog
icon={<CodeIcon className="h-6 w-6" aria-hidden="true" />}
icon={<CodeBracketIcon className="h-6 w-6" aria-hidden="true" />}
title={l10n.t(LocalizationKey.commonInsertSnippet)}
description={l10n.t(LocalizationKey.dashboardMediaItemInfoDialogSnippetDescription)}
dismiss={() => setShowSnippetSelection(false)}
src/dashboardWebView/components/Media/Media.tsx
+2 -2
View File
@@ -1,5 +1,5 @@
import { Messenger } from '@estruyf/vscode/dist/client';
import { UploadIcon } from '@heroicons/react/outline';
import { ArrowUpTrayIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { useRecoilValue } from 'recoil';
import {
@@ -182,7 +182,7 @@ export const Media: React.FunctionComponent<IMediaProps> = (
'text-[var(--vscode-foreground)] bg-[var(--vscode-editor-background)] opacity-75'
)
}`}>
<UploadIcon className={`h-32`} />
<ArrowUpTrayIcon className={`h-32`} />
<p className={`text-xl max-w-md text-center`}>
{selectedFolder
? l10n.t(LocalizationKey.dashboardMediaMediaFolderUpload, selectedFolder)
src/dashboardWebView/components/Media/SnippetSlideOver.tsx
+2 -2
View File
@@ -1,5 +1,5 @@
import { Dialog, Transition } from '@headlessui/react';
import { XIcon } from '@heroicons/react/outline';
import { XMarkIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { Fragment, useRef } from 'react';
import * as l10n from '@vscode/l10n';
@@ -58,7 +58,7 @@ export const SnippetSlideOver: React.FunctionComponent<ISnippetSlideOverProps> =
onClick={dismiss}
>
<span className="sr-only">{l10n.t(LocalizationKey.dashboardMediaPanelClose)}</span>
<XIcon className="h-6 w-6" aria-hidden="true" />
<XMarkIcon className="h-6 w-6" aria-hidden="true" />
</button>
</div>
</div>
src/dashboardWebView/components/Menu/ActionMenuButton.tsx
+2 -2
View File
@@ -1,5 +1,5 @@
import { Menu } from '@headlessui/react';
import { DotsVerticalIcon } from '@heroicons/react/outline';
import { EllipsisVerticalIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import useThemeColors from '../../hooks/useThemeColors';
@@ -29,7 +29,7 @@ export const ActionMenuButton: React.FunctionComponent<IActionMenuButtonProps> =
}`}
>
<span className="sr-only">{title}</span>
<DotsVerticalIcon className="w-4 h-4" aria-hidden="true" />
<EllipsisVerticalIcon className="w-4 h-4" aria-hidden="true" />
</Menu.Button>
);
};
src/dashboardWebView/components/Menu/MenuButton.tsx
+1 -1
View File
@@ -1,5 +1,5 @@
import { Menu } from '@headlessui/react';
import { ChevronDownIcon } from '@heroicons/react/solid';
import { ChevronDownIcon } from '@heroicons/react/24/solid';
import * as React from 'react';
import useThemeColors from '../../hooks/useThemeColors';
src/dashboardWebView/components/Modals/Alert.tsx
+2 -2
View File
@@ -1,5 +1,5 @@
import { Dialog, Transition } from '@headlessui/react';
import { ExclamationIcon } from '@heroicons/react/outline';
import { ExclamationTriangleIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { Fragment, useRef } from 'react';
import useThemeColors from '../../hooks/useThemeColors';
@@ -74,7 +74,7 @@ export const Alert: React.FunctionComponent<IAlertProps> = ({
'bg-[var(--vscode-sidebar-background)]'
)
}`}>
<ExclamationIcon
<ExclamationTriangleIcon
className={`h-6 w-6 ${getColors(`text-red-500 dark:text-red-50`, `text-[var(--vscode-errorForeground)]`)}`}
aria-hidden="true"
/>
src/dashboardWebView/components/Preview/Preview.tsx
+3 -3
View File
@@ -1,5 +1,5 @@
import { Messenger, messageHandler } from '@estruyf/vscode/dist/client';
import { ArrowRightIcon, ExternalLinkIcon, RefreshIcon } from '@heroicons/react/outline';
import { ArrowRightIcon, ArrowTopRightOnSquareIcon, ArrowPathIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { useEffect, useRef, useState } from 'react';
import { GeneralCommands, PreviewCommands } from '../../../constants';
@@ -101,14 +101,14 @@ export const Preview: React.FunctionComponent<IPreviewProps> = ({
title={l10n.t(LocalizationKey.dashboardPreviewButtonRefreshTitle)}
onClick={onRefresh}
className={`mr-2 ${getColors(`hover:text-vulcan-500 dark:hover:text-whisper-100`, `hover:text-[var(--vscode-textLink-activeForeground)]`)}`}>
<RefreshIcon className="w-4 h-4" aria-hidden="true" />
<ArrowPathIcon className="w-4 h-4" aria-hidden="true" />
</button>
<button
title={l10n.t(LocalizationKey.dashboardPreviewButtonOpenTitle)}
onClick={openInBrowser}
className={`mr-2 ${getColors(`hover:text-vulcan-500 dark:hover:text-whisper-100`, `hover:text-[var(--vscode-textLink-activeForeground)]`)}`}>
<ExternalLinkIcon className="w-4 h-4" aria-hidden="true" />
<ArrowTopRightOnSquareIcon className="w-4 h-4" aria-hidden="true" />
</button>
</div>
)
src/dashboardWebView/components/SettingsView/SettingsLink.tsx
+1 -1
View File
@@ -1,7 +1,7 @@
import * as React from 'react';
import { useRecoilValue } from 'recoil';
import { SettingsSelector } from '../../state';
import { CogIcon } from '@heroicons/react/solid';
import { CogIcon } from '@heroicons/react/24/solid';
import { NavigationType } from '../../models';
export interface ISettingsLinkProps {
src/dashboardWebView/components/SettingsView/SettingsView.tsx
+2 -2
View File
@@ -9,7 +9,7 @@ import { ContentFolders } from '../Configuration/Common/ContentFolders';
import * as l10n from '@vscode/l10n';
import { LocalizationKey } from '../../../localization';
import { COMMAND_NAME } from '../../../constants';
import { RefreshIcon } from '@heroicons/react/outline';
import { ArrowPathIcon } from '@heroicons/react/24/outline';
import { VSCodePanelTab, VSCodePanelView, VSCodePanels } from '@vscode/webview-ui-toolkit/react';
import { CommonSettings } from './CommonSettings';
@@ -36,7 +36,7 @@ export const SettingsView: React.FunctionComponent<ISettingsViewProps> = (_: Rea
className={`inline-flex items-center px-3 py-2 border border-transparent text-sm leading-4 font-medium focus:outline-none rounded text-[var(--vscode-button-foreground)] hover:text-[var(--vscode-button-foreground)] bg-[var(--frontmatter-button-background)] hover:bg-[var(--vscode-button-hoverBackground)] disabled:opacity-50`}
href={`command:${COMMAND_NAME.settingsRefresh}`}
>
<RefreshIcon
<ArrowPathIcon
className={`w-4 h-4 mr-2`}
aria-hidden="true"
/>
src/dashboardWebView/components/SnippetsView/Item.tsx
+8 -8
View File
@@ -1,14 +1,14 @@
import { Messenger } from '@estruyf/vscode/dist/client';
import {
CodeIcon,
CodeBracketIcon,
DocumentTextIcon,
DotsHorizontalIcon,
EllipsisHorizontalIcon,
EyeIcon,
PencilIcon,
PhotographIcon,
PhotoIcon,
PlusIcon,
TrashIcon
} from '@heroicons/react/outline';
} from '@heroicons/react/24/outline';
import * as React from 'react';
import { useCallback, useMemo, useRef, useState } from 'react';
import { useRecoilValue } from 'recoil';
@@ -169,7 +169,7 @@ export const Item: React.FunctionComponent<IItemProps> = ({
)
}`}>
<div className="absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2">
<CodeIcon className={`w-64 h-64 opacity-5 ${getColors(
<CodeBracketIcon className={`w-64 h-64 opacity-5 ${getColors(
'text-vulcan-200 dark:text-gray-400',
'text-[var(--vscode-foreground)]'
)
@@ -181,7 +181,7 @@ export const Item: React.FunctionComponent<IItemProps> = ({
title={snippet.isMediaSnippet ? 'Media snippet' : 'Content snippet'}
>
{snippet.isMediaSnippet ? (
<PhotographIcon className="w-5 h-5 mr-1" aria-hidden={true} />
<PhotoIcon className="w-5 h-5 mr-1" aria-hidden={true} />
) : (
<DocumentTextIcon className="w-5 h-5 mr-1" aria-hidden={true} />
)}
@@ -201,7 +201,7 @@ export const Item: React.FunctionComponent<IItemProps> = ({
)
}`}>
<div className="group-hover:hidden">
<DotsHorizontalIcon className="w-4 h-4" />
<EllipsisHorizontalIcon className="w-4 h-4" />
</div>
<div className="hidden group-hover:flex">
@@ -223,7 +223,7 @@ export const Item: React.FunctionComponent<IItemProps> = ({
)
}`}>
<div className="group-hover:hidden">
<DotsHorizontalIcon className="w-4 h-4" />
<EllipsisHorizontalIcon className="w-4 h-4" />
</div>
<div className="hidden group-hover:flex">
src/dashboardWebView/components/SnippetsView/SnippetInputField.tsx
+1 -1
View File
@@ -1,5 +1,5 @@
import * as React from 'react';
import { ChevronDownIcon } from '@heroicons/react/outline';
import { ChevronDownIcon } from '@heroicons/react/24/outline';
import { Choice, SnippetField, SnippetInfoField } from '../../../models';
import useThemeColors from '../../hooks/useThemeColors';
import { useEffect } from 'react';
src/dashboardWebView/components/SnippetsView/Snippets.tsx
+3 -3
View File
@@ -1,5 +1,5 @@
import { Messenger } from '@estruyf/vscode/dist/client';
import { CodeIcon, PlusSmIcon } from '@heroicons/react/outline';
import { CodeBracketIcon, PlusIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { useCallback, useEffect, useMemo, useState } from 'react';
import { useRecoilValue } from 'recoil';
@@ -115,7 +115,7 @@ export const Snippets: React.FunctionComponent<ISnippetsProps> = (
title={l10n.t(LocalizationKey.dashboardSnippetsViewSnippetsButtonCreate)}
onClick={() => setShowCreateDialog(true)}
>
<PlusSmIcon className={`mr-2 h-6 w-6`} />
<PlusIcon className={`mr-2 h-6 w-6`} />
<span className={`text-sm`}>
{l10n.t(LocalizationKey.dashboardSnippetsViewSnippetsButtonCreate)}
</span>
@@ -147,7 +147,7 @@ export const Snippets: React.FunctionComponent<ISnippetsProps> = (
<div className="w-full h-full flex items-center justify-center text-white">
<div className={`flex flex-col items-center ${getColors('text-gray-500 dark:text-whisper-900', 'text-[var(--frontmatter-text)]')
}`}>
<CodeIcon className="w-32 h-32" />
<CodeBracketIcon className="w-32 h-32" />
<p className="text-3xl mt-2">
{l10n.t(LocalizationKey.dashboardSnippetsViewSnippetsEmptyMessage)}
</p>
src/dashboardWebView/components/Steps/SelectItem.tsx
+2 -2
View File
@@ -1,6 +1,6 @@
import * as React from 'react';
import { CheckCircleIcon, PlusCircleIcon } from '@heroicons/react/outline';
import { CheckCircleIcon as CheckCircleIconSolid, PlusCircleIcon as PlusCircleIconSolid } from '@heroicons/react/solid';
import { CheckCircleIcon, PlusCircleIcon } from '@heroicons/react/24/outline';
import { CheckCircleIcon as CheckCircleIconSolid, PlusCircleIcon as PlusCircleIconSolid } from '@heroicons/react/24/solid';
export interface ISelectItemProps {
title: string;
src/dashboardWebView/components/Steps/Step.tsx
+1 -1
View File
@@ -1,4 +1,4 @@
import { CheckIcon } from '@heroicons/react/outline';
import { CheckIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { Status } from '../../models/Status';
src/dashboardWebView/components/Steps/StepsToGetStarted.tsx
+1 -1
View File
@@ -8,7 +8,7 @@ import { useMemo, useState } from 'react';
import { Menu } from '@headlessui/react';
import { MenuItem } from '../Menu';
import { Framework, StaticFolder, Template } from '../../../models';
import { ChevronDownIcon } from '@heroicons/react/outline';
import { ChevronDownIcon } from '@heroicons/react/24/outline';
import { FrameworkDetectors } from '../../../constants/FrameworkDetectors';
import useThemeColors from '../../hooks/useThemeColors';
import * as l10n from '@vscode/l10n';
src/dashboardWebView/components/Steps/TemplateItem.tsx
+3 -3
View File
@@ -1,5 +1,5 @@
import { UserIcon } from '@heroicons/react/outline';
import { PuzzleIcon } from '@heroicons/react/solid';
import { UserIcon } from '@heroicons/react/24/outline';
import { PuzzlePieceIcon } from '@heroicons/react/24/solid';
import * as React from 'react';
export interface ITemplateItemProps {
@@ -32,7 +32,7 @@ export const TemplateItem: React.FunctionComponent<ITemplateItemProps> = ({
<span>v{version}</span>
</div>
<PuzzleIcon className='absolute top-0 right-2 h-8 w-8 opacity-25' />
<PuzzlePieceIcon className='absolute top-0 right-2 h-8 w-8 opacity-25' />
</button>
);
};
src/dashboardWebView/components/TaxonomyView/FilterInput.tsx
+2 -2
View File
@@ -1,4 +1,4 @@
import { FilterIcon, XCircleIcon } from '@heroicons/react/outline';
import { FunnelIcon, XCircleIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
export interface IFilterInputProps {
@@ -31,7 +31,7 @@ export const FilterInput: React.FunctionComponent<IFilterInputProps> = ({
<div className="relative flex justify-center">
<div className="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
<FilterIcon className={`h-4 w-4 text-[var(--vscode-input-foreground)]`} aria-hidden="true" />
<FunnelIcon className={`h-4 w-4 text-[var(--vscode-input-foreground)]`} aria-hidden="true" />
</div>
<input
src/dashboardWebView/components/TaxonomyView/TaxonomyActions.tsx
+12 -4
View File
@@ -1,10 +1,11 @@
import { Messenger } from '@estruyf/vscode/dist/client';
import {
ArrowCircleUpIcon,
ArrowUpCircleIcon,
PencilIcon,
PlusIcon,
TrashIcon
} from '@heroicons/react/outline';
SquaresPlusIcon,
TrashIcon,
} from '@heroicons/react/24/outline';
import * as React from 'react';
import { useCallback } from 'react';
import { MergeIcon } from '../../../components/icons/MergeIcon';
@@ -72,6 +73,13 @@ export const TaxonomyActions: React.FunctionComponent<ITaxonomyActionsProps> = (
</LinkButton>
)}
<LinkButton
title={`Tag content`}
onClick={onEdit}>
<SquaresPlusIcon className={`w-4 h-4`} aria-hidden={true} />
<span className="sr-only">{l10n.t(LocalizationKey.commonEdit)}</span>
</LinkButton>
<LinkButton
title={l10n.t(LocalizationKey.dashboardTaxonomyViewButtonEditTitle, value)}
onClick={onEdit}>
@@ -91,7 +99,7 @@ export const TaxonomyActions: React.FunctionComponent<ITaxonomyActionsProps> = (
<LinkButton
title={l10n.t(LocalizationKey.dashboardTaxonomyViewButtonMoveTitle)}
onClick={onMove}>
<ArrowCircleUpIcon className={`w-4 h-4`} aria-hidden={true} />
<ArrowUpCircleIcon className={`w-4 h-4`} aria-hidden={true} />
<span className="sr-only">
{l10n.t(LocalizationKey.dashboardTaxonomyViewButtonMoveTitle)}
</span>
src/dashboardWebView/components/TaxonomyView/TaxonomyManager.tsx
+3 -3
View File
@@ -1,5 +1,5 @@
import { Messenger } from '@estruyf/vscode/dist/client';
import { ExclamationIcon, PlusSmIcon, TagIcon } from '@heroicons/react/outline';
import { ExclamationTriangleIcon, PlusIcon, TagIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { useMemo } from 'react';
import { useRecoilValue } from 'recoil';
@@ -173,7 +173,7 @@ export const TaxonomyManager: React.FunctionComponent<ITaxonomyManagerProps> = (
title={l10n.t(LocalizationKey.dashboardTaxonomyViewTaxonomyManagerButtonCreate, taxonomy)}
onClick={onCreate}
>
<PlusSmIcon className={`mr-2 h-6 w-6`} />
<PlusIcon className={`mr-2 h-6 w-6`} />
<span className={`text-sm`}>{l10n.t(LocalizationKey.dashboardTaxonomyViewTaxonomyManagerButtonCreate, taxonomy)}</span>
</button>
</div>
@@ -240,7 +240,7 @@ export const TaxonomyManager: React.FunctionComponent<ITaxonomyManagerProps> = (
className={`px-6 py-4 whitespace-nowrap text-sm font-medium ${getColors(`text-gray-800 dark:text-gray-200`, `text-[var(--frontmatter-text)]`)}`}
title={l10n.t(LocalizationKey.dashboardTaxonomyViewTaxonomyManagerTableUnmappedTitle)}
>
<ExclamationIcon className="inline-block h-4 w-4 mr-2" />
<ExclamationTriangleIcon className="inline-block h-4 w-4 mr-2" />
<span>{item}</span>
</td>
<td className={`px-6 py-4 whitespace-nowrap text-sm font-medium ${getColors(`text-gray-800 dark:text-gray-200`, `text-[var(--frontmatter-text)]`)}`}>
src/dashboardWebView/components/TaxonomyView/TaxonomyView.tsx
+2 -2
View File
@@ -1,5 +1,5 @@
import { Messenger } from '@estruyf/vscode/dist/client';
import { ChevronRightIcon, DownloadIcon } from '@heroicons/react/outline';
import { ChevronRightIcon, ArrowDownTrayIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { useEffect, useState } from 'react';
import { useRecoilValue } from 'recoil';
@@ -55,7 +55,7 @@ export const TaxonomyView: React.FunctionComponent<ITaxonomyViewProps> = ({
title={l10n.t(LocalizationKey.dashboardTaxonomyViewTaxonomyViewButtonImport)}
onClick={onImport}
>
<DownloadIcon className={`w-5 mr-2`} />
<ArrowDownTrayIcon className={`w-5 mr-2`} />
<span>{l10n.t(LocalizationKey.dashboardTaxonomyViewTaxonomyViewButtonImport)}</span>
</button>
}
src/dashboardWebView/components/UnknownView/UnknownView.tsx
+1 -1
View File
@@ -1,4 +1,4 @@
import { StopIcon } from '@heroicons/react/outline';
import { StopIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import useThemeColors from '../../hooks/useThemeColors';
import * as l10n from '@vscode/l10n';
src/dashboardWebView/components/WelcomeView/WelcomeScreen.tsx
+1 -1
View File
@@ -1,4 +1,4 @@
import { BookOpenIcon, HeartIcon, StarIcon } from '@heroicons/react/outline';
import { BookOpenIcon, HeartIcon, StarIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { DOCUMENTATION_LINK, GITHUB_LINK, REVIEW_LINK, SPONSOR_LINK, TelemetryEvent } from '../../../constants';
import { Messenger } from '@estruyf/vscode/dist/client';
src/panelWebView/components/DataBlock/DataBlockField.tsx
+1 -1
View File
@@ -1,7 +1,7 @@
import * as React from 'react';
import { useState, useCallback, useEffect, useMemo } from 'react';
import { BlockFieldData, Field, FieldGroup, PanelSettings } from '../../../models';
import { PencilIcon } from '@heroicons/react/outline';
import { PencilIcon } from '@heroicons/react/24/outline';
import { DataBlockRecords, DataBlockSelector } from '.';
import { SortEnd } from 'react-sortable-hoc';
import { arrayMoveImmutable } from 'array-move';
src/panelWebView/components/DataBlock/DataBlockRecord.tsx
+2 -2
View File
@@ -1,5 +1,5 @@
import * as React from 'react';
import { PencilIcon, SelectorIcon, TrashIcon } from '@heroicons/react/outline';
import { PencilIcon, ChevronUpDownIcon, TrashIcon } from '@heroicons/react/24/outline';
import { SortableHandle, SortableElement } from 'react-sortable-hoc';
import * as l10n from '@vscode/l10n';
import { LocalizationKey } from '../../../localization';
@@ -15,7 +15,7 @@ export interface IDataBlockRecordProps {
const DragHandle = SortableHandle(() => (
<span className="drag_handler">
<SelectorIcon />
<ChevronUpDownIcon />
</span>
));
src/panelWebView/components/DataBlock/DataBlockRecords.tsx
+2 -2
View File
@@ -1,4 +1,4 @@
import { CollectionIcon, PlusIcon } from '@heroicons/react/outline';
import { RectangleStackIcon, PlusIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { VsLabel } from '../VscodeComponents';
import { DataBlockRecord } from '.';
@@ -55,7 +55,7 @@ export const DataBlockRecords = ({
<VsLabel>
<div className={`metadata_field__label`}>
<div>
<CollectionIcon style={{ width: '16px', height: '16px' }} />
<RectangleStackIcon style={{ width: '16px', height: '16px' }} />
<span style={{ lineHeight: '16px' }}>
{l10n.t(LocalizationKey.panelDataBlockDataBlockRecordsLabel)}
</span>
src/panelWebView/components/Fields/ChoiceButton.tsx
+2 -2
View File
@@ -1,4 +1,4 @@
import { XIcon } from '@heroicons/react/outline';
import { XMarkIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import * as l10n from '@vscode/l10n';
import { LocalizationKey } from '../../../localization';
@@ -23,7 +23,7 @@ export const ChoiceButton: React.FunctionComponent<IChoiceButtonProps> = ({
onClick={() => onClick(value)}
>
<span>{title}</span>
<XIcon className={`metadata_field__choice__button_icon`} />
<XMarkIcon className={`metadata_field__choice__button_icon`} />
</button>
);
};
src/panelWebView/components/Fields/ChoiceField.tsx
+1 -1
View File
@@ -1,4 +1,4 @@
import { CheckIcon, ChevronDownIcon } from '@heroicons/react/outline';
import { CheckIcon, ChevronDownIcon } from '@heroicons/react/24/outline';
import Downshift from 'downshift';
import * as React from 'react';
import { useEffect, useMemo } from 'react';
src/panelWebView/components/Fields/ContentTypeRelationshipField.tsx
+2 -2
View File
@@ -5,7 +5,7 @@ import { Fragment, useCallback, useEffect, useMemo } from 'react';
import { Page } from '../../../dashboardWebView/models';
import { messageHandler } from '@estruyf/vscode/dist/client/webview';
import { CommandToCode } from '../../CommandToCode';
import { ChevronDownIcon, DocumentAddIcon } from '@heroicons/react/outline';
import { ChevronDownIcon, DocumentPlusIcon } from '@heroicons/react/24/outline';
import * as l10n from '@vscode/l10n';
import { LocalizationKey } from '../../../localization';
import { FieldTitle } from './FieldTitle';
@@ -165,7 +165,7 @@ export const ContentTypeRelationshipField: React.FunctionComponent<IContentTypeR
<div className={`metadata_field ${showRequiredState ? 'required' : ''}`}>
<FieldTitle
label={label}
icon={<DocumentAddIcon />}
icon={<DocumentPlusIcon />}
required={required} />
{
src/panelWebView/components/Fields/CustomField.tsx
+2 -2
View File
@@ -1,4 +1,4 @@
import { CodeIcon } from '@heroicons/react/outline';
import { CodeBracketIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { useEffect, useMemo, useState } from 'react';
import { BaseFieldProps, CustomPanelViewResult } from '../../../models';
@@ -42,7 +42,7 @@ export const CustomField: React.FunctionComponent<ICustomFieldProps> = ({ label,
return (
<div className={`metadata_field`}>
<FieldTitle label={label} icon={<CodeIcon />} required={required} />
<FieldTitle label={label} icon={<CodeBracketIcon />} required={required} />
<div className="metadata_field">
<div dangerouslySetInnerHTML={{ __html: customHtml }} />
src/panelWebView/components/Fields/DataFileField.tsx
+2 -2
View File
@@ -1,5 +1,5 @@
import { messageHandler } from '@estruyf/vscode/dist/client';
import { ChevronDownIcon, DatabaseIcon } from '@heroicons/react/outline';
import { ChevronDownIcon, CircleStackIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { useCallback, useEffect, useMemo, useState } from 'react';
import { CommandToCode } from '../../CommandToCode';
@@ -142,7 +142,7 @@ export const DataFileField: React.FunctionComponent<IDataFileFieldProps> = ({
return (
<div className={`metadata_field ${showRequiredState ? 'required' : ''}`}>
<FieldTitle label={label} icon={<DatabaseIcon />} required={required} />
<FieldTitle label={label} icon={<CircleStackIcon />} required={required} />
<Downshift
ref={dsRef}
src/panelWebView/components/Fields/DateTimeField.tsx
+1 -1
View File
@@ -1,5 +1,5 @@
import * as React from 'react';
import { ClockIcon } from '@heroicons/react/outline';
import { ClockIcon } from '@heroicons/react/24/outline';
import DatePicker from 'react-datepicker';
import { forwardRef, useEffect, useMemo } from 'react';
import { DateHelper } from '../../../helpers/DateHelper';
src/panelWebView/components/Fields/FileField.tsx
+1 -1
View File
@@ -1,5 +1,5 @@
import { Messenger } from '@estruyf/vscode/dist/client';
import { DocumentIcon, PaperClipIcon, TrashIcon } from '@heroicons/react/outline';
import { DocumentIcon, PaperClipIcon, TrashIcon } from '@heroicons/react/24/outline';
import { basename } from 'path';
import * as React from 'react';
import { useCallback, useMemo } from 'react';
src/panelWebView/components/Fields/ImageFallback.tsx
+1 -1
View File
@@ -1,4 +1,4 @@
import { XCircleIcon } from '@heroicons/react/solid';
import { XCircleIcon } from '@heroicons/react/24/solid';
import * as React from 'react';
import * as l10n from '@vscode/l10n';
import { LocalizationKey } from '../../../localization';
src/panelWebView/components/Fields/ListField.tsx
+2 -2
View File
@@ -1,4 +1,4 @@
import { PencilIcon, TrashIcon, ViewListIcon } from '@heroicons/react/outline';
import { PencilIcon, TrashIcon, ListBulletIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { useCallback, useEffect, useMemo, useRef } from 'react';
import { BaseFieldProps } from '../../../models';
@@ -88,7 +88,7 @@ export const ListField: React.FunctionComponent<IListFieldProps> = ({
return (
<div className={`list_field ${showRequiredState ? 'required' : ''}`}>
<FieldTitle label={label} icon={<ViewListIcon />} required={required} />
<FieldTitle label={label} icon={<ListBulletIcon />} required={required} />
<input
ref={inputRef}
src/panelWebView/components/Fields/NumberField.tsx
+1 -1
View File
@@ -1,4 +1,4 @@
import { CalculatorIcon } from '@heroicons/react/outline';
import { CalculatorIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { useEffect, useMemo } from 'react';
import { BaseFieldProps, NumberOptions } from '../../../models';
src/panelWebView/components/Fields/PreviewImageField.tsx
+3 -3
View File
@@ -1,5 +1,5 @@
import { Messenger, messageHandler } from '@estruyf/vscode/dist/client';
import { PhotographIcon } from '@heroicons/react/outline';
import { PhotoIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { useCallback, useEffect, useMemo } from 'react';
import { DefaultFieldValues } from '../../../constants';
@@ -95,7 +95,7 @@ export const PreviewImageField: React.FunctionComponent<IPreviewImageFieldProps>
return (
<div className={`metadata_field`}>
<FieldTitle label={label} icon={<PhotographIcon />} required={required} />
<FieldTitle label={label} icon={<PhotoIcon />} required={required} />
<div
className={`metadata_field__preview_image ${multiple && imageData && (imageData as PreviewImageValue[]).length > 0
@@ -110,7 +110,7 @@ export const PreviewImageField: React.FunctionComponent<IPreviewImageFieldProps>
type="button"
onClick={selectImage}
>
<PhotographIcon />
<PhotoIcon />
<span>
{l10n.t(LocalizationKey.panelFieldsPreviewImageFieldAdd, (label?.toLowerCase() || 'image'))}
</span>
src/panelWebView/components/Fields/SlugField.tsx
+2 -2
View File
@@ -1,6 +1,6 @@
import { Messenger } from '@estruyf/vscode/dist/client';
import { EventData } from '@estruyf/vscode/dist/models';
import { LinkIcon, RefreshIcon } from '@heroicons/react/outline';
import { LinkIcon, ArrowPathIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { useCallback, useEffect, useMemo } from 'react';
import { BaseFieldProps } from '../../../models';
@@ -93,7 +93,7 @@ export const SlugField: React.FunctionComponent<ISlugFieldProps> = ({
}`}
onClick={updateSlug}
>
<RefreshIcon aria-hidden={true} />
<ArrowPathIcon aria-hidden={true} />
</button>
</div>
src/panelWebView/components/Fields/TextField.tsx
+1 -1
View File
@@ -1,4 +1,4 @@
import { PencilIcon, SparklesIcon } from '@heroicons/react/outline';
import { PencilIcon, SparklesIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { useCallback, useEffect, useMemo } from 'react';
import { useRecoilState } from 'recoil';
src/panelWebView/components/Git/GitAction.tsx
+2 -2
View File
@@ -1,6 +1,6 @@
import { Messenger } from '@estruyf/vscode/dist/client';
import { EventData } from '@estruyf/vscode/dist/models';
import { RefreshIcon } from '@heroicons/react/outline';
import { ArrowPathIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { useEffect, useState } from 'react';
import { GeneralCommands } from '../../../constants';
@@ -50,7 +50,7 @@ export const GitAction: React.FunctionComponent<IGitActionProps> = ({
onClick={pull}
title={
<div className="git_actions__sync">
<RefreshIcon className={isSyncing ? 'animate-spin' : ''} />
<ArrowPathIcon className={isSyncing ? 'animate-spin' : ''} />
<span>
{l10n.t(LocalizationKey.commonSync)}
</span>
src/panelWebView/components/JsonField/JsonField.tsx
+1 -1
View File
@@ -1,7 +1,7 @@
import * as React from 'react';
import { useState, useMemo, useCallback, useEffect } from 'react';
import { Field, PanelSettings } from '../../../models';
import { PencilIcon } from '@heroicons/react/outline';
import { PencilIcon } from '@heroicons/react/24/outline';
import { VsLabel } from '../VscodeComponents';
import { JsonFieldRecords, JsonFieldForm, JsonFieldSelector } from '.';
import { SortEnd } from 'react-sortable-hoc';
src/panelWebView/components/JsonField/JsonFieldForm.tsx
-2
View File
@@ -3,8 +3,6 @@ import { useEffect, useMemo, useState } from 'react';
import JSONSchemaBridge from 'uniforms-bridge-json-schema';
import { AutoFields, AutoForm, ErrorsField } from '../../../components/uniforms-frontmatter';
import { JsonFieldControls } from './JsonFieldControls';
import { JsonFieldRecord } from './JsonFieldRecord';
import { CollectionIcon, PencilIcon, TrashIcon } from '@heroicons/react/outline';
import Ajv from 'ajv';
export interface IJsonFieldFormProps {
src/panelWebView/components/JsonField/JsonFieldRecord.tsx
+2 -2
View File
@@ -1,5 +1,5 @@
import * as React from 'react';
import { PencilIcon, SelectorIcon, TrashIcon } from '@heroicons/react/outline';
import { PencilIcon, ChevronUpDownIcon, TrashIcon } from '@heroicons/react/24/outline';
import { SortableHandle, SortableElement } from 'react-sortable-hoc';
export interface IJsonFieldRecordProps {
id: number;
@@ -12,7 +12,7 @@ export interface IJsonFieldRecordProps {
const DragHandle = SortableHandle(() => (
<span className="drag_handler">
<SelectorIcon />
<ChevronUpDownIcon />
</span>
));
src/panelWebView/components/JsonField/JsonFieldRecords.tsx
+2 -2
View File
@@ -1,4 +1,4 @@
import { CollectionIcon, PlusIcon } from '@heroicons/react/outline';
import { CircleStackIcon, PlusIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import { VsLabel } from '../VscodeComponents';
import { JsonFieldRecord } from '.';
@@ -33,7 +33,7 @@ export const JsonFieldRecords = ({
<VsLabel>
<div className={`metadata_field__label`}>
<div>
<CollectionIcon style={{ width: '16px', height: '16px' }} />
<CircleStackIcon style={{ width: '16px', height: '16px' }} />
<span style={{ lineHeight: '16px' }}>Records</span>
</div>
src/panelWebView/components/OtherActions.tsx
+1 -1
View File
@@ -11,7 +11,7 @@ import { WritingIcon } from './Icons/WritingIcon';
import { OtherActionButton } from './OtherActionButton';
import { DOCUMENTATION_LINK, DOCUMENTATION_SETTINGS_LINK, ISSUE_LINK } from '../../constants/Links';
import { Messenger } from '@estruyf/vscode/dist/client';
import { BookOpenIcon } from '@heroicons/react/outline';
import { BookOpenIcon } from '@heroicons/react/24/outline';
import * as l10n from '@vscode/l10n';
import { LocalizationKey } from '../../localization';
src/panelWebView/components/Tag.tsx
+2 -2
View File
@@ -1,4 +1,4 @@
import { PlusIcon, XIcon } from '@heroicons/react/outline';
import { PlusIcon, XMarkIcon } from '@heroicons/react/24/outline';
import * as React from 'react';
import * as l10n from '@vscode/l10n';
import { LocalizationKey } from '../../localization';
@@ -38,7 +38,7 @@ const Tag: React.FunctionComponent<ITagProps> = (props: React.PropsWithChildren<
className={`tag__delete`}
type={`button`}
onClick={() => onRemove(value)}>
<XIcon style={{ width: `1rem`, height: `1rem` }} />
<XMarkIcon style={{ width: `1rem`, height: `1rem` }} />
</button>
</div>
</>
src/panelWebView/components/TagPicker.tsx
+1 -1
View File
@@ -12,7 +12,7 @@ import { FieldMessage } from './Fields/FieldMessage';
import { FieldTitle } from './Fields/FieldTitle';
import { useRecoilValue } from 'recoil';
import { PanelSettingsAtom } from '../state';
import { SparklesIcon } from '@heroicons/react/outline';
import { SparklesIcon } from '@heroicons/react/24/outline';
import * as l10n from '@vscode/l10n';
import { LocalizationKey } from '../../localization';
import useDropdownStyle from '../hooks/useDropdownStyle';