* RadioGroup & Initial UI for Measure * Add option to Panel to allow actions to move to bottom * Typo * Add count to precision * Add enable, snap and type api integrations * Update Units WIP * Add precision update * Update v-tippy name * Updates * New design * Better darkmode radio. Keystrokes. * Styling fixes. Fix select mount-menu-on-body * Fix ts bug * Show label in Select for units * Update shortcut to D * Small design changes * Small tidy ups * WIP New Measurements Helper State * Fix build erros * Remove viewer import from shared * Delete WIP * Fix delete * Fix close button on measure mode * Measurement nullable * Updates from PR * Seperate measurements into measurementsEnabled & measurementOptions * Update state.ts * Update ts bugs * Updates to RadioGroup * Use ctx.updateArgs * Replace RadioGroup with Radio - More consistent with existing inputs * Update FE2 to use new Radio * Fix circleci fail * Fix build * Fix wrong initial state for vertexSnap * Adjust type to measurement * Use Lodash isEqual * Fix bug where units don't update * Remove double input * Fix server error in data.ts * Revert change around useEqual
ui-components
Speckle UI component library built with Vue 3 and relying on the Speckle Tailwind theme.
Setup
- Make sure you have
@speckle/tailwind-themeinstalled and set up with Tailwind - Install
@speckle/ui-components - In your tailwind config import
tailwindContentEntryfrom@speckle/ui-components/tailwind-configureand invoke it in thecontentsfield to ensure PurgeCSS is configured correctly. It requires the CJSrequireobject as its only parameter. If it isn't available (in an ESM environment), you can use node'screateRequire(). - Import
@speckle/ui-components/style.cssin your app. Ifexportsmap isn't supported you can also import from@speckle/ui-components/dist/style.css
Usage in Nuxt v3
It's suggested that you also install the @speckle/ui-components-nuxt Nuxt module. It will ensure that all of the Vue components can be auto-imported like components in nuxt's ./components directory. No need to import them manually anymore and you'll also get proper TS typing in your Vue templates out of the box!
Troubleshooting
Form validation doesn't work
It appears that in some scenarios Nuxt/Vite gets confused and bundles 'vee-validate' twice. To fix this add 'vee-validate' to vite.resolve.dedupe in your nuxt/vite config.
Build
Run yarn build
Development
Develop & test your components in Storybook - yarn storybook
Optionally you can also run yarn dev to run the Vite dev server which runs App.vue and in some special scenarios you might want to debug components there.
Troubleshooting
Styles don't work
Re-start storybook, it could be that you introduced a new tailwind class that was previously purged out