From eca2ea4f34e9447bb1a4fc9b8db8579691ee2bec Mon Sep 17 00:00:00 2001 From: Jeremy Valentine <38669521+valentine195@users.noreply.github.com> Date: Fri, 19 Apr 2024 14:32:11 -0400 Subject: [PATCH] fix: Adds icon to Details component --- .github/workflows/node.js.yml | 36 ++ .github/workflows/release-please.yml | 24 ++ .gitignore | 23 ++ .npmrc | 2 + .release-please-manifest.json | 3 + README.md | 509 +++++++++++++++++++++++++++ package.json | 54 +++ release-please-config.json | 12 + src/lib/details/Details.svelte | 111 ++++++ src/lib/index.ts | 1 + svelte.config.js | 19 + tsconfig.json | 21 ++ 12 files changed, 815 insertions(+) create mode 100644 .github/workflows/node.js.yml create mode 100644 .github/workflows/release-please.yml create mode 100644 .gitignore create mode 100644 .npmrc create mode 100644 .release-please-manifest.json create mode 100644 README.md create mode 100644 package.json create mode 100644 release-please-config.json create mode 100644 src/lib/details/Details.svelte create mode 100644 src/lib/index.ts create mode 100644 svelte.config.js create mode 100644 tsconfig.json diff --git a/.github/workflows/node.js.yml b/.github/workflows/node.js.yml new file mode 100644 index 0000000..fab39c5 --- /dev/null +++ b/.github/workflows/node.js.yml @@ -0,0 +1,36 @@ +# This workflow will do a clean installation of node dependencies, cache/restore them, build the source code and run tests across different versions of node +# For more information see: https://docs.github.com/en/actions/automating-builds-and-tests/building-and-testing-nodejs + +name: Build + +on: + workflow_dispatch: + release: + types: [created] + +jobs: + build: + runs-on: ubuntu-latest + strategy: + matrix: + node-version: [20.x] + # See supported Node.js release schedule at https://nodejs.org/en/about/releases/ + steps: + - uses: actions/checkout@v3 + - name: Use Node.js ${{ matrix.node-version }} + uses: actions/setup-node@v3 + with: + node-version: ${{ matrix.node-version }} + cache: 'npm' + registry-url: "https://registry.npmjs.org" + - name: Install + run: npm ci + # - run: npm test + - name: Build + run: npm run build --if-present + - run: npm whoami + env: + NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}} + - run: npm publish --access=public --scope=@javalent + env: + NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}} diff --git a/.github/workflows/release-please.yml b/.github/workflows/release-please.yml new file mode 100644 index 0000000..515fec7 --- /dev/null +++ b/.github/workflows/release-please.yml @@ -0,0 +1,24 @@ +on: + push: + branches: + - main + +permissions: + contents: write + pull-requests: write + +name: release-please + +jobs: + release-please: + runs-on: ubuntu-latest + steps: + - uses: google-github-actions/release-please-action@v4 + with: + # this assumes that you have created a personal access token + # (PAT) and configured it as a GitHub action secret named + # `MY_RELEASE_PLEASE_TOKEN` (this secret name is not important). + token: ${{ secrets.RELEASE_PLEASE_TOKEN }} + # this is a built-in strategy in release-please, see "Action Inputs" + # for more options + release-type: node diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..51a9eea --- /dev/null +++ b/.gitignore @@ -0,0 +1,23 @@ +.DS_Store +node_modules +/build +/.svelte-kit +/package +/dist + +.env +.env.* +!.env.example + +.vercel +.vscode/ + +/src/routes/compotests +/src/routes/typechecktests + +package-lock.json +yarn.lock + +src/routes/testdir/* + +.idea/ diff --git a/.npmrc b/.npmrc new file mode 100644 index 0000000..59d9530 --- /dev/null +++ b/.npmrc @@ -0,0 +1,2 @@ +engine-strict=true +auto-install-peers=true \ No newline at end of file diff --git a/.release-please-manifest.json b/.release-please-manifest.json new file mode 100644 index 0000000..1332969 --- /dev/null +++ b/.release-please-manifest.json @@ -0,0 +1,3 @@ +{ + ".": "0.0.1" +} \ No newline at end of file diff --git a/README.md b/README.md new file mode 100644 index 0000000..f138c02 --- /dev/null +++ b/README.md @@ -0,0 +1,509 @@ +# FLOWBITE-SVELTE + +[![npm version](https://badgen.net/npm/v/flowbite-svelte)](https://www.npmjs.com/package/flowbite-svelte) [![npm downloads](https://badgen.net/npm/dw/flowbite-svelte)](https://www.npmjs.com/package/flowbite-svelte) [![npm downloads](https://badgen.net/npm/dt/flowbite-svelte)](https://www.npmjs.com/package/flowbite-svelte) [![license](https://badgen.net/npm/license/flowbite-svelte)](https://github.com/themesberg/flowbite-svelte/blob/main/LICENSE) [![Discord](https://img.shields.io/discord/902911619032576090?color=%237289da&label=Discord)](https://discord.com/invite/4eeurUVvTy) + +**⚠️ Flowbite Svelte is currently in early development and APIs and packages are likely to change quite often.** + +

+ + Flowbite Svelte UI components +
+ Build websites even faster with Svelte components on top of Tailwind CSS +

+ +[Flowbite Svelte](https://flowbite-svelte.com/) is an official Flowbite UI component library for Svelte. All interactivities are handled by Svelte. + +[Visualize this repo's codebase](https://mango-dune-07a8b7110.1.azurestaticapps.net/?repo=themesberg%2Fflowbite-svelte) + +## Flowbite Svelte Starters + +You can find all the starters in the Starters directory. + +- [Flowbite SvelteKit starter](https://github.com/shinokada/flowbite-svelte-starter) +- [Svelte starter](https://github.com/shinokada/svelte-starter) +- [Svelte TS starter](https://github.com/shinokada/svelte-ts-starter) + +## Flowbite Svelte Examples + +You can find all the examples in the Examples directory. + +- [Flowbite SvelteKit responsive sidebar layout](https://github.com/shinokada/flowbite-sveltekit-responsive-sidebar-layout) + +## Installation + +- [Getting started](https://flowbite-svelte.com/docs/pages/quickstart) +- [Introduction](https://flowbite-svelte.com/docs/pages/introduction) +- [Types](https://flowbite-svelte.com/docs/pages/typescript) +- [How to contribute](https://flowbite-svelte.com/docs/pages/how-to-contribute) +- [License](https://flowbite-svelte.com/docs/pages/license) + +## Documentation + +For full documentation, visit [flowbite-svelte.com](https://flowbite-svelte.com/). + +## Components + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
AlertBadgeBreadcrumb
+ + Svelte Alerts + + + + Svelte Badge + + + + Svelte Breadcrumbs + +
ButtonButton groupCard
+ + Svelte Buttons + + + + Svelte Button Group + + + + Svelte Cards + +
DropdownFormsList group
+ + Svelte Dropdown + + + + Svelte Forms + + + + Svelte List group + +
TypographyModalTabs
+ + Svelte Typography + + + + Svelte Modal + + + + Svelte Tabs + +
NavbarPaginationTimeline
+ + Svelte Navbar + + + + Svelte Pagination + + + + Svelte Timeline + +
Progress barTableToast
+ + Svelte Progress Bar + + + + Svelte Tables + + + + Svelte Toast + +
TooltipDatepickerSpinner
+ + Svelte Tooltips + + + + Svelte Datepicker + + + + Svelte Spinner + +
FooterAccordionSidebar
+ + Svelte Footer + + + + Svelte Accordion + + + + Svelte Sidebar + +
CarouselAvatarRating
+ + Svelte Carousel + + + + Svelte Avatar + + + + Svelte Rating + +
Input FieldFile InputSearch Input
+ + Svelte Input Field + + + + Svelte File Input + + + + Svelte Search Input + +
SelectTextareaCheckbox
+ + Svelte Select + + + + Svelte Textarea + + + + Svelte Checkbox + +
RadioToggleRange Slider
+ + Svelte Radio + + + + Svelte Toggle + + + + Svelte Range Slider + +
Floating LabelMega MenuSkeleton
+ + Svelte Floating Label + + + + Svelte Mega Menu + + + + Svelte Skeleton + +
KBD (keyboard)Drawer (offcanvas)Popover
+ + Svelte KBD (Keyboard) + + + + Svelte Drawer (offcanvas) + + + + Svelte Popover + +
VideoHeadingParagraph
+ + Svelte Video + + + + Svelte Heading + + + + Svelte Paragraph + +
BlockquoteImageList
+ + Svelte Blockquote + + + + Svelte Image + + + + Svelte List + +
LinkTextHorizontal line (HR)
+ + Svelte Link + + + + Svelte Text + + + + Svelte HR + +
Speed DialStepper(TBA)Indicators
+ + Svelte Speed Dial + + + + Svelte Stepper + + + + Svelte Indicators + +
Bottom NavigationSticky BannerGallery (Masonry)
+ + Svelte Bottom Navigation Bar + + + + Svelte Bottom Sticky Banner + + + + Svelte Image Gallery (Masonry) + +
+ +## Community + +If you need help or just want to discuss about the library join the community on Github: + +⌨️ [Discuss about Flowbite on GitHub](https://github.com/themesberg/flowbite-svelte/discussions) + +For casual chatting with others using the library: + +💬 [Join the Flowbite Discord Server](https://discord.gg/4eeurUVvTy) + +## Tests + +**Please use node v16.xx.x.** + +Run: + +```sh +npm run test +``` + +## Create props + +```sh +npm run gen:props +``` + +This will pull all props from components and replace files in `/src/routes/props` directory. + +## Contribute + +Please read [how to contribute](https://github.com/themesberg/flowbite-svelte/blob/main/CONTRIBUTING.md) if you'd like to be part of the Flowbite community of contributors. + +## Changelog + +View the full [changelog](https://github.com/themesberg/flowbite-svelte/blob/main/CHANGELOG.md) on this page. + +## SvelteKit version + +1.0.1 + +## License + +Flowbite Svelte is open-source under the [MIT License](https://flowbite-svelte.com/docs/pages/license). diff --git a/package.json b/package.json new file mode 100644 index 0000000..afe364c --- /dev/null +++ b/package.json @@ -0,0 +1,54 @@ +{ + "name": "@javalent/components", + "version": "0.0.1", + "description": "Commonly used Svelte components for the Javalent plugin ecosystem.", + "main": "dist/index.js", + "author": { + "name": "Jeremy Valentine", + "email": "valentine.195@gmail.com", + "url": "https://javalent.com" + }, + "bugs": "https://github.com/@javalent/components/issues", + "license": "MIT", + "scripts": { + "package": "svelte-kit sync && svelte-package && publint", + "test": "vitest" + }, + "devDependencies": { + "@sveltejs/kit": "^2.5.6", + "@sveltejs/package": "^2.3.1", + "obsidian": "^1.5.7-1", + "publint": "^0.2.7", + "svelte-check": "^3.6.9", + "svelte-preprocess": "^5.1.4", + "tslib": "^2.6.2", + "typescript": "^5.4.5", + "vitest": "^1.5.0" + }, + "peerDependencies": { + "svelte": "^4.2.15" + }, + "type": "module", + "repository": { + "type": "git", + "url": "https://github.com/@javalent/components" + }, + "files": [ + "dist", + "!dist/**/*.test.*", + "!dist/**/*.spec.*" + ], + "svelte": "./dist/index.js", + "types": "./dist/index.d.ts", + "exports": { + ".": { + "types": "./dist/index.d.ts", + "svelte": "./dist/index.js" + }, + "./Details.svelte": { + "types": "./dist/details/Details.svelte.d.ts", + "svelte": "./dist/details/Details.svelte" + }, + "./package.json": "./package.json" + } +} diff --git a/release-please-config.json b/release-please-config.json new file mode 100644 index 0000000..dc17e4c --- /dev/null +++ b/release-please-config.json @@ -0,0 +1,12 @@ +{ + "packages": { + ".": { + "changelog-path": "CHANGELOG.md", + "release-type": "node" + } + }, + "include-component-in-tag": false, + "include-v-in-tag": false, + + "$schema": "https://raw.githubusercontent.com/googleapis/release-please/main/schemas/config.json" +} diff --git a/src/lib/details/Details.svelte b/src/lib/details/Details.svelte new file mode 100644 index 0000000..1ce8a7d --- /dev/null +++ b/src/lib/details/Details.svelte @@ -0,0 +1,111 @@ + + +
+ evt.preventDefault()} + > +
+
+
{name}
+
{desc}
+
+
+
+ {#if open} + + {/if} +
+
+
+
+
+
+
+ +
+ +
+
+ + diff --git a/src/lib/index.ts b/src/lib/index.ts new file mode 100644 index 0000000..06b4256 --- /dev/null +++ b/src/lib/index.ts @@ -0,0 +1 @@ +export { default as Details } from './details/Details.svelte'; diff --git a/svelte.config.js b/svelte.config.js new file mode 100644 index 0000000..abb9299 --- /dev/null +++ b/svelte.config.js @@ -0,0 +1,19 @@ +import preprocess from 'svelte-preprocess'; + +/** @type {import('@sveltejs/kit').Config} */ +const config = { + extensions: ['.svelte'], + + // Consult https://github.com/sveltejs/svelte-preprocess + // for more information about preprocessors + preprocess: [ + preprocess() + ], + vitePlugin: { + inspector: { + holdMode: true + } + }, +}; + +export default config; diff --git a/tsconfig.json b/tsconfig.json new file mode 100644 index 0000000..306d2f2 --- /dev/null +++ b/tsconfig.json @@ -0,0 +1,21 @@ +{ + "extends": "./.svelte-kit/tsconfig.json", + "compilerOptions": { + "allowJs": true, + "checkJs": true, + "declaration": true, + "declarationMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "resolveJsonModule": true, + "skipLibCheck": true, + "sourceMap": true, + "strict": true, + "allowImportingTsExtensions": true, + "noEmit": true + } + // Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias + // + // If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes + // from the referenced tsconfig.json - TypeScript does not merge them in +}