feat(input-image): add <SInputImage> (#356)

[kiaking]

• require feat(styles): new color system #367
• close Add <SInputImage> #356

Add <SInputImage>. Pretty much followed all issue spec. Adjusted tiny wording of text.

Also, this PR contains new useImageSrcFromFile composable that can read image src from file.

• Add docs

---

[netlify]

✅ Deploy Preview for sefirot-story ready!

Name	Link
🔨 Latest commit	d8ae08d
🔍 Latest deploy log	https://app.netlify.com/sites/sefirot-story/deploys/654842809978e300088ab1eb
😎 Deploy Preview	https://deploy-preview-368--sefirot-story.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[netlify]

✅ Deploy Preview for sefirot-docs ready!

Name	Link
🔨 Latest commit	d8ae08d
🔍 Latest deploy log	https://app.netlify.com/sites/sefirot-docs/deploys/65484280c3c294000849a7dc
😎 Deploy Preview	https://deploy-preview-368--sefirot-docs.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[codecov]

Codecov Report

Attention: 285 lines in your changes are missing coverage. Please review.

Comparison is base (cc09f3c) 82.13% compared to head (d8ae08d) 80.19%.

Additional details and impacted files

@@            Coverage Diff             @@
##             main     #368      +/-   ##
==========================================
- Coverage   82.13%   80.19%   -1.94%     
==========================================
  Files         147      149       +2     
  Lines       11792    12079     +287     
  Branches      516      517       +1     
==========================================
+ Hits         9685     9687       +2     
- Misses       2107     2392     +285     

Files	Coverage Δ
lib/support/Utils.ts	91.30% <50.00%> (-8.70%)	⬇️
lib/composables/Image.ts	0.00% <0.00%> (ø)
lib/components/SInputImage.vue	0.00% <0.00%> (ø)

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[brc-dd]

wait a second, select image is not responsive after you remove it 👀

[kiaking]

Oh sit lol

[kiaking]

Whaat...

[brc-dd]

I'll fix it separately, some ref issue probably.

[kiaking]

Gotcha. Thanks. Or maybe Histoire issue...?

[kiaking]

It's working for me on Histoire 🤔

[brc-dd]

#369, I was removing and uploading the same image 😅 (I only have like one dummy image on my system 😂)

[kiaking]

Ahhhh I see. And that I wasn't doing 😳 Nice catch.