From 0b7ce99b54f106154c3d13971e53d41660d544ca Mon Sep 17 00:00:00 2001 From: Arjan Geertsema Date: Mon, 13 Nov 2023 15:31:54 +0100 Subject: [PATCH] init --- .github/dependabot.yml | 13 + .github/workflows/release.yml | 85 + .gitignore | 46 +- README.md | 39 +- package-lock.json | 4407 +++++++++++++++++ package.json | 45 + src/assets/style/custom-theme.css | 0 src/assets/style/page/custom-theme.css | 0 src/assets/style/page/element/_base.css | 298 ++ src/assets/style/page/element/_button.css | 27 + src/assets/style/page/element/_reset.css | 240 + src/assets/style/page/element/index.css | 4 + src/assets/style/page/layout/_header.css | 10 + src/assets/style/page/layout/_main.css | 9 + src/assets/style/page/layout/_nav.css | 187 + src/assets/style/page/layout/index.css | 3 + src/assets/style/page/module/_breadcrumb.css | 24 + src/assets/style/page/module/_content.css | 120 + src/assets/style/page/module/_feature.css | 263 + .../style/page/module/_fullscreen-zoom.css | 30 + src/assets/style/page/module/_fullscreen.css | 178 + .../style/page/module/_table-of-content.css | 32 + src/assets/style/page/module/_tabs.css | 43 + src/assets/style/page/module/_user-task.css | 86 + src/assets/style/page/module/index.css | 8 + src/assets/style/page/style.css | 9 + src/assets/style/page/theme.css | 128 + src/assets/style/theme.css | 8 + src/business-model-canvas.ts | 283 ++ src/index.html | 43 + src/modules/models/model.ts | 11 + src/modules/styles/reset.ts | 243 + tsconfig.json | 33 + webpack.config.js | 49 + 34 files changed, 6974 insertions(+), 30 deletions(-) create mode 100644 .github/dependabot.yml create mode 100644 .github/workflows/release.yml create mode 100644 package-lock.json create mode 100644 package.json create mode 100644 src/assets/style/custom-theme.css create mode 100644 src/assets/style/page/custom-theme.css create mode 100644 src/assets/style/page/element/_base.css create mode 100644 src/assets/style/page/element/_button.css create mode 100644 src/assets/style/page/element/_reset.css create mode 100644 src/assets/style/page/element/index.css create mode 100644 src/assets/style/page/layout/_header.css create mode 100644 src/assets/style/page/layout/_main.css create mode 100644 src/assets/style/page/layout/_nav.css create mode 100644 src/assets/style/page/layout/index.css create mode 100644 src/assets/style/page/module/_breadcrumb.css create mode 100644 src/assets/style/page/module/_content.css create mode 100644 src/assets/style/page/module/_feature.css create mode 100644 src/assets/style/page/module/_fullscreen-zoom.css create mode 100644 src/assets/style/page/module/_fullscreen.css create mode 100644 src/assets/style/page/module/_table-of-content.css create mode 100644 src/assets/style/page/module/_tabs.css create mode 100644 src/assets/style/page/module/_user-task.css create mode 100644 src/assets/style/page/module/index.css create mode 100644 src/assets/style/page/style.css create mode 100644 src/assets/style/page/theme.css create mode 100644 src/assets/style/theme.css create mode 100644 src/business-model-canvas.ts create mode 100644 src/index.html create mode 100644 src/modules/models/model.ts create mode 100644 src/modules/styles/reset.ts create mode 100644 tsconfig.json create mode 100644 webpack.config.js diff --git a/.github/dependabot.yml b/.github/dependabot.yml new file mode 100644 index 0000000..9d433ae --- /dev/null +++ b/.github/dependabot.yml @@ -0,0 +1,13 @@ +# To get started with Dependabot version updates, you'll need to specify which +# package ecosystems to update and where the package manifests are located. +# Please see the documentation for all configuration options: +# https://help.github.com/github/administering-a-repository/configuration-options-for-dependency-updates + +version: 2 +updates: + - package-ecosystem: "npm" + directory: "/" + schedule: + interval: "daily" + assignees: + - "arjangeertsema" \ No newline at end of file diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml new file mode 100644 index 0000000..bd494c7 --- /dev/null +++ b/.github/workflows/release.yml @@ -0,0 +1,85 @@ +name: release + +on: + + pull_request: + types: [closed] + branches: [main] + +jobs: + + release: + + runs-on: ubuntu-latest + environment: production + if: github.event.pull_request.merged + timeout-minutes: 10 + + steps: + + - uses: actions/checkout@v2 + with: + fetch-depth: 0 + + - name: get package version + id: package_version + uses: Saionaro/extract-package-version@v1.0.6 + + - name: add v + id: version + run: echo "::set-output name=value::${{ format('v{0}', steps.package_version.outputs.version) }}" + + - name: print package version + run: | + echo "package version: ${{ steps.version.outputs.value }}" + + - name: get tag version + id: tag_version + uses: WyriHaximus/github-action-get-previous-tag@v1 + + - name: print tag version + run: | + echo 'tag version: ${{ steps.tag_version.outputs.tag }}' + + - name: push tag + if: ${{ steps.version.outputs.value != steps.tag_version.outputs.tag }} + run: | + git config user.name "${GITHUB_ACTOR}" + git config user.email "${GITHUB_ACTOR}@users.noreply.github.com" + + git tag -a "${{ steps.version.outputs.value}}" -m "${{ steps.version.outputs.value }}: PR #${{ github.event.pull_request.number }} ${{ github.event.pull_request.title }}" + git push origin "${{ steps.version.outputs.value}}" + + - name: setup node.js + if: ${{ steps.version.outputs.value != steps.tag_version.outputs.tag }} + uses: actions/setup-node@v2 + with: + node-version: '18.x' + registry-url: 'https://registry.npmjs.org' + + - name: npm publish + if: ${{ steps.version.outputs.value != steps.tag_version.outputs.tag }} + run: | + npm ci + npm run build + npm publish --access public + env: + NODE_AUTH_TOKEN: ${{ secrets.NPM }} + + - name: build release notes + if: ${{ steps.version.outputs.value != steps.tag_version.outputs.tag }} + id: release_notes + uses: mikepenz/release-changelog-builder-action@v3.6.0 + env: + GITHUB_TOKEN: ${{ github.token }} + + - name: create release + if: ${{ steps.version.outputs.value != steps.tag_version.outputs.tag }} + uses: softprops/action-gh-release@v1 + env: + GITHUB_TOKEN: ${{ github.token }} + with: + tag_name: ${{ steps.version.outputs.value }} + title: '${{ steps.version.outputs.value }}: PR #${{ github.event.pull_request.number }} ${{ github.event.pull_request.title }}' + body: ${{steps.release_notes.outputs.changelog}} + diff --git a/.gitignore b/.gitignore index c6bba59..6b3aeec 100644 --- a/.gitignore +++ b/.gitignore @@ -5,7 +5,6 @@ npm-debug.log* yarn-debug.log* yarn-error.log* lerna-debug.log* -.pnpm-debug.log* # Diagnostic reports (https://nodejs.org/api/report.html) report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json @@ -42,8 +41,8 @@ build/Release node_modules/ jspm_packages/ -# Snowpack dependency directory (https://snowpack.dev/) -web_modules/ +# TypeScript v1 declaration files +typings/ # TypeScript cache *.tsbuildinfo @@ -54,9 +53,6 @@ web_modules/ # Optional eslint cache .eslintcache -# Optional stylelint cache -.stylelintcache - # Microbundle cache .rpt2_cache/ .rts2_cache_cjs/ @@ -72,20 +68,15 @@ web_modules/ # Yarn Integrity file .yarn-integrity -# dotenv environment variable files +# dotenv environment variables file .env -.env.development.local -.env.test.local -.env.production.local -.env.local +.env.test # parcel-bundler cache (https://parceljs.org/) .cache -.parcel-cache # Next.js build output .next -out # Nuxt.js build / generate output .nuxt @@ -93,20 +84,13 @@ dist # Gatsby files .cache/ -# Comment in the public line in if your project uses Gatsby and not Next.js +# Comment in the public line in if your project uses Gatsby and *not* Next.js # https://nextjs.org/blog/next-9-1#public-directory-support # public # vuepress build output .vuepress/dist -# vuepress v2.x temp and cache directory -.temp -.cache - -# Docusaurus cache and generated files -.docusaurus - # Serverless directories .serverless/ @@ -119,12 +103,16 @@ dist # TernJS port file .tern-port -# Stores VSCode versions used for testing VSCode extensions -.vscode-test +# Project config files +/.idea + +# Temporary files used for building +.temp/ + +# Generated files +.generated/ +tests/dist/ +tests/release/ +.DS_Store -# yarn v2 -.yarn/cache -.yarn/unplugged -.yarn/build-state.yml -.yarn/install-state.gz -.pnp.* +private/ \ No newline at end of file diff --git a/README.md b/README.md index 301c7fb..6ad402e 100644 --- a/README.md +++ b/README.md @@ -1 +1,38 @@ -# business-model-canvas-component +# Business model canvas for [md-docs](https://github.com/biz-dev-ops/md-docs-cli) + +HTML5 web component which renders a business model canvas. + +## Usage + +- Add `business-model-canvas.js` to the webpage +- Add the `` to the page + +## Attributes + +### model-json + +An HTML escaped version of the business model canvas model. + +### model + +The business model canvas model, must be set via JavaScript. + +## Examples + +### HTML + +```html + +``` + +### HTML and JavaScript + +```html + + + + + + \ No newline at end of file diff --git a/src/modules/models/model.ts b/src/modules/models/model.ts new file mode 100644 index 0000000..a42a2c0 --- /dev/null +++ b/src/modules/models/model.ts @@ -0,0 +1,11 @@ +export type Model = { + keyPartnerships: string[], + keyActivities: string[], + keyResources: string[], + valuePropositions: string[], + customerRelationships: string[], + channels: string[], + customerSegments: string[], + costStructure: string[], + revenueStreams: string[] +} \ No newline at end of file diff --git a/src/modules/styles/reset.ts b/src/modules/styles/reset.ts new file mode 100644 index 0000000..45936da --- /dev/null +++ b/src/modules/styles/reset.ts @@ -0,0 +1,243 @@ +import { css } from "lit"; + +const resetStyles = css` + /* + RESET + --------------------------------------------------------- */ + + /* Box sizing (the nuclear option) */ + *, + *::before, + *::after { + box-sizing: border-box; + } + + /* Fix font rendering defaults */ + html, + button { + -moz-osx-font-smoothing: grayscale; + -ms-text-size-adjust: 100%; + -webkit-font-smoothing: antialiased; + -webkit-text-size-adjust: 100%; + } + + body { + font-size: 100%; + } + + + /* + NORMALIZE.css v3.0.1 | MIT License | git.io/normalize + */ + html { + font-family: sans-serif; + } + + body { + margin: 0; + } + + article, + aside, + details, + figcaption, + figure, + footer, + header, + hgroup, + main, + nav, + section, + summary { + display: block; + } + + audio, + canvas, + progress, + video { + display: inline-block; + vertical-align: baseline; + } + + audio:not([controls]) { + display: none; + height: 0; + } + + [hidden], + template { + display: none; + } + + a { + background: transparent; + } + + a:active, + a:hover { + outline: 0; + } + + abbr[title] { + border-bottom: 1px dotted; + } + + b, + strong { + font-weight: bold; + } + + dfn { + font-style: italic; + } + + h1 { + font-size: 2em; + margin: .67em 0; + } + + mark { + background: #ff0; + color: #000; + } + + small { + font-size: 80%; + } + + sub, + sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; + } + + sup { + top: -.5em; + } + + sub { + bottom: -.25em; + } + + img { + border: 0; + } + + svg:not(:root) { + overflow: hidden; + } + + hr { + -moz-box-sizing: content-box; + box-sizing: content-box; + height: 0; + } + + pre { + overflow: auto; + } + + code, + kbd, + pre, + samp { + font-family: monospace, monospace; + font-size: 1em; + } + + button, + input, + optgroup, + select, + textarea { + color: inherit; + font: inherit; + margin: 0; + } + + button { + overflow: visible; + } + + button, + select { + text-transform: none; + } + + button, + html input[type='button'], + input[type='reset'], + input[type='submit'] { + -webkit-appearance: button; + cursor: pointer; + } + + button[disabled], + html input[disabled] { + cursor: default; + } + + button::-moz-focus-inner, + input::-moz-focus-inner { + border: 0; + padding: 0; + } + + input { + line-height: normal; + } + + input[type='checkbox'], + input[type='radio'] { + box-sizing: border-box; + padding: 0; + } + + input[type='number']::-webkit-inner-spin-button, + input[type='number']::-webkit-outer-spin-button { + height: auto; + } + + input[type='search'] { + -webkit-appearance: textfield; + } + + input[type='search']::-webkit-search-cancel-button, + input[type='search']::-webkit-search-decoration { + -webkit-appearance: none; + } + + fieldset { + border: 1px solid #c0c0c0; + margin: 0 2px; + padding: .35em .625em .75em; + } + + legend { + border: 0; + padding: 0; + } + + textarea { + overflow: auto; + } + + optgroup { + font-weight: bold; + } + + table { + border-collapse: collapse; + border-spacing: 0; + } + + td, + th { + padding: 0; + } +`; + +export default resetStyles; \ No newline at end of file diff --git a/tsconfig.json b/tsconfig.json new file mode 100644 index 0000000..7536c61 --- /dev/null +++ b/tsconfig.json @@ -0,0 +1,33 @@ +{ + "compilerOptions": { + "target": "es2017", + "module": "es2015", + "lib": ["es2017", "dom"], + "declaration": true, + "declarationMap": true, + "sourceMap": true, + "inlineSources": true, + "outDir": "./dist", + "rootDir": "./src", + "strict": true, + "noUnusedLocals": true, + "noUnusedParameters": true, + "noImplicitReturns": true, + "noFallthroughCasesInSwitch": true, + "noImplicitAny": true, + "noImplicitThis": true, + "moduleResolution": "node", + "allowSyntheticDefaultImports": true, + "experimentalDecorators": true, + "forceConsistentCasingInFileNames": true, + "noImplicitOverride": true, + "plugins": [ + { + "name": "ts-lit-plugin", + "strict": true + } + ] + }, + "include": ["src/**/*.ts"], + "exclude": [] +} \ No newline at end of file diff --git a/webpack.config.js b/webpack.config.js new file mode 100644 index 0000000..d7e9491 --- /dev/null +++ b/webpack.config.js @@ -0,0 +1,49 @@ +import HtmlWebpackPlugin from 'html-webpack-plugin'; +import TerserPlugin from 'terser-webpack-plugin'; +import CopyPlugin from 'copy-webpack-plugin'; +import path from 'path'; +import * as url from 'url'; + +const __dirname = url.fileURLToPath(new URL('.', import.meta.url)); + +const config = { + entry: './src/business-model-canvas.ts', + module: { + rules: [ + { + test: /\.ts?$/, + use: ['ts-loader', 'minify-html-literals-loader'], + exclude: /node_modules/, + } + ] + }, + resolve: { + extensions: ['.tsx', '.ts', '.js'] + }, + output: { + filename: 'business-model-canvas.js', + path: path.resolve(__dirname, './dist') + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new CopyPlugin({ + patterns: [ + { from: 'src/assets', to: 'assets' } + ] + }) + ], + optimization: { + minimizer: [ + new TerserPlugin + ] + }, + devServer: { + static: path.join(__dirname, './dist'), + compress: true, + port: 4000 + }, +}; + +export default config; \ No newline at end of file