Dash 3 updates

cookiecutter.json

@@ -2,8 +2,6 @@
   "project_name": "my dash component",
   "project_shortname": "{{ cookiecutter.project_name.lower()|replace(' ', '_')|replace('-', '_') }}",
   "component_name": "{{ cookiecutter.project_shortname.split('_')|map('capitalize')|join('') }}",
-  "jl_prefix": "",
-  "r_prefix": "",
   "author_name": "Enter your first and last name (For package.json)",
   "author_email": "Enter your email (For package.json)",
   "github_org": "",

{{cookiecutter.project_shortname}}/README.md

@@ -37,16 +37,53 @@ pip install {{cookiecutter.project_shortname}}
    npm run build
    ```
 
-### Component Code
 
-### Publish
+### Create a production build and publish:
 
-If publish on npm:
-```shell
-npm build
-npm publish
+1. Clean up build and  dist - removes old and temp tarballs:
+```
+rm -rf dist build
+```
+
+
+2. Run a new build
+```
+npm install
+npm run build
+```
+
+3. Build source distribution.  
+```
+npm run dist
+```
+
+4. Test your tarball by copying it into a new environment and installing it locally, for example:
+```
+pip install <your-project-name-version>.tar.gz
 ```
 
+Note:  For local install, use:
+
+```
+pip install -e ./path-to-project
+```
+
+
+5. Publish on PyPI
+
+Prepare release on the GitHub UI - For more information see [Managing Releases](https://docs.github.com/en/repositories/releasing-projects-on-github/managing-releases-in-a-repository)
+When in doubt, do an alpha release first
+```
+$ twine upload dist/*
+```
+6. If publish on npm:
+
+Note: Publishing your component to NPM will make the JavaScript bundles available on the unpkg CDN. By default, Dash serves the component library's CSS and JS locally, but if you choose to publish the package to NPM you can set `serve_locally` to `False` and you may see faster load times.
+```
+npm publish
+``` 
+
+
 ### Justfile
 
 Alternatively, use the provided [just](https://github.com/casey/just) commands:

{{cookiecutter.project_shortname}}/package.json

@@ -1,6 +1,6 @@
 {
   "name": "{{cookiecutter.project_shortname}}",
-  "version": "1.0.0",
+  "version": "0.0.1",
   "description": "{{cookiecutter.description}}",
   "main": "index.ts",
 {% if cookiecutter.github_org -%}
@@ -16,27 +16,30 @@
   "scripts": {
     "build:js::dev": "webpack --mode development",
     "build:js": "webpack",
-    "build:backends": "dash-generate-components ./src/ts/components {{ cookiecutter.project_shortname }} -p package-info.json --r-prefix '{{ cookiecutter.r_prefix }}' --jl-prefix '{{ cookiecutter.jl_prefix }}' --ignore \\.test\\.",
+    "build:backends": "dash-generate-components ./src/ts/components {{ cookiecutter.project_shortname }} -p package-info.json  --ignore \\.test\\.",
     "build": "npm run build:js && npm run build:backends",
-    "watch": "npm run build:js::dev -- --watch"
+    "watch": "npm run build:js::dev -- --watch",
+    "dist": "python -m build --sdist --wheel --outdir dist/",
+    "format":  "prettier --write src --ignore-path=.prettierignore"
   },
   "devDependencies": {
-    "@types/react": "^17.0.39",
-    "css-loader": "^6.7.1",
+    "@types/react": "^18.2.0",
+    "@types/react-dom": "^18.2.0",
+    "css-loader": "^6.10.0",
     "npm-run-all": "^4.1.5",
-    "ramda": "^0.28.0",
-    "react": "16.13.0",
-    "react-docgen": "^5.4.0",
-    "react-dom": "16.13.0",
-    "style-loader": "^3.3.1",
+    "react": "18.2.0",
+    "react-docgen": "^5.4.3",
+    "react-dom": "18.2.0",
+    "style-loader": "^3.3.4",
     "ts-loader": "^9.3.1",
-    "typescript": "^4.7.4",
-    "webpack": "^5.73.0",
-    "webpack-cli": "^4.10.0"
+    "typescript": "^5.6.3",
+    "webpack": "^5.101.0",
+    "webpack-cli": "^5.1.4",
+    "prettier": "^3.2.4"
   },
   "peerDependencies": {
-    "react": "^16.13.0",
-    "react-dom": "^16.13.0"
+    "react": "16 - 19",
+    "react-dom": "16- 19"
   },
   "author": "{{ cookiecutter.author_name }} <{{ cookiecutter.author_email }}>",
   "license": "{% set _license_identifiers = {'MIT License': 'MIT','BSD License': 'BSD','ISC License': 'ISC','Apache Software License 2.0': 'Apache-2.0','GNU General Public License v3': 'GPL-3.0','Not open source': ''} %}{{ _license_identifiers[cookiecutter.license] }}"

{{cookiecutter.project_shortname}}/requirements.txt

@@ -1,3 +1,3 @@
-dash[dev]>=2.5.1
+dash[dev]>=3.0.0
 wheel
 build

{{cookiecutter.project_shortname}}/src/ts/components/{{cookiecutter.component_name}}.tsx

@@ -17,6 +17,4 @@ const {{cookiecutter.component_name}} = (props: Props) => {
     )
 }
 
-{{cookiecutter.component_name}}.defaultProps = {};
-
 export default {{cookiecutter.component_name}};

{{cookiecutter.project_shortname}}/usage.py

@@ -1,10 +1,10 @@
 import {{cookiecutter.project_shortname}}
 import dash
 
-app = dash.Dash(__name__)
+app = dash.Dash()
 
 app.layout = {{cookiecutter.project_shortname}}.{{cookiecutter.component_name}}(id='component')
 
 
 if __name__ == '__main__':
-    app.run_server(debug=True)
+    app.run(debug=True)