focusreactive/sanity-plugin-inline-svg-input

Sanity plugin to upload and preview inline SVGs

sanity-plugin-inline-svg-input's Issues

Don't we need to wrap it into a label?

sanity-plugin-inline-svg-input/src/InlineSvgInput.tsx

Line 129 in cf4aa8e

<input

Please go through these comments on README before publishing

sanity-plugin-inline-svg-input/README.md

Line 5 in cf4aa8e



can we put all screenshots to a doc/ folder. then this folder should be in .npmignore and image URL should be absolute ones from gitjub content (this way they will be shown on NPM page)

also can we have here own SVG? e.g. FR logo

sanity-plugin-inline-svg-input/README.md

Line 50 in cf4aa8e

add here something like "that's it! now you can use this field to upload SVG images and see the preview in your Sanity Studio". Show the response example of how it will come to frontend. Then "in case you want this field to be used as a document preview, you have to add a few more settings..."

sanity-plugin-inline-svg-input/README.md

Line 60 in cf4aa8e

const IconsListItem = defineType({

add how to import component

sanity-plugin-inline-svg-input/README.md

Line 65 in cf4aa8e

type: 'string',

could you swap here so the type fields go after name

sanity-plugin-inline-svg-input/README.md

Line 70 in cf4aa8e

name: 'text',

minor but I'd suggest not using name: 'text' because text is also a possible field type

sanity-plugin-inline-svg-input/README.md

Line 85 in cf4aa8e

preview: (props: PreviewProps<PreviewLayoutKey>) => {

not clear about PreviewProps and PreviewLayoutKey is it something from Sanity types? show how to import them

sanity-plugin-inline-svg-input/README.md

Line 86 in cf4aa8e

return <InlineSvgPreviewItem {...props} />

if component accept only 3 certain props let's better show them directly:

return <InlineSvgPreviewItem title={title} subtitle={subtitile} icon={icon} />

BTW is it really work this way? I thought we couldn't specify the entire card for a component including the title and subtitle

sanity-plugin-inline-svg-input/README.md

Line 91 in cf4aa8e

const IconsList = defineType({

please add a few words here to explain that this is a component having an array of bla-bla-bla....
Also let's follow such approach: of: [{ type: iconsListItem.name }],

sanity-plugin-inline-svg-input/README.md

Line 100 in cf4aa8e

If you want to use the SVG in your preview component, you can use the `InlineSvgPreviewComponent`:

it's not clear actually what is that about? a preview similar to previous sections would be good and give more details about where this component should be added

sanity-plugin-inline-svg-input/README.md

Line 18 in cf4aa8e

pnpm add @focus-reactive/sanity-plugin-inline-svg-input

OMG! It's not compatible with Bun? 😁

sanity-plugin-inline-svg-input/README.md

Line 114 in cf4aa8e

## Develop & test

please add also here a few standard lines about how to run it locally

Double check package.json

sanity-plugin-inline-svg-input/package.json

Line 45 in cf4aa8e

"prepublishOnly": "run-s build",

is it something we need to run manually? if publishing process isn't just trivial npm publish please add a "publish" sections to readme

sanity-plugin-inline-svg-input/package.json

Line 32 in cf4aa8e

"types": "./dist/index.d.ts",

please make sure we have d.ts file generated on the package build step

sanity-plugin-inline-svg-input/package.json

Line 5 in cf4aa8e

"keywords": [

I believe we can add a few more keywords here

https://github.com/focusreactive/sanity-plugin-inline-svg-input/blob/cf4aa8e0209debd1657d01bb675f4d439510cdbb/package.json#L74C36-L74C36

minor: do we really need this in dev dependencies?

https://github.com/focusreactive/sanity-plugin-inline-svg-input/blob/cf4aa8e0209debd1657d01bb675f4d439510cdbb/package.json#L50C6-L50C15

do we mention in README that we have this feature?

https://github.com/focusreactive/sanity-plugin-inline-svg-input/blob/cf4aa8e0209debd1657d01bb675f4d439510cdbb/package.json#L78C20-L78C20

does v18 is a requirement?

TypeError: DOMPurify__default.default.sanitize is not a function

<InlineSvgPreviewComponent value={category.svgIcon} >

Error:
TypeError: DOMPurify__default.default.sanitize is not a function

Add .npmignore

sanity-plugin-inline-svg-input/.gitignore

Line 60 in cf4aa8e

dist

when package don't have NPM ignore file, the .gitignore will be used instead for packing files into a package. so it wouldn't put dist folder

Actually the better practice is to have a separate .npmignore file and use it to control what files we want to have in our npm package. e.g. src could be ignored

Add Styled Components to peer dependencies

sanity-plugin-inline-svg-input/src/InlineSvgInput.tsx

Line 3 in cf4aa8e

import styled, { css } from 'styled-components'

Check before publishing

sanity-plugin-inline-svg-input/package.config.ts

Line 8 in cf4aa8e

// Remove this block to enable strict export validation

is it something we need to do?

Dist config usage

https://github.com/focusreactive/sanity-plugin-inline-svg-input/blob/cf4aa8e0209debd1657d01bb675f4d439510cdbb/tsconfig.dist.json#L1C2-L1C2

I didn't find any reference to this file. How does it work?

Do we show these props in Readme?

sanity-plugin-inline-svg-input/src/InlineSvgPreviewComponent.tsx

Line 14 in cf4aa8e

className,