Unofficial static Figma frame/file viewer available as HTML CustomElement
Commits at aae86f709a6a81678f5fc134e821fb452fd621ad
aae86f70feat: Feedback UI for copy operation
Previously there was no feedback for copy (CSS code, text contents)
therefore a user was not able to know whether the copy operation is
succeeded or not. This commit adds common UI (snackbar) as a feedback UI
for the copy operation.
Shota FUJI
authored at
Shota FUJI
comitted at
43f53b8fMerge pull request #46 from pocka/feature/v2-wip
v2Shota FUJI
authored at
GitHub
comitted at
f240007bdocs: Add many nodes example
In order to tackle https://github.com/pocka/figspec/issues/30
Twemoji is ideal for this purpose: a lot of nodes, complex shapes,
uniqueness among nodes.
Shota FUJI
authored at
Shota FUJI
comitted at
7956a99ffix: Do not use overflowing small <svg>
During rewriting FigspecViewer from Lit to DOM (without libraries),
I noticed not using overflowing small <svg> fixes long-standing and
thought-to-be-hard-to-fix issues at once. Since the fix is easily
appliable to the current code base, here it is.
The <svg> element works as a layer for guidelines, has had viewBox
size of `0 0 5 5` and most of the paint is rendered as overflowing
content. The problem is, this is the cause of Safari does not trigger
pointer-related actions and Blink renders guidelines at incorrect
positions (slightly shifted).
* https://github.com/pocka/figspec/issues/37
* https://github.com/pocka/figspec/issues/31
The code is there from the start[^0] and I don't remember why it being
this... my guess is limitation of being a nested custom-element and
forgot to change on the refactor[^1]. After searching for noticeable
differences using `git stash`, the only changes are those bugs fixed.
I expected overflow/scroll related issues but no noticeable regression
found.
[^0]: https://github.com/pocka/figspec/blob/2a57a99908d62f050675d365da74ad9249c281e5/packages/components/src/FigmaViewerGuide/index.ts#L152-L153
[^1]: https://github.com/pocka/figspec/commit/d8991c590cb831a443f2bf97489e4f1142eab81b#diff-a21bd58f460ace3ded3e7274f284ecb4a2e988db51fab687cc64c2dcdccc5093R345-R346
Fix confirmed on macOS Safari 16.5.2, Firefox 115.0.2 (Linux) and
Chromium 115.0.5790.110 (Linux).
Shota FUJI
authored at
Shota FUJI
comitted at
aa51b230chore: Fix ignore rule for packaged tarball
Forgot to change when ditched monorepo.
4b677892bcfe36b967e292cf8431521eb47104ae
Shota FUJI
authored at
Shota FUJI
comitted at
aeb1a82cchore: Remove Storybook
00a896342ae384ec4a450467a500da462bb77959 introduced a docs site,
which includes Storybook equivalent working examples.
Shota FUJI
authored at
Shota FUJI
comitted at
00a89634docs: Add docs site
When I upgraded Storybook to v7, Docs Addon stopped reading JSDoc
comments. The feature, along with UX for the Docs Page (as an end-user)
have not been great from the start. So I decided to write a document
site from scratch, as the complexity of this project is not high.
Upon writing the docs, I realized I no longer need Storybook anymore
thanks to simple playground section.
* Figspec elements are Custom Element: no need for style isolation
and it just works with `<iframe>`.
* Minimum HTML+JS+class-less CSS is very lightweight, simple and
robust. Goodbye monstrously huge dependencies.
* Because how Custom Elements work, HMR is not a thing. Reload is always
required and this simple docs site is way faster at the page startup
speed.
* I'm dubious about web-component-analyzer's future and current quality.
Years passed but it's still "for experimental and demo purposes".
In the end, burden of duplicated documentation because of Mixins and
lack of stability outweighed the merit.
Simple `<iframe>` and HTML/JS per stories solved my problem.
It does not allow me to change parameter (Args, in Storybook) but I've
never used the feature in this project. For Viewport Addon
functionality, just open the frame in new tab then use browsers'
built-in device emulation. Many devs knowing how to use Storybook
but it can't beat the benefit comes from the reduction of the number
of project's dependencies by removing SB packages.
So I copied stories to "Examples". (technically it's test cases?)
Removal of Storybook and its files are not included in this commit in
order to keep commits' atomicity.
Shota FUJI
authored at
Shota FUJI
comitted at
0a028f9fchore: Upgrade Storybook to v7
I removed Docs Addon related things because:
* it doesn't read components' JSDoc
* with `parameters.docs`, it crashes with error message like
"import_ts_dedent is not a function" (I don't remember exact message)
* hand-written document is far superior, obviously
Shota FUJI
authored at
Shota FUJI
comitted at
9f572c1fchore: Helper script no longer generate filename with colon
https://github.com/pocka/figspec/issues/27
fix #27
Shota Fuji
authored at
Shota Fuji
comitted at
3436642echore: Re-configure husky
Yarn v3 does not have a lifecycle hook equal to or similar to
`postinstall` hook. So I installed this plugin.
https://github.com/sachinraja/yarn-plugin-postinstall-dev
Shota Fuji
authored at
Shota Fuji
comitted at
4b677892chore: Switch to multirepo
https://github.com/pocka/figspec-react/commit/f8308400ffcfa0cfba1c0e0bcc87167407b08957
> * Each package don't recieve frequent updates.
> * Uses independent versioning.
> * Create tags and releases has been hard.
> * It's far easier to manage devDependencies in single repo than in
> monorepo. No need to worry about mixing Storybook versions.
> * User friendly.
Shota Fuji
authored at
Shota Fuji
comitted at
fd11a1d2Merge pull request #43 from brettdewoody/41-support-react-18
Add React 18 as peer dependency.Shota FUJI
authored at
GitHub
comitted at
bbe9ce67feat(components): Basic touch gestures
https://github.com/pocka/figspec/issues/3
Added a dead simple touch gestures.
Shota Fuji
authored at
Shota Fuji
comitted at