├── .editorconfig ├── .eslintrc ├── .gitignore ├── LICENSE ├── README.md ├── core └── shims │ ├── .babelrc │ ├── CHANGELOG.md │ ├── README.md │ ├── package.json │ ├── rollup.config.js │ └── src │ └── index.js ├── demo └── widgets │ ├── CHANGELOG.md │ ├── app.js │ ├── index.html │ ├── package.json │ └── static │ └── config.yml ├── lerna.json ├── media-library └── simple-cloudinary │ ├── .eslintrc │ ├── CHANGELOG.md │ ├── package.json │ ├── public │ ├── config.yml │ └── index.html │ ├── src │ ├── index.js │ └── library.js │ └── webpack.config.js ├── netlify.toml ├── package.json ├── plop-templates ├── core │ ├── .babelrc.hbs │ ├── README.md.hbs │ ├── index.js.hbs │ ├── package.json.hbs │ └── rollup.config.js.hbs └── widgets │ ├── .babelrc.hbs │ ├── README.md.hbs │ ├── config.yml.hbs │ ├── control.js.hbs │ ├── index.html.hbs │ ├── index.js.hbs │ ├── package.json.hbs │ ├── preview.js.hbs │ └── rollup.config.js.hbs ├── plopfile.js ├── widgets ├── color │ ├── CHANGELOG.md │ ├── README.md │ ├── package.json │ ├── public │ │ ├── config.yml │ │ └── index.html │ ├── rollup.config.js │ └── src │ │ ├── Control.js │ │ └── index.js ├── fontawesome │ ├── CHANGELOG.md │ ├── README.md │ ├── package.json │ ├── public │ │ ├── config.yml │ │ └── index.html │ ├── rollup.config.js │ └── src │ │ ├── Brands.js │ │ ├── Preview.js │ │ ├── Regular.js │ │ ├── Solid.js │ │ ├── index.js │ │ └── withIcon.js ├── material-icons │ ├── CHANGELOG.md │ ├── README.md │ ├── package.json │ ├── public │ │ ├── config.yml │ │ └── index.html │ ├── rollup.config.js │ └── src │ │ ├── Control.js │ │ ├── MaterialIcon.js │ │ ├── Preview.js │ │ └── index.js └── native-color │ ├── CHANGELOG.md │ ├── README.md │ ├── package.json │ ├── public │ ├── config.yml │ └── index.html │ ├── rollup.config.js │ └── src │ ├── Control.js │ └── index.js └── yarn.lock /.editorconfig: -------------------------------------------------------------------------------- 1 | # http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | indent_style = space 6 | indent_size = 2 7 | end_of_line = lf 8 | charset = utf-8 9 | trim_trailing_whitespace = true 10 | insert_final_newline = true 11 | 12 | # Use 4 spaces for the Python files 13 | [*.py] 14 | indent_size = 4 15 | max_line_length = 80 16 | 17 | # The JSON files contain newlines inconsistently 18 | [*.json] 19 | insert_final_newline = ignore 20 | 21 | # Minified JavaScript files shouldn't be changed 22 | [**.min.js] 23 | indent_style = ignore 24 | insert_final_newline = ignore 25 | 26 | # Makefiles always use tabs for indentation 27 | [Makefile] 28 | indent_style = tab 29 | 30 | # Batch files use tabs for indentation 31 | [*.bat] 32 | indent_style = tab 33 | 34 | [*.md] 35 | trim_trailing_whitespace = false 36 | 37 | -------------------------------------------------------------------------------- /.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "parser": "babel-eslint", 3 | "extends": "airbnb", 4 | "rules": { 5 | "react/prefer-es6-class": [0, "never"], 6 | "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }], 7 | "import/no-extraneous-dependencies": 0 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # File created using '.gitignore Generator' for Visual Studio Code: https://bit.ly/vscode-gig 2 | 3 | # Created by https://www.gitignore.io/api/jetbrains,node,visualstudiocode,windows 4 | 5 | ### JetBrains ### 6 | # Covers JetBrains IDEs: IntelliJ, RubyMine, PhpStorm, AppCode, PyCharm, CLion, Android Studio and Webstorm 7 | # Reference: https://intellij-support.jetbrains.com/hc/en-us/articles/206544839 8 | 9 | # User-specific stuff: 10 | .idea/**/workspace.xml 11 | .idea/**/tasks.xml 12 | .idea/dictionaries 13 | 14 | # Sensitive or high-churn files: 15 | .idea/**/dataSources/ 16 | .idea/**/dataSources.ids 17 | .idea/**/dataSources.xml 18 | .idea/**/dataSources.local.xml 19 | .idea/**/sqlDataSources.xml 20 | .idea/**/dynamic.xml 21 | .idea/**/uiDesigner.xml 22 | 23 | # Gradle: 24 | .idea/**/gradle.xml 25 | .idea/**/libraries 26 | 27 | # CMake 28 | cmake-build-debug/ 29 | 30 | # Mongo Explorer plugin: 31 | .idea/**/mongoSettings.xml 32 | 33 | ## File-based project format: 34 | *.iws 35 | 36 | ## Plugin-specific files: 37 | 38 | # IntelliJ 39 | /out/ 40 | 41 | # mpeltonen/sbt-idea plugin 42 | .idea_modules/ 43 | 44 | # JIRA plugin 45 | atlassian-ide-plugin.xml 46 | 47 | # Cursive Clojure plugin 48 | .idea/replstate.xml 49 | 50 | # Ruby plugin and RubyMine 51 | /.rakeTasks 52 | 53 | # Crashlytics plugin (for Android Studio and IntelliJ) 54 | com_crashlytics_export_strings.xml 55 | crashlytics.properties 56 | crashlytics-build.properties 57 | fabric.properties 58 | 59 | ### JetBrains Patch ### 60 | # Comment Reason: https://github.com/joeblau/gitignore.io/issues/186#issuecomment-215987721 61 | 62 | # *.iml 63 | # modules.xml 64 | # .idea/misc.xml 65 | # *.ipr 66 | 67 | # Sonarlint plugin 68 | .idea/sonarlint 69 | 70 | ### Node ### 71 | # Logs 72 | logs 73 | *.log 74 | npm-debug.log* 75 | yarn-debug.log* 76 | yarn-error.log* 77 | 78 | # Runtime data 79 | pids 80 | *.pid 81 | *.seed 82 | *.pid.lock 83 | 84 | # Directory for instrumented libs generated by jscoverage/JSCover 85 | lib-cov 86 | 87 | # Coverage directory used by tools like istanbul 88 | coverage 89 | 90 | # nyc test coverage 91 | .nyc_output 92 | 93 | # Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) 94 | .grunt 95 | 96 | # Bower dependency directory (https://bower.io/) 97 | bower_components 98 | 99 | # node-waf configuration 100 | .lock-wscript 101 | 102 | # Compiled binary addons (http://nodejs.org/api/addons.html) 103 | build/Release 104 | 105 | # Dependency directories 106 | node_modules/ 107 | jspm_packages/ 108 | 109 | # Typescript v1 declaration files 110 | typings/ 111 | 112 | # Optional npm cache directory 113 | .npm 114 | 115 | # Optional eslint cache 116 | .eslintcache 117 | 118 | # Optional REPL history 119 | .node_repl_history 120 | 121 | # Output of 'npm pack' 122 | *.tgz 123 | 124 | # Yarn Integrity file 125 | .yarn-integrity 126 | 127 | # dotenv environment variables file 128 | .env 129 | 130 | 131 | ### VisualStudioCode ### 132 | .vscode/* 133 | !.vscode/settings.json 134 | !.vscode/tasks.json 135 | !.vscode/launch.json 136 | !.vscode/extensions.json 137 | .history 138 | 139 | ### Windows ### 140 | # Windows thumbnail cache files 141 | Thumbs.db 142 | ehthumbs.db 143 | ehthumbs_vista.db 144 | 145 | # Folder config file 146 | Desktop.ini 147 | 148 | # Recycle Bin used on file shares 149 | $RECYCLE.BIN/ 150 | 151 | # Windows Installer files 152 | *.cab 153 | *.msi 154 | *.msm 155 | *.msp 156 | 157 | # Windows shortcuts 158 | *.lnk 159 | 160 | 161 | # End of https://www.gitignore.io/api/jetbrains,node,visualstudiocode,windows 162 | 163 | # Custom rules (everything added below won't be overriden by 'Generate .gitignore File' if you use 'Update' option) 164 | 165 | .temp 166 | .cache 167 | dist 168 | .changelog/ 169 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2018 Eko Eryanto 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | [![lerna](https://img.shields.io/badge/maintained%20with-lerna-cc00ff.svg)](https://lernajs.io/) 2 | [![Dependabot Status](https://api.dependabot.com/badges/status?host=github&repo=ekoeryanto/netlify-cms-widgets)](https://dependabot.com) 3 | [![Build Status](https://travis-ci.org/ekoeryanto/netlify-cms-widgets.svg?branch=master)](https://travis-ci.org/ekoeryanto/netlify-cms-widgets) 4 | 5 | # Netlify CMS Widgets 6 | A collection of Netlify CMS Widgets that ported from React components or libraries 7 | -------------------------------------------------------------------------------- /core/shims/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | [ 4 | "@babel/preset-env", 5 | { 6 | "modules": false 7 | } 8 | ] 9 | ], 10 | "plugins": [ 11 | "@babel/plugin-syntax-dynamic-import", 12 | "@babel/plugin-syntax-import-meta", 13 | "@babel/plugin-proposal-class-properties", 14 | "@babel/plugin-proposal-json-strings" 15 | ] 16 | } 17 | -------------------------------------------------------------------------------- /core/shims/CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Change Log 2 | 3 | All notable changes to this project will be documented in this file. 4 | See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. 5 | 6 | 7 | ## [1.1.1](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-shims@1.1.0...netlify-cms-shims@1.1.1) (2018-06-12) 8 | 9 | 10 | 11 | 12 | **Note:** Version bump only for package netlify-cms-shims 13 | 14 | 15 | # [1.1.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-shims@1.0.1...netlify-cms-shims@1.1.0) (2018-05-24) 16 | 17 | 18 | ### Features 19 | 20 | * use babel stable v6 ([ee2bcfd](https://github.com/ekoeryanto/netlify-cms-widgets/commit/ee2bcfd)) 21 | 22 | 23 | 24 | 25 | 26 | # [1.1.0-alpha.c8c7f2ad](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-shims@1.0.1...netlify-cms-shims@1.1.0-alpha.c8c7f2ad) (2018-05-24) 27 | 28 | 29 | ### Features 30 | 31 | * use babel stable v6 ([ee2bcfd](https://github.com/ekoeryanto/netlify-cms-widgets/commit/ee2bcfd)) 32 | 33 | 34 | 35 | 36 | 37 | ## [1.0.1](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-shims@1.0.0...netlify-cms-shims@1.0.1) (2018-05-08) 38 | 39 | 40 | 41 | 42 | **Note:** Version bump only for package netlify-cms-shims 43 | -------------------------------------------------------------------------------- /core/shims/README.md: -------------------------------------------------------------------------------- 1 | # netlify-cms-shims 2 | Shims for Netlify CMS Extended that assign window.CMS.`lib` to global window. 3 | 4 | ## Usage 5 | 6 | ```html 7 | 8 | 9 | ``` 10 | -------------------------------------------------------------------------------- /core/shims/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "netlify-cms-shims", 3 | "version": "1.1.1", 4 | "description": "Shims for Netlify CMS.", 5 | "main": "dist/index.js", 6 | "files": [ 7 | "dist/**", 8 | "src/**" 9 | ], 10 | "scripts": { 11 | "clean": "rimraf dist", 12 | "build": "rollup -c", 13 | "watch": "rollup -c -w", 14 | "prepublishOnly": "npm-run-all clean build" 15 | }, 16 | "keywords": [ 17 | "netlify", 18 | "netlify-cms", 19 | "cms", 20 | "widget", 21 | "shims" 22 | ], 23 | "author": "Eko Eryanto ", 24 | "bugs": { 25 | "url": "https://github.com/ekoeryanto/netlify-cms-widgets/issues" 26 | }, 27 | "homepage": "https://github.com/ekoeryanto/netlify-cms-widgets/tree/master/core/shims#readme", 28 | "repository": { 29 | "type": "git", 30 | "url": "https://github.com/ekoeryanto/netlify-cms-widgets.git" 31 | }, 32 | "license": "MIT", 33 | "devDependencies": { 34 | "@babel/core": "^7.0.0", 35 | "@babel/plugin-proposal-class-properties": "^7.0.0", 36 | "@babel/plugin-proposal-json-strings": "^7.0.0", 37 | "@babel/plugin-syntax-dynamic-import": "^7.0.0", 38 | "@babel/plugin-syntax-import-meta": "^7.0.0", 39 | "@babel/preset-env": "^7.0.0", 40 | "npm-run-all": "^4.1.2", 41 | "rimraf": "^2.6.2", 42 | "rollup": "^0.66.4", 43 | "rollup-plugin-babel": "^4.0.2", 44 | "rollup-plugin-commonjs": "^9.1.3", 45 | "rollup-plugin-node-resolve": "^3.3.0", 46 | "rollup-plugin-replace": "^2.0.0", 47 | "rollup-plugin-strip": "^1.1.1", 48 | "rollup-plugin-terser": "^3.0.0" 49 | } 50 | } 51 | -------------------------------------------------------------------------------- /core/shims/rollup.config.js: -------------------------------------------------------------------------------- 1 | import resolvePlugin from 'rollup-plugin-node-resolve'; 2 | import commonJsPlugin from 'rollup-plugin-commonjs'; 3 | import babelPlugin from 'rollup-plugin-babel'; 4 | import replacePlugin from 'rollup-plugin-replace'; 5 | import stripPlugin from 'rollup-plugin-strip'; 6 | import { terser } from 'rollup-plugin-terser'; 7 | 8 | const environment = process.env.NODE_ENV || 'development'; 9 | 10 | const plugins = [ 11 | replacePlugin({ 12 | 'process.env.NODE_ENV': JSON.stringify(environment), 13 | }), 14 | babelPlugin({ 15 | exclude: ['**/node_modules/**'], 16 | }), 17 | resolvePlugin(), 18 | commonJsPlugin({ 19 | include: ['**/node_modules/**'], 20 | }), 21 | stripPlugin(), 22 | terser(), 23 | ]; 24 | 25 | export default { 26 | input: 'src/index.js', 27 | output: { 28 | file: 'dist/index.js', 29 | format: 'iife', 30 | }, 31 | plugins, 32 | }; 33 | -------------------------------------------------------------------------------- /core/shims/src/index.js: -------------------------------------------------------------------------------- 1 | /* global window */ 2 | if (typeof window !== 'undefined') { 3 | window.React = window.React || window.CMS.React; 4 | window.ReactDOM = window.ReactDOM || window.CMS.ReactDOM; 5 | window.createReactClass = window.createReactClass 6 | || window.CMS.createReactClass 7 | || window.createClass; 8 | window.Immutable = window.Immutable || window.CMS.Immutable; 9 | window.classNames = window.classNames || window.CMS.classNames; 10 | window.PropTypes = window.PropTypes || window.CMS.PropTypes; 11 | window.ImmutablePropTypes = window.ImmutablePropTypes || window.CMS.ImmutablePropTypes; 12 | } 13 | -------------------------------------------------------------------------------- /demo/widgets/CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Change Log 2 | 3 | All notable changes to this project will be documented in this file. 4 | See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. 5 | 6 | 7 | # 2.0.0 (2018-08-12) 8 | 9 | 10 | ### Chores 11 | 12 | * **dependencies:** upgrade netlify-cms v2 ([#54](https://github.com/ekoeryanto/netlify-cms-widgets/issues/54)) ([6feed32](https://github.com/ekoeryanto/netlify-cms-widgets/commit/6feed32)) 13 | 14 | 15 | ### BREAKING CHANGES 16 | 17 | * **dependencies:** for browser usage as of netlify-cms ^2, we don't need to use `netlify-cms/dist/cms.css` 18 | -------------------------------------------------------------------------------- /demo/widgets/app.js: -------------------------------------------------------------------------------- 1 | import CMS from 'netlify-cms'; 2 | import NetlifyCMSWidgetColor from 'netlify-cms-widget-color'; 3 | import NetlifyCMSWidgetFontawesome from 'netlify-cms-widget-fontawesome'; 4 | import NetlifyCMSWidgetMaterialIcons from 'netlify-cms-widget-material-icons'; 5 | import NetlifyCMSWidgetNativeColor from 'netlify-cms-widget-native-color'; 6 | 7 | CMS.registerWidget('color', NetlifyCMSWidgetColor.Control); 8 | 9 | CMS.registerWidget( 10 | 'fontawesome-solid', 11 | NetlifyCMSWidgetFontawesome.Solid, 12 | NetlifyCMSWidgetFontawesome.Preview, 13 | ); 14 | CMS.registerWidget( 15 | 'fontawesome-regular', 16 | NetlifyCMSWidgetFontawesome.Regular, 17 | NetlifyCMSWidgetFontawesome.Preview, 18 | ); 19 | CMS.registerWidget( 20 | 'fontawesome-brands', 21 | NetlifyCMSWidgetFontawesome.Brands, 22 | NetlifyCMSWidgetFontawesome.Preview, 23 | ); 24 | 25 | // CMS.registerPreviewStyle('https://fonts.googleapis.com/css?family=Material+Icons'); 26 | CMS.registerWidget( 27 | 'material-icons', 28 | NetlifyCMSWidgetMaterialIcons.Control, 29 | NetlifyCMSWidgetMaterialIcons.Preview, 30 | ); 31 | 32 | CMS.registerWidget('native-color', NetlifyCMSWidgetNativeColor.Control); 33 | -------------------------------------------------------------------------------- /demo/widgets/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Netlify CMS Widgets 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | -------------------------------------------------------------------------------- /demo/widgets/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "widgets-demo", 3 | "version": "2.0.0", 4 | "main": "index.js", 5 | "scripts": { 6 | "start": "parcel index.html" 7 | }, 8 | "private": true, 9 | "dependencies": { 10 | "@fortawesome/fontawesome-free": "^5.2.0", 11 | "@fortawesome/fontawesome-svg-core": "^1.2.2", 12 | "@fortawesome/free-brands-svg-icons": "^5.2.0", 13 | "@fortawesome/free-regular-svg-icons": "^5.2.0", 14 | "@fortawesome/free-solid-svg-icons": "^5.2.0", 15 | "@fortawesome/react-fontawesome": "^0.1.0", 16 | "netlify-cms": "^2.0.0", 17 | "netlify-cms-widget-color": "^3.0.0", 18 | "netlify-cms-widget-fontawesome": "^3.0.0", 19 | "netlify-cms-widget-material-icons": "^4.0.0", 20 | "netlify-cms-widget-native-color": "^3.0.0" 21 | }, 22 | "devDependencies": { 23 | "parcel-bundler": "^1.9.3" 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /demo/widgets/static/config.yml: -------------------------------------------------------------------------------- 1 | backend: 2 | name: test-repo 3 | login: false 4 | media_folder: assets 5 | collections: 6 | - name: example 7 | label: Example 8 | editor: 9 | preview: false 10 | files: 11 | - file: _data/color.yml 12 | name: color-widget 13 | label: Color Widget 14 | fields: 15 | - name: color 16 | label: Color 17 | widget: color 18 | 19 | - file: _data/fontawesome.yml 20 | name: fontawesome-widget 21 | label: Fontawesome 22 | fields: 23 | - name: fontawesome-solid 24 | label: Fontawesome Solid Widget 25 | widget: fontawesome-solid 26 | - name: fontawesome-brands 27 | label: Fontawesome Brands Widget 28 | widget: fontawesome-brands 29 | - name: fontawesome-regular 30 | label: Fontawesome Regular Widget 31 | widget: fontawesome-regular 32 | 33 | - file: _data/material-icons.yml 34 | name: material-icons-widget 35 | label: Material Icons Widget 36 | fields: 37 | - name: material-icons 38 | label: Material Icons 39 | widget: material-icons 40 | 41 | - file: _data/native-color.yml 42 | name: native-color-widget 43 | label: Native Color Widget 44 | fields: 45 | - name: native-color 46 | label: Native Color 47 | widget: native-color 48 | -------------------------------------------------------------------------------- /lerna.json: -------------------------------------------------------------------------------- 1 | { 2 | "lerna": "2.11.0", 3 | "changelog": { 4 | "repo": "ekoeryanto/netlify-cms-widgets", 5 | "cacheDir": ".changelog", 6 | "labels": { 7 | "enhancement": ":rocket: Enhancement", 8 | "Breaking Change": ":boom: Breaking Change", 9 | "New Feature": ":rocket: New Feature", 10 | "Bug Fix": ":bug: Bug Fix", 11 | "Polish": ":nail_care: Polish", 12 | "Docs": ":memo: Documentation", 13 | "Internal": ":house: Internal" 14 | } 15 | }, 16 | "version": "independent", 17 | "npmClient": "yarn", 18 | "loglevel": "success", 19 | "useWorkspaces": true, 20 | "commands": { 21 | "bootstrap": { 22 | "hoist": true, 23 | "npmCiMode": true 24 | }, 25 | "publish": { 26 | "allowBranch": "master", 27 | "conventionalCommits": true, 28 | "message": "chore: publish", 29 | "ignore": [ 30 | "widgets-demo" 31 | ] 32 | } 33 | }, 34 | "ignoreChanges": [ 35 | "**/*.md", 36 | "**/*.yml", 37 | "**/*.yaml", 38 | "**/*.toml", 39 | "**/*.html" 40 | ] 41 | } 42 | -------------------------------------------------------------------------------- /media-library/simple-cloudinary/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "globals": { 3 | "window": true, 4 | "cloudinary": true 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /media-library/simple-cloudinary/CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Change Log 2 | 3 | All notable changes to this project will be documented in this file. 4 | See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. 5 | 6 | 7 | ## 0.0.1 (2018-09-08) 8 | 9 | 10 | 11 | 12 | **Note:** Version bump only for package netlify-cms-simple-cloudinary 13 | -------------------------------------------------------------------------------- /media-library/simple-cloudinary/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "netlify-cms-simple-cloudinary", 3 | "version": "0.0.1", 4 | "description": "Cloudinary Media Library for Netlify CMS.", 5 | "main": "dist/main.js", 6 | "files": [ 7 | "dist/**", 8 | "src/**" 9 | ], 10 | "scripts": { 11 | "start": "rollup -c -w", 12 | "build": "webpack --mode=development", 13 | "prebuild": "rimraf dist", 14 | "prepublishOnly": "npm run build" 15 | }, 16 | "keywords": [ 17 | "netlify", 18 | "netlify-cms", 19 | "cms", 20 | "media-library", 21 | "cloudinay" 22 | ], 23 | "author": "Eko Eryanto ", 24 | "bugs": { 25 | "url": "https://github.com/ekoeryanto/netlify-cms-widgets/issues" 26 | }, 27 | "homepage": "https://github.com/ekoeryanto/netlify-cms-widgets/tree/master/media-library/simple-cloudinary#readme", 28 | "repository": { 29 | "type": "git", 30 | "url": "https://github.com/ekoeryanto/netlify-cms-widgets.git" 31 | }, 32 | "license": "MIT", 33 | "devDependencies": { 34 | "@babel/core": "^7.0.0", 35 | "@babel/preset-env": "^7.0.0", 36 | "@babel/preset-react": "^7.0.0", 37 | "babel-loader": "^8.0.2", 38 | "babel-plugin-transform-react-remove-prop-types": "^0.4.13", 39 | "cloudinary": "^1.11.0", 40 | "copy-webpack-plugin": "^4.5.2", 41 | "create-react-class": "^15.6.3", 42 | "css-loader": "^1.0.0", 43 | "html-webpack-plugin": "^3.2.0", 44 | "mini-css-extract-plugin": "^0.4.2", 45 | "netlify-cms": "^2.0.0", 46 | "prop-types": "^15.6.1", 47 | "react-immutable-proptypes": "^2.1.0", 48 | "rimraf": "^2.6.2", 49 | "webpack": "^4.17.2", 50 | "webpack-cli": "^3.1.0", 51 | "webpack-serve": "^2.0.2" 52 | } 53 | } 54 | -------------------------------------------------------------------------------- /media-library/simple-cloudinary/public/config.yml: -------------------------------------------------------------------------------- 1 | backend: 2 | name: test-repo 3 | login: false 4 | media_folder: assets 5 | media_library: 6 | name: simple-cloudinary 7 | config: 8 | cloud_name: apek 9 | api_key: '579987246275824' 10 | collections: 11 | - name: example 12 | label: Example 13 | editor: 14 | preview: true 15 | files: 16 | - file: _data/color.json 17 | name: color-widget 18 | label: Color Widget 19 | fields: 20 | - name: color 21 | label: Color 22 | widget: image 23 | options: 24 | media_library: 25 | config: 26 | multiple: false 27 | -------------------------------------------------------------------------------- /media-library/simple-cloudinary/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Cloudinary | Netlify CMS Media Library 7 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | -------------------------------------------------------------------------------- /media-library/simple-cloudinary/src/index.js: -------------------------------------------------------------------------------- 1 | import cloudinary from './library'; 2 | 3 | import('netlify-cms') 4 | .then(({ default: CMS }) => { 5 | CMS.registerMediaLibrary(cloudinary); 6 | }); 7 | -------------------------------------------------------------------------------- /media-library/simple-cloudinary/src/library.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Default media library configuration, can be overriden via config.yml. 3 | */ 4 | const defaultConfig = { 5 | multiple: false, 6 | }; 7 | 8 | function init({ options = { config: {} }, handleInsert }) { 9 | const { ...globalConfig } = options.config; 10 | const baseConfig = { ...defaultConfig, ...globalConfig }; 11 | 12 | const mediaLibrary = cloudinary.createMediaLibrary(baseConfig, { 13 | insertHandler: ({ assets }) => handleInsert(assets.map(u => u.secure_url)), 14 | }); 15 | 16 | return { 17 | show: ({ config: instanceConfig = {} }) => { 18 | const config = { ...baseConfig, ...instanceConfig }; 19 | mediaLibrary.show(config); 20 | }, 21 | 22 | hide: mediaLibrary.hide, 23 | 24 | enableStandalone: () => true, 25 | }; 26 | } 27 | 28 | const cloudinaryMediaLibrary = { name: 'simple-cloudinary', init }; 29 | 30 | export default cloudinaryMediaLibrary; 31 | -------------------------------------------------------------------------------- /media-library/simple-cloudinary/webpack.config.js: -------------------------------------------------------------------------------- 1 | const MiniCssExtractPlugin = require('mini-css-extract-plugin'); 2 | const HtmlWebpackPlugin = require('html-webpack-plugin'); 3 | const CopyWebpackPlugin = require('copy-webpack-plugin'); 4 | 5 | const SERVE = process.env.WEBPACK_SERVE; 6 | 7 | module.exports = { 8 | mode: 'production', 9 | entry: { 10 | main: SERVE ? './src/index.js' : './src/library.js', 11 | }, 12 | output: { 13 | library: 'NetlifySimpleCloudinary', 14 | libraryTarget: 'umd', 15 | umdNamedDefine: true, 16 | }, 17 | devtool: SERVE ? 'inline-source-map' : 'source-map', 18 | externals: { 19 | cloudinary: 'cloudinary', 20 | 'netlify-cms': 'CMS', 21 | }, 22 | module: { 23 | rules: [ 24 | { 25 | test: /\.jsx?$/, 26 | exclude: /node_modules/, 27 | use: [{ 28 | loader: 'babel-loader', 29 | options: { 30 | babelrc: false, 31 | presets: [ 32 | ['@babel/preset-env', { modules: false }], 33 | '@babel/preset-react', 34 | ], 35 | plugins: ['@babel/plugin-syntax-dynamic-import'], 36 | }, 37 | }], 38 | }, 39 | { 40 | test: /\.s?css$/, 41 | exclude: /node_modules/, 42 | use: [ 43 | MiniCssExtractPlugin.loader, 44 | { 45 | loader: 'css-loader', 46 | options: { 47 | modules: true, 48 | importLoaders: 2, 49 | localIdentName: '[name]__[local]___[hash:base64:5]', 50 | }, 51 | }, 52 | // 'postcss-loader', 53 | // 'sass-loader', 54 | ], 55 | }, 56 | ], 57 | }, 58 | plugins: [ 59 | new MiniCssExtractPlugin({ 60 | filename: 'style.[contenthash].css', 61 | }), 62 | SERVE && new HtmlWebpackPlugin({ 63 | hash: true, 64 | template: './public/index.html', 65 | filename: 'index.html', 66 | }), 67 | SERVE && new CopyWebpackPlugin([ 68 | './public/config.yml', 69 | ]), 70 | ].filter(o => o), 71 | }; 72 | -------------------------------------------------------------------------------- /netlify.toml: -------------------------------------------------------------------------------- 1 | [build] 2 | command = "yarn build" 3 | publish = "dist" 4 | [build.environment] 5 | NODE_VERSION = "10" 6 | NPM_VERSION = "6.1.0" 7 | YARN_VERSION = "1.9.4" 8 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "netlify-cms-widgets", 3 | "private": true, 4 | "scripts": { 5 | "prebuild": "lerna bootstrap", 6 | "build": "lerna run build", 7 | "postbuild": "yarn demo", 8 | "demo": "parcel build --cache-dir=node_modules/.cache/parceljs/ demo/widgets/index.html", 9 | "postdemo": "ncp demo/widgets/static dist/", 10 | "lint": "eslint --ignore-path .gitignore --fix", 11 | "commitmsg": "commitlint -e $GIT_PARAMS" 12 | }, 13 | "gitHooks": { 14 | "pre-commit": "lint-staged" 15 | }, 16 | "devDependencies": { 17 | "@commitlint/cli": "^7.0.0", 18 | "@commitlint/config-conventional": "^7.0.1", 19 | "babel-eslint": "^10.0.1", 20 | "cross-env": "^5.2.0", 21 | "eslint": "^5.3.0", 22 | "eslint-config-airbnb": "^17.1.0", 23 | "eslint-plugin-import": "^2.14.0", 24 | "eslint-plugin-jsx-a11y": "^6.1.1", 25 | "eslint-plugin-react": "^7.11.0", 26 | "lerna": "^2.11.0", 27 | "lerna-changelog": "^0.8.0", 28 | "lint-staged": "^7.2.2", 29 | "ncp": "^2.0.0", 30 | "plop": "^2.0.0", 31 | "yorkie": "^2.0.0" 32 | }, 33 | "lint-staged": { 34 | "*.js": [ 35 | "eslint --ignore-path .gitignore --fix", 36 | "git add" 37 | ] 38 | }, 39 | "commitlint": { 40 | "extends": [ 41 | "@commitlint/config-conventional" 42 | ] 43 | }, 44 | "eslintIgnore": [ 45 | "dist", 46 | "node_modules" 47 | ], 48 | "workspaces": [ 49 | "widgets/*", 50 | "media-library/*", 51 | "demo/*", 52 | "core/*" 53 | ] 54 | } 55 | -------------------------------------------------------------------------------- /plop-templates/core/.babelrc.hbs: -------------------------------------------------------------------------------- 1 | { "env": { "production": { "plugins": [ [ "transform-react-remove-prop-types", { "removeImport": true, "additionalLibraries": 2 | ["react-immutable-proptypes"] } ] ] } }, "presets": [ ["env", { "modules": false }], [ "react", { "pragma": 3 | "h" } ], "stage-3" ] } -------------------------------------------------------------------------------- /plop-templates/core/README.md.hbs: -------------------------------------------------------------------------------- 1 | # netlify-cms-{{name}} 2 | -------------------------------------------------------------------------------- /plop-templates/core/index.js.hbs: -------------------------------------------------------------------------------- 1 | // noop 2 | -------------------------------------------------------------------------------- /plop-templates/core/package.json.hbs: -------------------------------------------------------------------------------- 1 | { "name": "netlify-cms-{{name}}", "version": "1.0.0", "description": "Shims for Netlify CMS.", "main": "dist/index.js", "files": 2 | [ "dist/**", "src/**" ], "scripts": { "clean": "rimraf dist", "build": "rollup -c", "watch": "rollup -c -w", "prepublishOnly": 3 | "npm-run-all clean build" }, "keywords": [ "netlify", "netlify-cms", "cms", "widget", "shims" ], "author": "Eko Eryanto 4 | ", "bugs": { "url": "https://github.com/ekoeryanto/netlify-cms-widgets/issues" }, "homepage": "https://github.com/ekoeryanto/netlify-cms-widgets/tree/master/core/shims#readme", 5 | "repository": { "type": "git", "url": "https://github.com/ekoeryanto/netlify-cms-widgets.git" }, "license": "MIT", "devDependencies": 6 | { "@babel/core": "^7.0.0-beta.46", "env": "^7.0.0-beta.46", "react": "^7.0.0-beta.46", "stage-3": 7 | "^7.0.0-beta.46", "babel-plugin-transform-react-remove-prop-types": "^0.4.13", "netlify-cms": "^1.7.0", "npm-run-all": 8 | "^4.1.2", "rimraf": "^2.6.2", "rollup": "^0.58.2", "rollup-plugin-babel": "^3.0.4", "rollup-plugin-commonjs": "^9.1.3", 9 | "rollup-plugin-node-resolve": "^3.3.0", "rollup-plugin-replace": "^2.0.0", "rollup-plugin-strip": "^1.1.1", "rollup-plugin-uglify": 10 | "^3.0.0", "uglify-es": "^3.3.9" } } 11 | -------------------------------------------------------------------------------- /plop-templates/core/rollup.config.js.hbs: -------------------------------------------------------------------------------- 1 | import resolvePlugin from 'rollup-plugin-node-resolve' 2 | import commonJsPlugin from 'rollup-plugin-commonjs' 3 | import babelPlugin from 'rollup-plugin-babel' 4 | import replacePlugin from 'rollup-plugin-replace' 5 | import stripPlugin from 'rollup-plugin-strip' 6 | import { uglify } from 'rollup-plugin-uglify' 7 | import { minify } from 'uglify-es'; 8 | 9 | const environment = process.env.NODE_ENV || 'development' 10 | 11 | const plugins = [ 12 | replacePlugin({ 13 | 'process.env.NODE_ENV': JSON.stringify(environment) 14 | }), 15 | babelPlugin({ 16 | exclude: ['**/node_modules/**'] 17 | }), 18 | resolvePlugin(), 19 | commonJsPlugin({ 20 | include: ['**/node_modules/**'] 21 | }), 22 | stripPlugin(), 23 | uglify() 24 | ] 25 | 26 | export default { 27 | input: 'src/index.js', 28 | output: { 29 | file: `dist/index.js`, 30 | format: 'iife' 31 | }, 32 | plugins 33 | } 34 | -------------------------------------------------------------------------------- /plop-templates/widgets/.babelrc.hbs: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | [ 4 | "env", 5 | { 6 | "modules": false 7 | } 8 | ], 9 | "react", 10 | "stage-3" 11 | ], 12 | "plugins": ["external-helpers"] 13 | } 14 | -------------------------------------------------------------------------------- /plop-templates/widgets/README.md.hbs: -------------------------------------------------------------------------------- 1 | # netlify-cms-widget-{{kebabCase name}} 2 | 3 | {{ titleCase name}} widget for Netlify CMS. 4 | 5 | ## Install and Usage 6 | 7 | ### As an npm package: 8 | 9 | ```shell 10 | npm install netlify-cms-widget-{{name}} 11 | ``` 12 | 13 | ```js 14 | import CMS from 'netlify-cms' 15 | import * as {{pascalCase name}}Widget from 'netlify-cms-widget-{{name}}' 16 | CMS.registerWidget('{{name}}', {{pascalCase name}}Widget.Control, {{pascalCase name}}Widget.Preview) 17 | ``` 18 | 19 | Add to your config.yml: 20 | 21 | ```yaml 22 | fields: 23 | - name: 24 | label: 25 | widget: {{name}} 26 | ``` 27 | 28 | ## Example 29 | 30 | see `public` directory 31 | -------------------------------------------------------------------------------- /plop-templates/widgets/config.yml.hbs: -------------------------------------------------------------------------------- 1 | backend: 2 | name: test-repo 3 | login: false 4 | media_folder: assets 5 | collections: 6 | - name: example 7 | label: Example 8 | files: 9 | - file: _data/{{dashCase name}}.yml 10 | name: {{dashCase name}}-widget 11 | label: {{titleCase name}} Widget 12 | fields: 13 | - name: {{dashCase name}} 14 | label: {{titleCase name}} 15 | widget: {{dashCase name}} 16 | -------------------------------------------------------------------------------- /plop-templates/widgets/control.js.hbs: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import createReactClass from 'create-react-class'; 3 | import PropTypes from 'prop-types'; 4 | import ImmutablePropTypes from 'react-immutable-proptypes'; 5 | 6 | export default createReactClass({ 7 | propTypes: { 8 | onChange: PropTypes.func.isRequired, 9 | forID: PropTypes.string.isRequired, 10 | value: PropTypes.node, 11 | setActiveStyle: PropTypes.func.isRequired, 12 | setInactiveStyle: PropTypes.func.isRequired, 13 | classNameWrapper: PropTypes.string.isRequired, 14 | field: ImmutablePropTypes.mapContains({ 15 | default: PropTypes.string, 16 | }).isRequired, 17 | }, 18 | 19 | getDefaultProps() { 20 | return { value: '' }; 21 | }, 22 | 23 | render() { 24 | const { 25 | forID, 26 | field, 27 | value, 28 | setActiveStyle, 29 | setInactiveStyle, 30 | onChange, 31 | classNameWrapper, 32 | } = this.props; 33 | const currentValue = value || field.get('default'); 34 | return ( 35 | 49 | ); 50 | }, 51 | }); 52 | -------------------------------------------------------------------------------- /plop-templates/widgets/index.html.hbs: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | {{titleCase name}} Example | Netlify CMS Widgets 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 18 | 19 | 20 | 21 | -------------------------------------------------------------------------------- /plop-templates/widgets/index.js.hbs: -------------------------------------------------------------------------------- 1 | import Control from './Control'; 2 | import Preview from './Preview'; 3 | 4 | export default { 5 | Control, 6 | Preview, 7 | }; 8 | -------------------------------------------------------------------------------- /plop-templates/widgets/package.json.hbs: -------------------------------------------------------------------------------- 1 | { 2 | "name": "netlify-cms-widget-{{dashCase name}}", 3 | "version": "0.0.0", 4 | "description": "{{titleCase name}} widget for Netlify CMS.", 5 | "main": "dist/cjs/{{dashCase name}}.min.js", 6 | "browser": "dist/umd/{{dashCase name}}.min.js", 7 | "module": "dist/es/{{dashCase name}}.min.js", 8 | "files": [ 9 | "dist/**", 10 | "src/**" 11 | ], 12 | "scripts": { 13 | "start": "rollup -c -w", 14 | "build": "npm-run-all --parallel build:*", 15 | "build:development": "rollup -c", 16 | "build:production": "rollup -c --environment NODE_ENV:production", 17 | "prebuild": "rimraf dist", 18 | "prepublishOnly": "npm run build" 19 | }, 20 | "keywords": [ 21 | "netlify", 22 | "netlify-cms", 23 | "cms", 24 | "widget", 25 | "{{dashCase name}}" 26 | ], 27 | "author": "{{{author}}}", 28 | "bugs": { 29 | "url": "https://github.com/ekoeryanto/netlify-cms-widgets/issues" 30 | }, 31 | "homepage": "https://github.com/ekoeryanto/netlify-cms-widgets/tree/master/widgets/{{dashCase name}}#readme", 32 | "repository": { 33 | "type": "git", 34 | "url": "https://github.com/ekoeryanto/netlify-cms-widgets.git" 35 | }, 36 | "license": "MIT", 37 | "devDependencies": { 38 | "babel-core": "^6.26.3", 39 | "babel-plugin-external-helpers": "^6.22.0", 40 | "babel-plugin-transform-react-remove-prop-types": "^0.4.13", 41 | "babel-preset-env": "^1.7.0", 42 | "babel-preset-react": "^6.24.1", 43 | "babel-preset-stage-3": "^6.24.1", 44 | "create-react-class": "^15.6.3", 45 | "lodash": "^4.17.10", 46 | "module-igniter": "^1.1.0", 47 | "netlify-cms": "^2.0.0", 48 | "npm-run-all": "^4.1.2", 49 | "prop-types": "^15.6.1", 50 | "react-immutable-proptypes": "^2.1.0", 51 | "rimraf": "^2.6.2", 52 | "rollup": "^0.60.2", 53 | "rollup-plugin-babel": "^3.0.4", 54 | "rollup-plugin-commonjs": "^9.1.3", 55 | "rollup-plugin-livereload": "^0.6.0", 56 | "rollup-plugin-node-resolve": "^3.3.0", 57 | "rollup-plugin-postcss": "^1.6.1", 58 | "rollup-plugin-replace": "^2.0.0", 59 | "rollup-plugin-serve": "^0.4.2", 60 | "rollup-plugin-strip": "^1.1.1", 61 | "rollup-plugin-uglify": "^4.0.0" 62 | }, 63 | "peerDependencies": { 64 | "create-react-class": "^15.6.3", 65 | "netlify-cms": "^2.0.0 | ^1.0.0", 66 | "prop-types": "^15.6.1", 67 | "react": "^16.4.0", 68 | "react-immutable-proptypes": "^2.1.0" 69 | } 70 | } 71 | -------------------------------------------------------------------------------- /plop-templates/widgets/preview.js.hbs: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import PropTypes from 'prop-types'; 3 | 4 | const Preview = props => (props.value ?
{props.value}
: ''); 5 | 6 | Preview.propTypes = { 7 | value: PropTypes.node.isRequired, 8 | }; 9 | 10 | export default Preview; 11 | -------------------------------------------------------------------------------- /plop-templates/widgets/rollup.config.js.hbs: -------------------------------------------------------------------------------- 1 | import igniter from 'module-igniter'; 2 | import { mapValues } from 'lodash'; 3 | import { minify } from 'uglify-es'; 4 | 5 | const plug = igniter({ prefix: 'rollup-plugin-' }); 6 | const environment = process.env.NODE_ENV || 'development'; 7 | const prod = environment === 'production'; 8 | const watch = process.env.ROLLUP_WATCH; 9 | 10 | const globals = { 11 | 'netlify-cms': 'CMS', 12 | react: 'React', 13 | 'react-dom': 'ReactDOM', 14 | 'prop-types': 'PropTypes', 15 | immutable: 'Immutable', 16 | 'react-immutable-proptypes': 'ImmutablePropTypes', 17 | classnames: 'classNames', 18 | 'create-react-class': 'createClass', 19 | }; 20 | 21 | const external = Object.keys(globals); 22 | const WATCH_FORMAT = process.env.WATCH_FORMAT || 'umd'; 23 | const formats = ['umd', 'iife', 'cjs', 'es']; 24 | const extension = prod ? 'min.js' : 'js'; 25 | const isBrowser = format => format === 'umd' || format === 'iife'; 26 | 27 | const createOutput = (format = 'umd') => ({ 28 | sourcemap: prod, 29 | name: 'NetlifyCMSWidget{{titleCase name}}', 30 | file: `dist/${format}/{{dashCase name}}.${extension}`, 31 | format, 32 | globals: format === 'iife' ? mapValues(globals, o => `window['${o}']`) : globals, 33 | }); 34 | 35 | export default (watch ? [WATCH_FORMAT] : formats).map(format => ({ 36 | input: 'src/index.js', 37 | output: createOutput(format), 38 | external, 39 | plugins: [ 40 | ...plug({ 41 | replace: { 'process.env.NODE_ENV': JSON.stringify(environment) }, 42 | 'node-resolve': true, 43 | commonjs: { 44 | include: ['**/node_modules/**'], 45 | }, 46 | babel: { 47 | exclude: ['**/node_modules/**'], 48 | plugins: isBrowser(format) 49 | ? [ 50 | [ 51 | 'transform-react-jsx', 52 | { 53 | pragma: 'h', 54 | }, 55 | ], 56 | [ 57 | 'transform-react-remove-prop-types', 58 | { 59 | removeImport: true, 60 | additionalLibraries: ['react-immutable-proptypes'], 61 | }, 62 | ], 63 | ] 64 | : [], 65 | }, 66 | postcss: { 67 | sourcemap: prod, 68 | minimize: prod, 69 | }, 70 | }), 71 | ...plug({ strip: { debugger: true }, 'uglify::uglify': [{}, minify] }, prod), 72 | ...plug( 73 | { 74 | serve: { 75 | contentBase: [ 76 | '../../node_modules', 77 | '../../widgets', 78 | '../../core', 79 | `dist/${WATCH_FORMAT}`, 80 | 'public', 81 | ], 82 | historyApiFallback: true, 83 | }, 84 | livereload: true, 85 | }, 86 | watch, 87 | ), 88 | ], 89 | })); 90 | -------------------------------------------------------------------------------- /plopfile.js: -------------------------------------------------------------------------------- 1 | const commonPrompts = [ 2 | { 3 | type: 'input', 4 | name: 'name', 5 | message: 'Widget name', 6 | }, 7 | { 8 | type: 'input', 9 | name: 'author', 10 | message: 'Widget author', 11 | default: 'Eko Eryanto ', 12 | }, 13 | ]; 14 | 15 | const addFile = (type, path, tpl) => { 16 | const template = (tpl || path).replace(/\.hbs$/, ''); 17 | return { 18 | type: 'add', 19 | path: `${type}/{{kebabCase name}}/${path}`, 20 | templateFile: `plop-templates/${type}/${template}.hbs`, 21 | }; 22 | }; 23 | 24 | module.exports = function generate(plop) { 25 | plop.setGenerator('widget', { 26 | description: 'Generate basic files for new widget', 27 | prompts: commonPrompts, 28 | actions: () => [ 29 | addFile('widgets', 'package.json'), 30 | addFile('widgets', '/src/index.js', 'index.js'), 31 | addFile('widgets', 'src/Control.js', 'control.js'), 32 | addFile('widgets', 'src/Preview.js', 'preview.js'), 33 | addFile('widgets', 'README.md'), 34 | addFile('widgets', '.babelrc'), 35 | addFile('widgets', 'rollup.config.js'), 36 | addFile('widgets', 'public/index.html', 'index.html'), 37 | addFile('widgets', 'public/config.yml', 'config.yml'), 38 | ], 39 | }); 40 | 41 | plop.setGenerator('core', { 42 | description: 'Generate basic files for new widget', 43 | prompts: commonPrompts, 44 | actions: () => [ 45 | addFile('core', '.babelrc'), 46 | addFile('core', 'src/index.js', 'index.js'), 47 | addFile('core', 'package.json'), 48 | addFile('core', 'README.md'), 49 | addFile('core', 'rollup.config.js'), 50 | ], 51 | }); 52 | }; 53 | -------------------------------------------------------------------------------- /widgets/color/CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Change Log 2 | 3 | All notable changes to this project will be documented in this file. 4 | See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. 5 | 6 | 7 | ## [3.0.1](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-color@3.0.0...netlify-cms-widget-color@3.0.1) (2018-09-06) 8 | 9 | 10 | ### Bug Fixes 11 | 12 | * **color:** initial value not applied ([8676bb9](https://github.com/ekoeryanto/netlify-cms-widgets/commit/8676bb9)) 13 | 14 | 15 | 16 | 17 | 18 | # [3.0.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-color@2.3.0...netlify-cms-widget-color@3.0.0) (2018-08-10) 19 | 20 | 21 | ### Chores 22 | 23 | * **dependencies:** upgrade netlify-cms v2 ([#54](https://github.com/ekoeryanto/netlify-cms-widgets/issues/54)) ([6feed32](https://github.com/ekoeryanto/netlify-cms-widgets/commit/6feed32)) 24 | 25 | 26 | ### BREAKING CHANGES 27 | 28 | * **dependencies:** for browser usage as of netlify-cms ^2, we don't need to use `netlify-cms/dist/cms.css` 29 | 30 | 31 | 32 | 33 | 34 | # [2.3.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-color@2.2.0...netlify-cms-widget-color@2.3.0) (2018-06-12) 35 | 36 | 37 | ### Features 38 | 39 | * allow Color picker to be collapsed ([#17](https://github.com/ekoeryanto/netlify-cms-widgets/issues/17)) ([82c77b3](https://github.com/ekoeryanto/netlify-cms-widgets/commit/82c77b3)), closes [#15](https://github.com/ekoeryanto/netlify-cms-widgets/issues/15) 40 | 41 | 42 | 43 | 44 | 45 | # [2.2.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-color@2.1.1...netlify-cms-widget-color@2.2.0) (2018-05-24) 46 | 47 | 48 | ### Features 49 | 50 | * use babel stable v6 ([ee2bcfd](https://github.com/ekoeryanto/netlify-cms-widgets/commit/ee2bcfd)) 51 | 52 | 53 | 54 | 55 | 56 | # [2.2.0-alpha.c8c7f2ad](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-color@2.1.1...netlify-cms-widget-color@2.2.0-alpha.c8c7f2ad) (2018-05-24) 57 | 58 | 59 | ### Features 60 | 61 | * use babel stable v6 ([ee2bcfd](https://github.com/ekoeryanto/netlify-cms-widgets/commit/ee2bcfd)) 62 | 63 | 64 | 65 | 66 | 67 | ## [2.1.1](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-color@2.1.0...netlify-cms-widget-color@2.1.1) (2018-05-12) 68 | 69 | 70 | ### Bug Fixes 71 | 72 | * iife globals wrapped on window to avoid unwanted character ([3eae5be](https://github.com/ekoeryanto/netlify-cms-widgets/commit/3eae5be)), closes [#4](https://github.com/ekoeryanto/netlify-cms-widgets/issues/4) 73 | 74 | 75 | 76 | 77 | 78 | # [2.1.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-color@2.0.1...netlify-cms-widget-color@2.1.0) (2018-05-12) 79 | 80 | 81 | ### Features 82 | 83 | * patch to work with official netlify-cms ([c47c7ae](https://github.com/ekoeryanto/netlify-cms-widgets/commit/c47c7ae)) 84 | 85 | 86 | 87 | 88 | 89 | ## [2.0.1](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-color@2.0.0...netlify-cms-widget-color@2.0.1) (2018-05-08) 90 | 91 | 92 | 93 | 94 | **Note:** Version bump only for package netlify-cms-widget-color 95 | 96 | 97 | # [2.0.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-color@1.0.0...netlify-cms-widget-color@2.0.0) (2018-05-07) 98 | 99 | 100 | ### Chores 101 | 102 | * migrate to rollup ([68a11eb](https://github.com/ekoeryanto/netlify-cms-widgets/commit/68a11eb)) 103 | 104 | 105 | ### BREAKING CHANGES 106 | 107 | * - all the depedencies are excluded when possible and it on peerDependencies 108 | - compiled file now renamed to follow the widget now not `main.js` 109 | 110 | 111 | 112 | 113 | 114 | # [1.0.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-color@0.1.0...netlify-cms-widget-color@1.0.0) (2018-05-03) 115 | 116 | 117 | ### Chores 118 | 119 | * **refactor:** rename library instance ([516a5d0](https://github.com/ekoeryanto/netlify-cms-widgets/commit/516a5d0)) 120 | 121 | 122 | ### BREAKING CHANGES 123 | 124 | * **refactor:** `NetlifyCMSNameWidget` now `NetlifyCMSWidgetName` 125 | -------------------------------------------------------------------------------- /widgets/color/README.md: -------------------------------------------------------------------------------- 1 | # netlify-cms-widget-color 2 | 3 | Remembering all the world's code values for colors is hard. Now you don't have to. Install the color widget so you can make an easy job of things like changing your font color, directly in the editor UI. 4 | 5 | ## Install and Usage 6 | 7 | ### As an npm package: 8 | 9 | ```shell 10 | npm install netlify-cms-widget-color @pake/react-color 11 | ``` 12 | 13 | ```js 14 | import CMS from "netlify-cms"; 15 | import * as ColorWidget from "netlify-cms-widget-color"; 16 | CMS.registerWidget("color", ColorWidget.Control); 17 | ``` 18 | 19 | Add to your config.yml: 20 | 21 | ```yaml 22 | fields: 23 | - name: 24 | label: 25 | widget: color 26 | ``` 27 | 28 | ## Example 29 | 30 | see `public` directory 31 | -------------------------------------------------------------------------------- /widgets/color/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "netlify-cms-widget-color", 3 | "version": "3.0.1", 4 | "description": "Color widget for Netlify CMS.", 5 | "main": "dist/cjs/color.min.js", 6 | "browser": "dist/umd/color.min.js", 7 | "module": "dist/es/color.min.js", 8 | "files": [ 9 | "dist/**", 10 | "src/**" 11 | ], 12 | "scripts": { 13 | "start": "rollup -c -w", 14 | "build": "npm-run-all --parallel build:*", 15 | "build:development": "rollup -c", 16 | "build:production": "rollup -c --environment NODE_ENV:production", 17 | "prebuild": "rimraf dist", 18 | "prepublishOnly": "npm run build" 19 | }, 20 | "keywords": [ 21 | "netlify", 22 | "netlify-cms", 23 | "cms", 24 | "widget", 25 | "color" 26 | ], 27 | "author": "Eko Eryanto ", 28 | "bugs": { 29 | "url": "https://github.com/ekoeryanto/netlify-cms-widgets/issues" 30 | }, 31 | "homepage": "https://github.com/ekoeryanto/netlify-cms-widgets/tree/master/widgets/color#readme", 32 | "repository": { 33 | "type": "git", 34 | "url": "https://github.com/ekoeryanto/netlify-cms-widgets.git" 35 | }, 36 | "license": "MIT", 37 | "devDependencies": { 38 | "@babel/core": "^7.0.0", 39 | "@babel/plugin-proposal-class-properties": "^7.0.0", 40 | "@babel/plugin-proposal-json-strings": "^7.0.0", 41 | "@babel/plugin-syntax-dynamic-import": "^7.0.0", 42 | "@babel/plugin-syntax-import-meta": "^7.0.0", 43 | "@babel/preset-env": "^7.0.0", 44 | "@babel/preset-react": "^7.0.0", 45 | "@pake/react-color": "^3.0.0", 46 | "babel-plugin-transform-react-remove-prop-types": "^0.4.13", 47 | "create-react-class": "^15.6.3", 48 | "lodash": "^4.17.10", 49 | "module-igniter": "^1.1.0", 50 | "netlify-cms": "^2.0.0", 51 | "npm-run-all": "^4.1.2", 52 | "prop-types": "^15.6.1", 53 | "react-immutable-proptypes": "^2.1.0", 54 | "rimraf": "^2.6.2", 55 | "rollup": "^0.66.4", 56 | "rollup-plugin-babel": "^4.0.2", 57 | "rollup-plugin-commonjs": "^9.1.3", 58 | "rollup-plugin-livereload": "^0.6.0", 59 | "rollup-plugin-node-resolve": "^3.3.0", 60 | "rollup-plugin-postcss": "^1.6.1", 61 | "rollup-plugin-replace": "^2.0.0", 62 | "rollup-plugin-serve": "^0.6.0", 63 | "rollup-plugin-strip": "^1.1.1", 64 | "rollup-plugin-terser": "^3.0.0" 65 | }, 66 | "peerDependencies": { 67 | "@pake/react-color": "^3.0.0", 68 | "create-react-class": "^15.6.3", 69 | "module-igniter": "^1.1.0", 70 | "netlify-cms": "^2.0.0 | ^1.0.0", 71 | "prop-types": "^15.6.1", 72 | "react": "^16.4.0", 73 | "react-immutable-proptypes": "^2.1.0" 74 | } 75 | } 76 | -------------------------------------------------------------------------------- /widgets/color/public/config.yml: -------------------------------------------------------------------------------- 1 | backend: 2 | name: test-repo 3 | login: false 4 | media_folder: assets 5 | collections: 6 | - name: example 7 | label: Example 8 | editor: 9 | preview: false 10 | files: 11 | - file: _data/color.json 12 | name: color-widget 13 | label: Color Widget 14 | fields: 15 | - name: color 16 | label: Color 17 | widget: color 18 | default: "#ff0" 19 | -------------------------------------------------------------------------------- /widgets/color/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Color Example | Netlify CMS Widgets 7 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 30 | 31 | 32 | 33 | -------------------------------------------------------------------------------- /widgets/color/rollup.config.js: -------------------------------------------------------------------------------- 1 | import { mapValues } from 'lodash'; 2 | import igniter from 'module-igniter'; 3 | 4 | const plug = igniter({ prefix: 'rollup-plugin-' }); 5 | const environment = process.env.NODE_ENV || 'development'; 6 | const prod = environment === 'production'; 7 | const watch = process.env.ROLLUP_WATCH; 8 | 9 | const globals = { 10 | 'netlify-cms': 'CMS', 11 | react: 'React', 12 | 'react-dom': 'ReactDOM', 13 | 'prop-types': 'PropTypes', 14 | immutable: 'Immutable', 15 | 'react-immutable-proptypes': 'ImmutablePropTypes', 16 | classnames: 'classNames', 17 | 'create-react-class': 'createClass', 18 | '@pake/react-color': 'ReactColor', 19 | }; 20 | 21 | const external = Object.keys(globals); 22 | const WATCH_FORMAT = process.env.WATCH_FORMAT || 'umd'; 23 | const formats = ['umd', 'iife', 'cjs', 'es']; 24 | const extension = prod ? 'min.js' : 'js'; 25 | const isBrowser = format => format === 'umd' || format === 'iife'; 26 | 27 | const createOutput = (format = 'umd') => ({ 28 | sourcemap: prod, 29 | name: 'NetlifyCMSWidgetColor', 30 | file: `dist/${format}/color.${extension}`, 31 | format, 32 | globals: format === 'iife' ? mapValues(globals, o => `window['${o}']`) : globals, 33 | }); 34 | 35 | export default (watch ? [WATCH_FORMAT] : formats).map(format => ({ 36 | input: 'src/index.js', 37 | output: createOutput(format), 38 | external, 39 | plugins: [ 40 | ...plug({ 41 | replace: { 'process.env.NODE_ENV': JSON.stringify(environment) }, 42 | 'node-resolve': true, 43 | commonjs: { 44 | include: ['**/node_modules/**'], 45 | }, 46 | babel: { 47 | babelrc: false, 48 | exclude: ['**/node_modules/**'], 49 | presets: [ 50 | ['@babel/preset-env', { modules: false }], 51 | ['@babel/preset-react', isBrowser(format) ? { pragma: 'h' } : {}], 52 | ], 53 | plugins: [ 54 | isBrowser(format) && [ 55 | 'transform-react-remove-prop-types', 56 | { 57 | removeImport: true, 58 | additionalLibraries: ['react-immutable-proptypes'], 59 | }, 60 | ], 61 | ].filter(Boolean), 62 | }, 63 | postcss: { 64 | sourcemap: prod, 65 | minimize: prod, 66 | }, 67 | }), 68 | ...plug({ strip: { debugger: true } }, 'terser::terser', prod), 69 | ...plug( 70 | { 71 | serve: { 72 | contentBase: [ 73 | '../../node_modules', 74 | '../../widgets', 75 | '../../core', 76 | `dist/${WATCH_FORMAT}`, 77 | 'public', 78 | ], 79 | historyApiFallback: true, 80 | }, 81 | livereload: true, 82 | }, 83 | watch, 84 | ), 85 | ], 86 | })); 87 | -------------------------------------------------------------------------------- /widgets/color/src/Control.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import createReactClass from 'create-react-class'; 3 | import PropTypes from 'prop-types'; 4 | import ImmutablePropTypes from 'react-immutable-proptypes'; 5 | import { SketchPicker } from '@pake/react-color'; 6 | 7 | const DEFAULT_FORMAT = 'hex'; 8 | const DEFAULT_COLOR = '#ffffff'; 9 | 10 | export default createReactClass({ 11 | propTypes: { 12 | onChange: PropTypes.func.isRequired, 13 | forID: PropTypes.string.isRequired, 14 | value: PropTypes.node, 15 | setActiveStyle: PropTypes.func.isRequired, 16 | setInactiveStyle: PropTypes.func.isRequired, 17 | classNameWrapper: PropTypes.string.isRequired, 18 | field: ImmutablePropTypes.mapContains({ 19 | format: PropTypes.oneOf(['hex', 'rgb', 'hsl']), 20 | default: PropTypes.string, 21 | presets: ImmutablePropTypes.list, 22 | alpha: PropTypes.bool, 23 | }).isRequired, 24 | }, 25 | 26 | getDefaultProps() { 27 | return { 28 | value: '', 29 | }; 30 | }, 31 | 32 | getInitialState() { 33 | return { 34 | displayColorPicker: false, 35 | }; 36 | }, 37 | 38 | handleChangeComplete(color) { 39 | const { field, onChange } = this.props; 40 | const alpha = !field.get('alpha', true); 41 | const format = field.get('format') || DEFAULT_FORMAT; 42 | let selected = color[format]; 43 | if (typeof selected !== 'string') { 44 | const type = `${format}${alpha ? 'a' : ''}`; 45 | const value = Object.values(selected).join(', '); 46 | 47 | selected = `${type}(${value})`; 48 | } 49 | onChange(selected); 50 | }, 51 | 52 | handleClick() { 53 | const { displayColorPicker } = this.state; 54 | this.setState({ displayColorPicker: !displayColorPicker }); 55 | }, 56 | 57 | handleClose() { 58 | this.setState({ displayColorPicker: false }); 59 | }, 60 | 61 | render() { 62 | const { 63 | forID, 64 | field, 65 | value, 66 | classNameWrapper, 67 | setActiveStyle, 68 | setInactiveStyle, 69 | } = this.props; 70 | 71 | const props = { 72 | presetColors: undefined, 73 | color: value || field.get('default') || DEFAULT_COLOR, 74 | disableAlpha: !field.get('alpha', true), 75 | }; 76 | 77 | if (field.has('presets')) { 78 | props.presetColors = field.get('presets').toArray(); 79 | } 80 | 81 | const { displayColorPicker } = this.state; 82 | const styles = { 83 | color: { 84 | width: '30px', 85 | height: '30px', 86 | borderRadius: '50%', 87 | background: props.color, 88 | float: 'left', 89 | marginRight: '10px', 90 | }, 91 | swatch: { 92 | minWidth: '120px', 93 | padding: '8px', 94 | background: '#ffffff', 95 | display: 'inline-block', 96 | cursor: 'pointer', 97 | borderRadius: '25px', 98 | textAlign: 'left', 99 | }, 100 | hex: { 101 | verticalAlign: 'middle', 102 | lineHeight: '30px', 103 | }, 104 | popover: { 105 | position: 'absolute', 106 | zIndex: '2', 107 | }, 108 | cover: { 109 | position: 'fixed', 110 | top: '0px', 111 | right: '0px', 112 | bottom: '0px', 113 | left: '0px', 114 | }, 115 | }; 116 | 117 | return ( 118 |
124 | 130 | {displayColorPicker 131 | ? ( 132 |
133 |
134 | 138 |
139 | ) : null} 140 |
141 | ); 142 | }, 143 | }); 144 | -------------------------------------------------------------------------------- /widgets/color/src/index.js: -------------------------------------------------------------------------------- 1 | import Control from './Control'; 2 | 3 | export default { 4 | Control, 5 | }; 6 | -------------------------------------------------------------------------------- /widgets/fontawesome/CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Change Log 2 | 3 | All notable changes to this project will be documented in this file. 4 | See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. 5 | 6 | 7 | # [3.1.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-fontawesome@3.0.0...netlify-cms-widget-fontawesome@3.1.0) (2018-09-24) 8 | 9 | 10 | ### Features 11 | 12 | * **fontawesome:** support array and object return value ([2154fb5](https://github.com/ekoeryanto/netlify-cms-widgets/commit/2154fb5)) 13 | 14 | 15 | 16 | 17 | 18 | # [3.0.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-fontawesome@2.1.0...netlify-cms-widget-fontawesome@3.0.0) (2018-09-03) 19 | 20 | 21 | ### Chores 22 | 23 | * **deps:** using react list ([48e585d](https://github.com/ekoeryanto/netlify-cms-widgets/commit/48e585d)) 24 | 25 | 26 | ### Features 27 | 28 | * using react list ([7819190](https://github.com/ekoeryanto/netlify-cms-widgets/commit/7819190)) 29 | 30 | 31 | ### BREAKING CHANGES 32 | 33 | * **deps:** not using react-virtualized-select any more 34 | * now depends on react-list not react-virtualized-select 35 | 36 | 37 | 38 | 39 | 40 | # [2.1.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-fontawesome@2.0.0...netlify-cms-widget-fontawesome@2.1.0) (2018-08-12) 41 | 42 | 43 | ### Features 44 | 45 | * **fontawesome:** add each bundle to each type ([#59](https://github.com/ekoeryanto/netlify-cms-widgets/issues/59)) ([c65843b](https://github.com/ekoeryanto/netlify-cms-widgets/commit/c65843b)), closes [#58](https://github.com/ekoeryanto/netlify-cms-widgets/issues/58) 46 | 47 | 48 | 49 | 50 | 51 | 52 | # [2.0.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-fontawesome@1.3.1...netlify-cms-widget-fontawesome@2.0.0) (2018-08-10) 53 | 54 | 55 | ### Chores 56 | 57 | * **dependencies:** upgrade netlify-cms v2 ([#54](https://github.com/ekoeryanto/netlify-cms-widgets/issues/54)) ([6feed32](https://github.com/ekoeryanto/netlify-cms-widgets/commit/6feed32)) 58 | 59 | 60 | ### BREAKING CHANGES 61 | 62 | * **dependencies:** for browser usage as of netlify-cms ^2, we don't need to use `netlify-cms/dist/cms.css` 63 | 64 | 65 | 66 | 67 | 68 | ## [1.3.1](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-fontawesome@1.3.0...netlify-cms-widget-fontawesome@1.3.1) (2018-08-10) 69 | 70 | 71 | ### Bug Fixes 72 | 73 | * big bundle size ([746f733](https://github.com/ekoeryanto/netlify-cms-widgets/commit/746f733)) 74 | 75 | 76 | 77 | 78 | 79 | # [1.3.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-fontawesome@1.2.1...netlify-cms-widget-fontawesome@1.3.0) (2018-08-09) 80 | 81 | 82 | 83 | 84 | **Note:** Version bump only for package netlify-cms-widget-fontawesome 85 | 86 | 87 | ## [1.2.1](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-fontawesome@1.2.0...netlify-cms-widget-fontawesome@1.2.1) (2018-06-12) 88 | 89 | 90 | 91 | 92 | **Note:** Version bump only for package netlify-cms-widget-fontawesome 93 | 94 | 95 | # [1.2.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-fontawesome@1.1.1...netlify-cms-widget-fontawesome@1.2.0) (2018-05-24) 96 | 97 | 98 | ### Features 99 | 100 | * use babel stable v6 ([ee2bcfd](https://github.com/ekoeryanto/netlify-cms-widgets/commit/ee2bcfd)) 101 | 102 | 103 | 104 | 105 | 106 | # [1.2.0-alpha.c8c7f2ad](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-fontawesome@1.1.1...netlify-cms-widget-fontawesome@1.2.0-alpha.c8c7f2ad) (2018-05-24) 107 | 108 | 109 | ### Features 110 | 111 | * use babel stable v6 ([ee2bcfd](https://github.com/ekoeryanto/netlify-cms-widgets/commit/ee2bcfd)) 112 | 113 | 114 | 115 | 116 | 117 | ## [1.1.1](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-fontawesome@1.1.0...netlify-cms-widget-fontawesome@1.1.1) (2018-05-12) 118 | 119 | 120 | ### Bug Fixes 121 | 122 | * iife globals wrapped on window to avoid unwanted character ([3eae5be](https://github.com/ekoeryanto/netlify-cms-widgets/commit/3eae5be)), closes [#4](https://github.com/ekoeryanto/netlify-cms-widgets/issues/4) 123 | 124 | 125 | 126 | 127 | 128 | # [1.1.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-fontawesome@1.0.1...netlify-cms-widget-fontawesome@1.1.0) (2018-05-12) 129 | 130 | 131 | ### Features 132 | 133 | * patch to work with official netlify-cms ([c47c7ae](https://github.com/ekoeryanto/netlify-cms-widgets/commit/c47c7ae)) 134 | 135 | 136 | 137 | 138 | 139 | ## [1.0.1](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-fontawesome@1.0.0...netlify-cms-widget-fontawesome@1.0.1) (2018-05-08) 140 | 141 | 142 | 143 | 144 | **Note:** Version bump only for package netlify-cms-widget-fontawesome 145 | 146 | 147 | # [1.0.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-fontawesome@0.2.0...netlify-cms-widget-fontawesome@1.0.0) (2018-05-07) 148 | 149 | 150 | ### Chores 151 | 152 | * migrate to rollup ([68a11eb](https://github.com/ekoeryanto/netlify-cms-widgets/commit/68a11eb)) 153 | 154 | 155 | ### BREAKING CHANGES 156 | 157 | * - all the depedencies are excluded when possible and it on peerDependencies 158 | - compiled file now renamed to follow the widget now not `main.js` 159 | 160 | 161 | 162 | 163 | 164 | # [0.2.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-fontawesome@0.1.0...netlify-cms-widget-fontawesome@0.2.0) (2018-05-05) 165 | 166 | 167 | ### Features 168 | 169 | * react-virtualized css not included ([f2141e5](https://github.com/ekoeryanto/netlify-cms-widgets/commit/f2141e5)) 170 | 171 | 172 | 173 | 174 | 175 | # [0.1.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-fontawesome@0.0.1-alpha.0...netlify-cms-widget-fontawesome@0.1.0) (2018-05-03) 176 | 177 | 178 | ### Features 179 | 180 | * **fontawesome:** single icon type build ([798f744](https://github.com/ekoeryanto/netlify-cms-widgets/commit/798f744)) 181 | -------------------------------------------------------------------------------- /widgets/fontawesome/README.md: -------------------------------------------------------------------------------- 1 | # netlify-cms-widget-fontawesome 2 | 3 | Fontawesome widget for Netlify CMS. 4 | 5 | ## Install and Usage 6 | 7 | ### As an npm package: 8 | 9 | ```shell 10 | npm install netlify-cms-widget-fontawesome @fortawesome/fontawesome-free @fortawesome/react-fontawesome @fortawesome/free-brands-svg-icons @fortawesome/free-regular-svg-icons @fortawesome/free-solid-svg-icons 11 | ``` 12 | 13 | ```js 14 | import CMS from "netlify-cms"; 15 | import * as FontawesomeWidget from "netlify-cms-widget-fontawesome"; 16 | CMS.registerWidget( 17 | "fontawesome", 18 | FontawesomeWidget.Solid, 19 | FontawesomeWidget.Preview 20 | ); 21 | ``` 22 | 23 | Add to your config.yml: 24 | 25 | ```yaml 26 | fields: 27 | - name: 28 | label: 29 | widget: fontawesome-solid 30 | ``` 31 | 32 | ## Example 33 | 34 | see `public` directory 35 | -------------------------------------------------------------------------------- /widgets/fontawesome/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "netlify-cms-widget-fontawesome", 3 | "version": "3.1.0", 4 | "description": "Fontawesome widget for Netlify CMS.", 5 | "main": "dist/cjs/fontawesome.min.js", 6 | "browser": "dist/umd/fontawesome.min.js", 7 | "module": "dist/es/fontawesome.min.js", 8 | "files": [ 9 | "dist/**", 10 | "src/**" 11 | ], 12 | "scripts": { 13 | "start": "rollup -c -w", 14 | "build": "npm-run-all --parallel build:*", 15 | "build:dev-all": "rollup -c", 16 | "build:dev-preview": "rollup -c --environment FATYPE:preview", 17 | "build:dev-regular": "rollup -c --environment FATYPE:regular", 18 | "build:dev-solid": "rollup -c --environment FATYPE:solid", 19 | "build:dev-brands": "rollup -c --environment FATYPE:brands", 20 | "build:prod-all": "rollup -c --environment NODE_ENV:production", 21 | "build:prod-preview": "rollup -c --environment NODE_ENV:production,FATYPE:preview", 22 | "build:prod-regular": "rollup -c --environment NODE_ENV:production,FATYPE:regular", 23 | "build:prod-solid": "rollup -c --environment NODE_ENV:production,FATYPE:solid", 24 | "build:prod-brands": "rollup -c --environment NODE_ENV:production,FATYPE:brands", 25 | "prebuild": "rimraf dist", 26 | "prepublishOnly": "npm run build" 27 | }, 28 | "keywords": [ 29 | "netlify", 30 | "netlify-cms", 31 | "cms", 32 | "widget", 33 | "fontawesome" 34 | ], 35 | "author": "Eko Eryanto ", 36 | "bugs": { 37 | "url": "https://github.com/ekoeryanto/netlify-cms-widgets/issues" 38 | }, 39 | "homepage": "https://github.com/ekoeryanto/netlify-cms-widgets/tree/master/widgets/fontawesome#readme", 40 | "repository": { 41 | "type": "git", 42 | "url": "https://github.com/ekoeryanto/netlify-cms-widgets.git" 43 | }, 44 | "license": "MIT", 45 | "devDependencies": { 46 | "@babel/core": "^7.0.0", 47 | "@babel/plugin-proposal-class-properties": "^7.0.0", 48 | "@babel/plugin-proposal-json-strings": "^7.0.0", 49 | "@babel/plugin-syntax-dynamic-import": "^7.0.0", 50 | "@babel/plugin-syntax-import-meta": "^7.0.0", 51 | "@babel/preset-env": "^7.0.0", 52 | "@babel/preset-react": "^7.0.0", 53 | "@fortawesome/fontawesome-free": "^5.2.0", 54 | "@fortawesome/fontawesome-svg-core": "^1.2.2", 55 | "@fortawesome/free-brands-svg-icons": "^5.2.0", 56 | "@fortawesome/free-regular-svg-icons": "^5.2.0", 57 | "@fortawesome/free-solid-svg-icons": "^5.2.0", 58 | "@fortawesome/react-fontawesome": "^0.1.0", 59 | "babel-plugin-transform-react-remove-prop-types": "^0.4.13", 60 | "create-react-class": "^15.6.3", 61 | "lodash": "^4.17.10", 62 | "module-igniter": "^1.1.0", 63 | "netlify-cms": "^2.0.0", 64 | "npm-run-all": "^4.1.2", 65 | "prop-types": "^15.6.1", 66 | "react-immutable-proptypes": "^2.1.0", 67 | "rimraf": "^2.6.2", 68 | "rollup": "^0.66.4", 69 | "rollup-plugin-babel": "^4.0.2", 70 | "rollup-plugin-commonjs": "^9.1.3", 71 | "rollup-plugin-livereload": "^0.6.0", 72 | "rollup-plugin-node-resolve": "^3.3.0", 73 | "rollup-plugin-postcss": "^1.6.1", 74 | "rollup-plugin-replace": "^2.0.0", 75 | "rollup-plugin-serve": "^0.6.0", 76 | "rollup-plugin-strip": "^1.1.1", 77 | "rollup-plugin-terser": "^3.0.0" 78 | }, 79 | "peerDependencies": { 80 | "@fortawesome/fontawesome-free": "^5.2.0", 81 | "@fortawesome/fontawesome-svg-core": "^1.2.2", 82 | "@fortawesome/free-brands-svg-icons": "^5.2.0", 83 | "@fortawesome/free-regular-svg-icons": "^5.2.0", 84 | "@fortawesome/free-solid-svg-icons": "^5.2.0", 85 | "@fortawesome/react-fontawesome": "^0.1.0", 86 | "netlify-cms": "^2.0.0 | ^1.0.0", 87 | "react": "^16.4.0" 88 | }, 89 | "dependencies": { 90 | "@pake/react-list": "^1.0.0" 91 | } 92 | } 93 | -------------------------------------------------------------------------------- /widgets/fontawesome/public/config.yml: -------------------------------------------------------------------------------- 1 | backend: 2 | name: test-repo 3 | login: false 4 | media_folder: assets 5 | collections: 6 | - name: example 7 | label: Example 8 | files: 9 | - file: _data/fontawesome.yml 10 | name: fontawesome-widget 11 | label: Fontawesome 12 | fields: 13 | - name: fontawesome-solid 14 | label: Fontawesome Solid Widget 15 | widget: fontawesome-solid 16 | type: object 17 | - name: fontawesome-brands 18 | label: Fontawesome Brands Widget 19 | widget: fontawesome-brands 20 | type: string 21 | default: fab facebook 22 | - name: fontawesome-regular 23 | label: Fontawesome Regular Widget 24 | type: array 25 | widget: fontawesome-regular 26 | default: [far, bell] 27 | -------------------------------------------------------------------------------- /widgets/fontawesome/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Fontawesome Example | Netlify CMS Widgets 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 29 | 30 | 31 | 32 | -------------------------------------------------------------------------------- /widgets/fontawesome/rollup.config.js: -------------------------------------------------------------------------------- 1 | import igniter from 'module-igniter'; 2 | import { mapValues, startCase } from 'lodash'; 3 | 4 | const plug = igniter({ prefix: 'rollup-plugin-' }); 5 | const environment = process.env.NODE_ENV || 'development'; 6 | const prod = environment === 'production'; 7 | const watch = process.env.ROLLUP_WATCH; 8 | const FATYPE = (process.env.FATYPE || '').toLowerCase(); 9 | 10 | const globals = { 11 | 'netlify-cms': 'CMS', 12 | react: 'React', 13 | 'react-dom': 'ReactDOM', 14 | 'prop-types': 'PropTypes', 15 | immutable: 'Immutable', 16 | 'react-immutable-proptypes': 'ImmutablePropTypes', 17 | classnames: 'classNames', 18 | 'create-react-class': 'createClass', 19 | '@fortawesome/fontawesome-free': 'FontAwesome', 20 | '@fortawesome/free-brands-svg-icons': 'free-brands-svg-icons', 21 | '@fortawesome/free-regular-svg-icons': 'free-regular-svg-icons', 22 | '@fortawesome/free-solid-svg-icons': 'free-solid-svg-icons', 23 | '@fortawesome/react-fontawesome': 'react-fontawesome', 24 | }; 25 | 26 | const external = Object.keys(globals); 27 | const WATCH_FORMAT = process.env.WATCH_FORMAT || 'umd'; 28 | const formats = ['umd', 'iife', 'cjs', 'es']; 29 | const extension = prod ? 'min.js' : 'js'; 30 | const isBrowser = format => format === 'umd' || format === 'iife'; 31 | 32 | const createOutput = (format = 'umd') => ({ 33 | sourcemap: prod, 34 | name: `NetlifyCMSWidgetFontawesome${startCase(FATYPE)}`, 35 | file: `dist/${format}/${FATYPE || 'fontawesome'}.${extension}`, 36 | format, 37 | globals: format === 'iife' ? mapValues(globals, o => `window['${o}']`) : globals, 38 | }); 39 | 40 | export default (watch ? [WATCH_FORMAT] : formats).map(format => ({ 41 | input: `src/${FATYPE ? startCase(FATYPE) : 'index'}.js`, 42 | output: createOutput(format), 43 | external, 44 | plugins: [ 45 | ...plug({ 46 | replace: { 'process.env.NODE_ENV': JSON.stringify(environment) }, 47 | 'node-resolve': true, 48 | commonjs: { 49 | include: ['**/node_modules/**'], 50 | }, 51 | babel: { 52 | babelrc: false, 53 | exclude: ['**/node_modules/**'], 54 | presets: [ 55 | ['@babel/preset-env', { modules: false }], 56 | ['@babel/preset-react', isBrowser(format) ? { pragma: 'h' } : {}], 57 | ], 58 | plugins: [ 59 | isBrowser(format) && [ 60 | 'transform-react-remove-prop-types', 61 | { 62 | removeImport: true, 63 | additionalLibraries: ['react-immutable-proptypes'], 64 | }, 65 | ], 66 | ].filter(Boolean), 67 | }, 68 | postcss: { 69 | sourcemap: prod, 70 | minimize: prod, 71 | }, 72 | }), 73 | ...plug({ strip: { debugger: true } }, 'terser::terser', prod), 74 | ...plug( 75 | { 76 | serve: { 77 | contentBase: [ 78 | '../../node_modules', 79 | '../../widgets', 80 | '../../core', 81 | `dist/${WATCH_FORMAT}`, 82 | 'public', 83 | ], 84 | historyApiFallback: true, 85 | }, 86 | livereload: true, 87 | }, 88 | watch, 89 | ), 90 | ], 91 | })); 92 | -------------------------------------------------------------------------------- /widgets/fontawesome/src/Brands.js: -------------------------------------------------------------------------------- 1 | import { fab } from '@fortawesome/free-brands-svg-icons'; 2 | 3 | import withIcon from './withIcon'; 4 | 5 | export default withIcon(fab); 6 | -------------------------------------------------------------------------------- /widgets/fontawesome/src/Preview.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; 3 | 4 | const Preview = ({ value, ...props }) => { 5 | if (!value) return ''; 6 | const icon = typeof value === 'string' ? value.split(' ') : value; 7 | return ; 8 | }; 9 | 10 | export default Preview; 11 | -------------------------------------------------------------------------------- /widgets/fontawesome/src/Regular.js: -------------------------------------------------------------------------------- 1 | import { far } from '@fortawesome/free-regular-svg-icons'; 2 | 3 | import withIcon from './withIcon'; 4 | 5 | export default withIcon(far); 6 | -------------------------------------------------------------------------------- /widgets/fontawesome/src/Solid.js: -------------------------------------------------------------------------------- 1 | import { fas } from '@fortawesome/free-solid-svg-icons'; 2 | 3 | import withIcon from './withIcon'; 4 | 5 | export default withIcon(fas); 6 | -------------------------------------------------------------------------------- /widgets/fontawesome/src/index.js: -------------------------------------------------------------------------------- 1 | import Brands from './Brands'; 2 | import Regular from './Regular'; 3 | import Solid from './Solid'; 4 | import Preview from './Preview'; 5 | import withIcon from './withIcon'; 6 | 7 | export default { 8 | Brands, 9 | Regular, 10 | Solid, 11 | Preview, 12 | withIcon, 13 | }; 14 | -------------------------------------------------------------------------------- /widgets/fontawesome/src/withIcon.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import createReactClass from 'create-react-class'; 3 | import ImmutablePropTypes from 'react-immutable-proptypes'; 4 | import PropTypes from 'prop-types'; 5 | import { library } from '@fortawesome/fontawesome-svg-core'; 6 | import ReactList from '@pake/react-list/esm/react-list.min'; 7 | 8 | import Preview from './Preview'; 9 | 10 | export default function (icons) { 11 | const types = { 12 | fab: 'brands', 13 | far: 'regular', 14 | fas: 'solid', 15 | }; 16 | 17 | if (!icons) { 18 | // eslint-disable-next-line 19 | return function({ field }) { 20 | return ( 21 |
22 | 23 | Fontawesome 24 | {types[icons.prefix]} 25 | 26 | {' '} 27 | not found but it registered to 28 | {' '} 29 | {field.get('widget')} 30 | {' '} 31 | widget. 32 |
33 | ); 34 | }; 35 | } 36 | 37 | library.add(icons); 38 | 39 | return createReactClass({ 40 | propTypes: { 41 | onChange: PropTypes.func.isRequired, 42 | forID: PropTypes.string.isRequired, 43 | value: PropTypes.node, 44 | setActiveStyle: PropTypes.func.isRequired, 45 | setInactiveStyle: PropTypes.func.isRequired, 46 | classNameWrapper: PropTypes.string.isRequired, 47 | field: ImmutablePropTypes.mapContains({ 48 | default: PropTypes.string, 49 | }).isRequired, 50 | }, 51 | 52 | getDefaultProps() { 53 | return { value: '' }; 54 | }, 55 | 56 | getInitialState() { 57 | return { 58 | iconLibrary: Object.values(icons), 59 | }; 60 | }, 61 | 62 | render() { 63 | const { 64 | forID, 65 | field, 66 | value, 67 | setActiveStyle, 68 | setInactiveStyle, 69 | classNameWrapper, 70 | onChange, 71 | } = this.props; 72 | 73 | const { iconLibrary } = this.state; 74 | 75 | const pageSize = 10; 76 | 77 | const valueType = field.get('type', 'string'); 78 | let cux = 0; 79 | let currentValue = value || field.get('default'); 80 | 81 | // normalize current value 82 | if (currentValue) { 83 | if (typeof currentValue === 'string') { 84 | currentValue = currentValue.split(' '); 85 | } else if (currentValue.toJS) { 86 | // expect object or array 87 | currentValue = currentValue.toJS(); 88 | } 89 | 90 | if (Array.isArray(currentValue)) { 91 | currentValue = { prefix: currentValue[0], iconName: currentValue[1] }; 92 | } 93 | 94 | cux = iconLibrary.findIndex( 95 | l => l.prefix === currentValue.prefix && l.iconName === currentValue.iconName, 96 | ); 97 | } else { 98 | currentValue = iconLibrary[cux]; 99 | } 100 | 101 | return ( 102 |
109 | { 117 | const color = cux === x ? '#1976D2' : '#3F51B5'; 118 | 119 | return ( 120 | e} 126 | onClick={() => { 127 | let selected; 128 | switch (valueType) { 129 | case 'object': 130 | selected = iconLibrary[x]; 131 | break; 132 | case 'array': 133 | selected = [iconLibrary[x].prefix, iconLibrary[x].iconName]; 134 | break; 135 | case 'string': 136 | default: 137 | selected = `${iconLibrary[x].prefix} ${iconLibrary[x].iconName}`; 138 | break; 139 | } 140 | 141 | onChange(selected); 142 | }} 143 | style={{ 144 | cursor: 'pointer', color, fontSize: 50, padding: 8, 145 | }} 146 | > 147 | 148 | 149 | ); 150 | }} 151 | /> 152 |
153 | ); 154 | }, 155 | }); 156 | } 157 | -------------------------------------------------------------------------------- /widgets/material-icons/CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Change Log 2 | 3 | All notable changes to this project will be documented in this file. 4 | See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. 5 | 6 | 7 | ## [4.0.3](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-material-icons@4.0.2...netlify-cms-widget-material-icons@4.0.3) (2018-09-04) 8 | 9 | 10 | ### Bug Fixes 11 | 12 | * **material-icons:** icon inside list need to click to reveal ([7121f38](https://github.com/ekoeryanto/netlify-cms-widgets/commit/7121f38)) 13 | 14 | 15 | 16 | 17 | 18 | ## [4.0.2](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-material-icons@4.0.1...netlify-cms-widget-material-icons@4.0.2) (2018-09-03) 19 | 20 | 21 | ### Bug Fixes 22 | 23 | * inconsistent icon size ([3faacbc](https://github.com/ekoeryanto/netlify-cms-widgets/commit/3faacbc)) 24 | 25 | 26 | 27 | 28 | 29 | ## [4.0.1](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-material-icons@4.0.0...netlify-cms-widget-material-icons@4.0.1) (2018-09-03) 30 | 31 | 32 | 33 | 34 | **Note:** Version bump only for package netlify-cms-widget-material-icons 35 | 36 | 37 | # [4.0.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-material-icons@3.0.1...netlify-cms-widget-material-icons@4.0.0) (2018-09-03) 38 | 39 | 40 | ### Chores 41 | 42 | * **deps:** using react list ([48e585d](https://github.com/ekoeryanto/netlify-cms-widgets/commit/48e585d)) 43 | 44 | 45 | ### Features 46 | 47 | * react-list for material-icons ([39d8803](https://github.com/ekoeryanto/netlify-cms-widgets/commit/39d8803)) 48 | * using static size and direct json icon list ([2283a0a](https://github.com/ekoeryanto/netlify-cms-widgets/commit/2283a0a)) 49 | 50 | 51 | ### BREAKING CHANGES 52 | 53 | * **deps:** not using react-virtualized-select any more 54 | 55 | 56 | 57 | 58 | 59 | ## [3.0.1](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-material-icons@3.0.0...netlify-cms-widget-material-icons@3.0.1) (2018-09-02) 60 | 61 | 62 | 63 | 64 | **Note:** Version bump only for package netlify-cms-widget-material-icons 65 | 66 | 67 | # [3.0.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-material-icons@2.2.1...netlify-cms-widget-material-icons@3.0.0) (2018-08-10) 68 | 69 | 70 | ### Chores 71 | 72 | * **dependencies:** upgrade netlify-cms v2 ([#54](https://github.com/ekoeryanto/netlify-cms-widgets/issues/54)) ([6feed32](https://github.com/ekoeryanto/netlify-cms-widgets/commit/6feed32)) 73 | 74 | 75 | ### BREAKING CHANGES 76 | 77 | * **dependencies:** for browser usage as of netlify-cms ^2, we don't need to use `netlify-cms/dist/cms.css` 78 | 79 | 80 | 81 | 82 | 83 | ## [2.2.1](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-material-icons@2.2.0...netlify-cms-widget-material-icons@2.2.1) (2018-06-12) 84 | 85 | 86 | 87 | 88 | **Note:** Version bump only for package netlify-cms-widget-material-icons 89 | 90 | 91 | # [2.2.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-material-icons@2.1.1...netlify-cms-widget-material-icons@2.2.0) (2018-05-24) 92 | 93 | 94 | ### Features 95 | 96 | * use babel stable v6 ([ee2bcfd](https://github.com/ekoeryanto/netlify-cms-widgets/commit/ee2bcfd)) 97 | 98 | 99 | 100 | 101 | 102 | # [2.2.0-alpha.c8c7f2ad](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-material-icons@2.1.1...netlify-cms-widget-material-icons@2.2.0-alpha.c8c7f2ad) (2018-05-24) 103 | 104 | 105 | ### Features 106 | 107 | * use babel stable v6 ([ee2bcfd](https://github.com/ekoeryanto/netlify-cms-widgets/commit/ee2bcfd)) 108 | 109 | 110 | 111 | 112 | 113 | ## [2.1.1](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-material-icons@2.1.0...netlify-cms-widget-material-icons@2.1.1) (2018-05-12) 114 | 115 | 116 | ### Bug Fixes 117 | 118 | * iife globals wrapped on window to avoid unwanted character ([3eae5be](https://github.com/ekoeryanto/netlify-cms-widgets/commit/3eae5be)), closes [#4](https://github.com/ekoeryanto/netlify-cms-widgets/issues/4) 119 | 120 | 121 | 122 | 123 | 124 | # [2.1.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-material-icons@2.0.1...netlify-cms-widget-material-icons@2.1.0) (2018-05-12) 125 | 126 | 127 | ### Features 128 | 129 | * patch to work with official netlify-cms ([c47c7ae](https://github.com/ekoeryanto/netlify-cms-widgets/commit/c47c7ae)) 130 | 131 | 132 | 133 | 134 | 135 | ## [2.0.1](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-material-icons@2.0.0...netlify-cms-widget-material-icons@2.0.1) (2018-05-08) 136 | 137 | 138 | 139 | 140 | **Note:** Version bump only for package netlify-cms-widget-material-icons 141 | 142 | 143 | # [2.0.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-material-icons@1.2.0...netlify-cms-widget-material-icons@2.0.0) (2018-05-07) 144 | 145 | 146 | ### Chores 147 | 148 | * migrate to rollup ([68a11eb](https://github.com/ekoeryanto/netlify-cms-widgets/commit/68a11eb)) 149 | 150 | 151 | ### BREAKING CHANGES 152 | 153 | * - all the depedencies are excluded when possible and it on peerDependencies 154 | - compiled file now renamed to follow the widget now not `main.js` 155 | 156 | 157 | 158 | 159 | 160 | # [1.2.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-material-icons@1.1.0...netlify-cms-widget-material-icons@1.2.0) (2018-05-05) 161 | 162 | 163 | ### Features 164 | 165 | * react-virtualized css not included ([f2141e5](https://github.com/ekoeryanto/netlify-cms-widgets/commit/f2141e5)) 166 | 167 | 168 | 169 | 170 | 171 | # [1.1.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-material-icons@1.0.0...netlify-cms-widget-material-icons@1.1.0) (2018-05-04) 172 | 173 | 174 | ### Features 175 | 176 | * **material-icons:** using virtualized select for performance ([2e80a95](https://github.com/ekoeryanto/netlify-cms-widgets/commit/2e80a95)) 177 | 178 | 179 | 180 | 181 | 182 | # [1.0.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-material-icons@0.1.1...netlify-cms-widget-material-icons@1.0.0) (2018-05-03) 183 | 184 | 185 | ### Chores 186 | 187 | * **refactor:** rename library instance ([516a5d0](https://github.com/ekoeryanto/netlify-cms-widgets/commit/516a5d0)) 188 | 189 | 190 | ### BREAKING CHANGES 191 | 192 | * **refactor:** `NetlifyCMSNameWidget` now `NetlifyCMSWidgetName` 193 | -------------------------------------------------------------------------------- /widgets/material-icons/README.md: -------------------------------------------------------------------------------- 1 | # netlify-cms-widget-material-icons 2 | 3 | Material Icons widget for Netlify CMS. 4 | 5 | ## Install and Usage 6 | 7 | ### As an npm package: 8 | 9 | ```shell 10 | npm install netlify-cms-widget-material-icons 11 | ``` 12 | 13 | ```scss 14 | // css 15 | @import url("https://fonts.googleapis.com/css?family=Material+Icons"); 16 | ``` 17 | 18 | ```js 19 | // js 20 | import CMS from "netlify-cms"; 21 | import * as MaterialIconsWidget from "netlify-cms-widget-material-icons"; 22 | CMS.registerWidget( 23 | "material-icons", 24 | MaterialIconsWidget.Control, 25 | MaterialIconsWidget.Preview 26 | ); 27 | CMS.registerPreviewStyle( 28 | "https://fonts.googleapis.com/css?family=Material+Icons" 29 | ); 30 | ``` 31 | 32 | Add to your config.yml: 33 | 34 | ```yaml 35 | fields: 36 | - name: 37 | label: 38 | widget: material-icons 39 | ``` 40 | 41 | ## Example 42 | 43 | see `public` directory 44 | -------------------------------------------------------------------------------- /widgets/material-icons/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "netlify-cms-widget-material-icons", 3 | "version": "4.0.3", 4 | "description": "Material Icons widget for Netlify CMS.", 5 | "main": "dist/cjs/material-icons.min.js", 6 | "browser": "dist/umd/material-icons.min.js", 7 | "module": "dist/es/material-icons.min.js", 8 | "files": [ 9 | "dist/**", 10 | "src/**" 11 | ], 12 | "scripts": { 13 | "start": "rollup -c -w", 14 | "build": "npm-run-all --parallel build:*", 15 | "build:development": "rollup -c", 16 | "build:production": "rollup -c --environment NODE_ENV:production", 17 | "prebuild": "rimraf dist", 18 | "prepublishOnly": "npm run build" 19 | }, 20 | "keywords": [ 21 | "netlify", 22 | "netlify-cms", 23 | "cms", 24 | "widget", 25 | "material-icons" 26 | ], 27 | "author": "Eko Eryanto ", 28 | "bugs": { 29 | "url": "https://github.com/ekoeryanto/netlify-cms-widgets/issues" 30 | }, 31 | "homepage": "https://github.com/ekoeryanto/netlify-cms-widgets/tree/master/widgets/material-icons#readme", 32 | "repository": { 33 | "type": "git", 34 | "url": "https://github.com/ekoeryanto/netlify-cms-widgets.git" 35 | }, 36 | "license": "MIT", 37 | "devDependencies": { 38 | "@babel/core": "^7.0.0", 39 | "@babel/plugin-proposal-class-properties": "^7.0.0", 40 | "@babel/plugin-proposal-json-strings": "^7.0.0", 41 | "@babel/plugin-syntax-dynamic-import": "^7.0.0", 42 | "@babel/plugin-syntax-import-meta": "^7.0.0", 43 | "@babel/preset-env": "^7.0.0", 44 | "@babel/preset-react": "^7.0.0", 45 | "babel-plugin-transform-react-remove-prop-types": "^0.4.13", 46 | "create-react-class": "^15.6.3", 47 | "lodash": "^4.17.10", 48 | "module-igniter": "^1.1.0", 49 | "netlify-cms": "^2.0.0", 50 | "npm-run-all": "^4.1.2", 51 | "prop-types": "^15.6.1", 52 | "react-immutable-proptypes": "^2.1.0", 53 | "rimraf": "^2.6.2", 54 | "rollup": "^0.66.4", 55 | "rollup-plugin-babel": "^4.0.2", 56 | "rollup-plugin-commonjs": "^9.1.3", 57 | "rollup-plugin-livereload": "^0.6.0", 58 | "rollup-plugin-node-resolve": "^3.3.0", 59 | "rollup-plugin-postcss": "^1.6.1", 60 | "rollup-plugin-replace": "^2.0.0", 61 | "rollup-plugin-serve": "^0.6.0", 62 | "rollup-plugin-strip": "^1.1.1", 63 | "rollup-plugin-terser": "^3.0.0" 64 | }, 65 | "peerDependencies": { 66 | "netlify-cms": "^2.0.0 | ^1.0.0", 67 | "react": "^16.4.0" 68 | }, 69 | "dependencies": { 70 | "@pake/react-list": "^1.0.0", 71 | "material-design-icon-list": "^3.0.3", 72 | "rollup-plugin-json": "^3.0.0" 73 | } 74 | } 75 | -------------------------------------------------------------------------------- /widgets/material-icons/public/config.yml: -------------------------------------------------------------------------------- 1 | backend: 2 | name: test-repo 3 | login: false 4 | media_folder: assets 5 | collections: 6 | - name: example 7 | label: Example 8 | files: 9 | - name: material-icons 10 | label: Material Icons 11 | file: _data/material-icons.json 12 | fields: 13 | - name: icon 14 | label: Icon 15 | widget: material-icons 16 | - name: iconlist 17 | label: Icon List 18 | widget: list 19 | fields: 20 | - {name: icon, label: Icon, widget: material-icons} 21 | -------------------------------------------------------------------------------- /widgets/material-icons/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Material Icons Example | Netlify CMS Widgets 7 | 8 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 34 | 35 | 36 | 37 | -------------------------------------------------------------------------------- /widgets/material-icons/rollup.config.js: -------------------------------------------------------------------------------- 1 | import igniter from 'module-igniter'; 2 | import { mapValues } from 'lodash'; 3 | 4 | const plug = igniter({ prefix: 'rollup-plugin-' }); 5 | const environment = process.env.NODE_ENV || 'development'; 6 | const prod = environment === 'production'; 7 | const watch = process.env.ROLLUP_WATCH; 8 | 9 | const globals = { 10 | 'netlify-cms': 'CMS', 11 | react: 'React', 12 | 'react-dom': 'ReactDOM', 13 | 'prop-types': 'PropTypes', 14 | immutable: 'Immutable', 15 | 'react-immutable-proptypes': 'ImmutablePropTypes', 16 | classnames: 'classNames', 17 | 'create-react-class': 'createClass', 18 | }; 19 | 20 | const external = Object.keys(globals); 21 | const WATCH_FORMAT = process.env.WATCH_FORMAT || 'umd'; 22 | const formats = ['umd', 'iife', 'cjs', 'es']; 23 | const extension = prod ? 'min.js' : 'js'; 24 | const isBrowser = format => format === 'umd' || format === 'iife'; 25 | 26 | const createOutput = (format = 'umd') => ({ 27 | sourcemap: prod, 28 | name: 'NetlifyCMSWidgetMaterialIcons', 29 | file: `dist/${format}/material-icons.${extension}`, 30 | format, 31 | globals: format === 'iife' ? mapValues(globals, o => `window['${o}']`) : globals, 32 | }); 33 | 34 | export default (watch ? [WATCH_FORMAT] : formats).map(format => ({ 35 | input: 'src/index.js', 36 | output: createOutput(format), 37 | external, 38 | plugins: [ 39 | ...plug({ 40 | replace: { 'process.env.NODE_ENV': JSON.stringify(environment) }, 41 | 'node-resolve': true, 42 | commonjs: { 43 | include: [ 44 | '**/node_modules/react', 45 | ], 46 | }, 47 | json: true, 48 | babel: { 49 | babelrc: false, 50 | exclude: ['**/node_modules/**'], 51 | presets: [ 52 | ['@babel/preset-env', { modules: false }], 53 | ['@babel/preset-react', isBrowser(format) ? { pragma: 'h' } : {}], 54 | ], 55 | plugins: [ 56 | isBrowser(format) && [ 57 | 'transform-react-remove-prop-types', 58 | { 59 | removeImport: true, 60 | additionalLibraries: ['react-immutable-proptypes'], 61 | }, 62 | ], 63 | ].filter(Boolean), 64 | }, 65 | postcss: { 66 | sourcemap: prod, 67 | minimize: prod, 68 | }, 69 | }), 70 | ...plug({ strip: { debugger: true } }, 'terser::terser', prod), 71 | ...plug( 72 | { 73 | serve: { 74 | contentBase: [ 75 | '../../node_modules', 76 | '../../widgets', 77 | '../../core', 78 | `dist/${WATCH_FORMAT}`, 79 | 'public', 80 | ], 81 | historyApiFallback: true, 82 | }, 83 | livereload: true, 84 | }, 85 | watch, 86 | ), 87 | ], 88 | })); 89 | -------------------------------------------------------------------------------- /widgets/material-icons/src/Control.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import createReactClass from 'create-react-class'; 3 | import PropTypes from 'prop-types'; 4 | import ImmutablePropTypes from 'react-immutable-proptypes'; 5 | import ReactList from '@pake/react-list/esm/react-list.min'; 6 | import icons from 'material-design-icon-list/data/list.json'; 7 | import MaterialIcon from './MaterialIcon'; 8 | 9 | export default createReactClass({ 10 | propTypes: { 11 | onChange: PropTypes.func.isRequired, 12 | forID: PropTypes.string.isRequired, 13 | value: PropTypes.node.isRequired, 14 | setActiveStyle: PropTypes.func.isRequired, 15 | setInactiveStyle: PropTypes.func.isRequired, 16 | classNameWrapper: PropTypes.string.isRequired, 17 | field: ImmutablePropTypes.mapContains({ 18 | default: PropTypes.string, 19 | }).isRequired, 20 | }, 21 | 22 | getInitialState() { 23 | return { 24 | choose: false, 25 | }; 26 | }, 27 | 28 | getDdefaultProps() { 29 | return { value: '' }; 30 | }, 31 | 32 | render() { 33 | const { 34 | forID, 35 | field, 36 | value, 37 | setActiveStyle, 38 | setInactiveStyle, 39 | classNameWrapper, 40 | onChange, 41 | } = this.props; 42 | const currentValue = value || field.get('default'); 43 | 44 | const pageSize = 10; 45 | const currenIndex = icons.indexOf(currentValue); 46 | 47 | const { choose } = this.state; 48 | 49 | return ( 50 |
57 | {choose ? ( 58 | ( 66 | e.keyCode === 13 && onChange(e.target.textContent)} 70 | tabIndex={0} 71 | key={key} 72 | onClick={e => onChange(e.target.textContent)} 73 | /> 74 | )} 75 | /> 76 | ) : ( 77 | this.setState({ choose: true })} 80 | onKeyDown={e => e.keyCode === 13 && this.setState({ choose: true })} 81 | /> 82 | )} 83 |
84 | ); 85 | }, 86 | }); 87 | -------------------------------------------------------------------------------- /widgets/material-icons/src/MaterialIcon.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import PropTypes from 'prop-types'; 3 | 4 | const MaterialIcon = (props) => { 5 | const { 6 | icon, color, onClick, onKeyDown, 7 | } = props; 8 | return icon ? ( 9 | 24 | {icon} 25 | 26 | ) : ''; 27 | }; 28 | 29 | MaterialIcon.propTypes = { 30 | icon: PropTypes.string.isRequired, 31 | color: PropTypes.string.isRequired, 32 | onClick: PropTypes.func.isRequired, 33 | onKeyDown: PropTypes.func.isRequired, 34 | }; 35 | 36 | export default MaterialIcon; 37 | -------------------------------------------------------------------------------- /widgets/material-icons/src/Preview.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import PropTypes from 'prop-types'; 3 | 4 | const Preview = ({ value }) => (value ? ( 5 | 6 | {value} 7 | 8 | ) : ''); 9 | 10 | Preview.propTypes = { 11 | value: PropTypes.node.isRequired, 12 | }; 13 | 14 | export default Preview; 15 | -------------------------------------------------------------------------------- /widgets/material-icons/src/index.js: -------------------------------------------------------------------------------- 1 | import Control from './Control'; 2 | import Preview from './Preview'; 3 | 4 | export default { 5 | Control, 6 | Preview, 7 | }; 8 | -------------------------------------------------------------------------------- /widgets/native-color/CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Change Log 2 | 3 | All notable changes to this project will be documented in this file. 4 | See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. 5 | 6 | 7 | # [3.0.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-native-color@2.2.1...netlify-cms-widget-native-color@3.0.0) (2018-08-10) 8 | 9 | 10 | ### Chores 11 | 12 | * **dependencies:** upgrade netlify-cms v2 ([#54](https://github.com/ekoeryanto/netlify-cms-widgets/issues/54)) ([6feed32](https://github.com/ekoeryanto/netlify-cms-widgets/commit/6feed32)) 13 | 14 | 15 | ### BREAKING CHANGES 16 | 17 | * **dependencies:** for browser usage as of netlify-cms ^2, we don't need to use `netlify-cms/dist/cms.css` 18 | 19 | 20 | 21 | 22 | 23 | ## [2.2.1](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-native-color@2.2.0...netlify-cms-widget-native-color@2.2.1) (2018-06-12) 24 | 25 | 26 | 27 | 28 | **Note:** Version bump only for package netlify-cms-widget-native-color 29 | 30 | 31 | # [2.2.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-native-color@2.1.1...netlify-cms-widget-native-color@2.2.0) (2018-05-24) 32 | 33 | 34 | ### Features 35 | 36 | * use babel stable v6 ([ee2bcfd](https://github.com/ekoeryanto/netlify-cms-widgets/commit/ee2bcfd)) 37 | 38 | 39 | 40 | 41 | 42 | # [2.2.0-alpha.c8c7f2ad](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-native-color@2.1.1...netlify-cms-widget-native-color@2.2.0-alpha.c8c7f2ad) (2018-05-24) 43 | 44 | 45 | ### Features 46 | 47 | * use babel stable v6 ([ee2bcfd](https://github.com/ekoeryanto/netlify-cms-widgets/commit/ee2bcfd)) 48 | 49 | 50 | 51 | 52 | 53 | ## [2.1.1](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-native-color@2.1.0...netlify-cms-widget-native-color@2.1.1) (2018-05-12) 54 | 55 | 56 | ### Bug Fixes 57 | 58 | * iife globals wrapped on window to avoid unwanted character ([3eae5be](https://github.com/ekoeryanto/netlify-cms-widgets/commit/3eae5be)), closes [#4](https://github.com/ekoeryanto/netlify-cms-widgets/issues/4) 59 | 60 | 61 | 62 | 63 | 64 | # [2.1.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-native-color@2.0.1...netlify-cms-widget-native-color@2.1.0) (2018-05-12) 65 | 66 | 67 | ### Features 68 | 69 | * patch to work with official netlify-cms ([c47c7ae](https://github.com/ekoeryanto/netlify-cms-widgets/commit/c47c7ae)) 70 | 71 | 72 | 73 | 74 | 75 | ## [2.0.1](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-native-color@2.0.0...netlify-cms-widget-native-color@2.0.1) (2018-05-08) 76 | 77 | 78 | 79 | 80 | **Note:** Version bump only for package netlify-cms-widget-native-color 81 | 82 | 83 | # [2.0.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-native-color@1.0.0...netlify-cms-widget-native-color@2.0.0) (2018-05-07) 84 | 85 | 86 | ### Chores 87 | 88 | * migrate to rollup ([68a11eb](https://github.com/ekoeryanto/netlify-cms-widgets/commit/68a11eb)) 89 | 90 | 91 | ### BREAKING CHANGES 92 | 93 | * - all the depedencies are excluded when possible and it on peerDependencies 94 | - compiled file now renamed to follow the widget now not `main.js` 95 | 96 | 97 | 98 | 99 | 100 | # [1.0.0](https://github.com/ekoeryanto/netlify-cms-widgets/compare/netlify-cms-widget-native-color@0.1.2...netlify-cms-widget-native-color@1.0.0) (2018-05-03) 101 | 102 | 103 | ### Chores 104 | 105 | * **refactor:** rename library instance ([516a5d0](https://github.com/ekoeryanto/netlify-cms-widgets/commit/516a5d0)) 106 | 107 | 108 | ### BREAKING CHANGES 109 | 110 | * **refactor:** `NetlifyCMSNameWidget` now `NetlifyCMSWidgetName` 111 | -------------------------------------------------------------------------------- /widgets/native-color/README.md: -------------------------------------------------------------------------------- 1 | # netlify-cms-widget-native-color 2 | 3 | Native Color widget for Netlify CMS. 4 | 5 | ## Install and Usage 6 | 7 | ### As an npm package: 8 | 9 | ```shell 10 | npm install netlify-cms-widget-native-color 11 | ``` 12 | 13 | ```js 14 | import CMS from 'netlify-cms' 15 | import * as NativeColorWidget from 'netlify-cms-widget-native-color' 16 | CMS.registerWidget('native-color', NativeColorWidget.Control) 17 | ``` 18 | 19 | Add to your config.yml: 20 | 21 | ```yaml 22 | fields: 23 | - name: 24 | label: 25 | widget: native-color 26 | ``` 27 | 28 | ## Example 29 | 30 | see `public` directory 31 | -------------------------------------------------------------------------------- /widgets/native-color/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "netlify-cms-widget-native-color", 3 | "version": "3.0.0", 4 | "description": "Native Color widget for Netlify CMS.", 5 | "main": "dist/cjs/native-color.min.js", 6 | "browser": "dist/umd/native-color.min.js", 7 | "module": "dist/es/native-color.min.js", 8 | "files": [ 9 | "dist/**", 10 | "src/**" 11 | ], 12 | "scripts": { 13 | "start": "rollup -c -w", 14 | "build": "npm-run-all --parallel build:*", 15 | "build:development": "rollup -c", 16 | "build:production": "rollup -c --environment NODE_ENV:production", 17 | "prebuild": "rimraf dist", 18 | "prepublishOnly": "npm run build" 19 | }, 20 | "keywords": [ 21 | "netlify", 22 | "netlify-cms", 23 | "cms", 24 | "widget", 25 | "native-color" 26 | ], 27 | "author": "Eko Eryanto ", 28 | "bugs": { 29 | "url": "https://github.com/ekoeryanto/netlify-cms-widgets/issues" 30 | }, 31 | "homepage": "https://github.com/ekoeryanto/netlify-cms-widgets/tree/master/widgets/native-color#readme", 32 | "repository": { 33 | "type": "git", 34 | "url": "https://github.com/ekoeryanto/netlify-cms-widgets.git" 35 | }, 36 | "license": "MIT", 37 | "devDependencies": { 38 | "@babel/core": "^7.0.0", 39 | "@babel/plugin-proposal-class-properties": "^7.0.0", 40 | "@babel/plugin-proposal-json-strings": "^7.0.0", 41 | "@babel/plugin-syntax-dynamic-import": "^7.0.0", 42 | "@babel/plugin-syntax-import-meta": "^7.0.0", 43 | "@babel/preset-env": "^7.0.0", 44 | "@babel/preset-react": "^7.0.0", 45 | "babel-plugin-transform-react-remove-prop-types": "^0.4.13", 46 | "create-react-class": "^15.6.3", 47 | "lodash": "^4.17.10", 48 | "module-igniter": "^1.1.0", 49 | "netlify-cms": "^2.0.0", 50 | "npm-run-all": "^4.1.2", 51 | "prop-types": "^15.6.1", 52 | "react-immutable-proptypes": "^2.1.0", 53 | "rimraf": "^2.6.2", 54 | "rollup": "^0.66.4", 55 | "rollup-plugin-babel": "^4.0.2", 56 | "rollup-plugin-commonjs": "^9.1.3", 57 | "rollup-plugin-livereload": "^0.6.0", 58 | "rollup-plugin-node-resolve": "^3.3.0", 59 | "rollup-plugin-postcss": "^1.6.1", 60 | "rollup-plugin-replace": "^2.0.0", 61 | "rollup-plugin-serve": "^0.6.0", 62 | "rollup-plugin-strip": "^1.1.1", 63 | "rollup-plugin-terser": "^3.0.0" 64 | }, 65 | "peerDependencies": { 66 | "create-react-class": "^15.6.3", 67 | "netlify-cms": "^2.0.0 | ^1.0.0", 68 | "prop-types": "^15.6.1", 69 | "react": "^16.4.0", 70 | "react-immutable-proptypes": "^2.1.0" 71 | } 72 | } 73 | -------------------------------------------------------------------------------- /widgets/native-color/public/config.yml: -------------------------------------------------------------------------------- 1 | backend: 2 | name: test-repo 3 | login: false 4 | media_folder: assets 5 | collections: 6 | - name: example 7 | label: Example 8 | editor: 9 | preview: false 10 | files: 11 | - file: _data/native-color.yml 12 | name: native-color-widget 13 | label: Native Color Widget 14 | fields: 15 | - name: native-color 16 | label: Native Color 17 | widget: native-color 18 | -------------------------------------------------------------------------------- /widgets/native-color/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Native Color Example | Netlify CMS Widgets 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 17 | 18 | 19 | 20 | -------------------------------------------------------------------------------- /widgets/native-color/rollup.config.js: -------------------------------------------------------------------------------- 1 | import igniter from 'module-igniter'; 2 | import { mapValues } from 'lodash'; 3 | 4 | const plug = igniter({ prefix: 'rollup-plugin-' }); 5 | const environment = process.env.NODE_ENV || 'development'; 6 | const prod = environment === 'production'; 7 | const watch = process.env.ROLLUP_WATCH; 8 | 9 | const globals = { 10 | 'netlify-cms': 'CMS', 11 | react: 'React', 12 | 'react-dom': 'ReactDOM', 13 | 'prop-types': 'PropTypes', 14 | immutable: 'Immutable', 15 | 'react-immutable-proptypes': 'ImmutablePropTypes', 16 | classnames: 'classNames', 17 | 'create-react-class': 'createClass', 18 | }; 19 | 20 | const external = Object.keys(globals); 21 | const WATCH_FORMAT = process.env.WATCH_FORMAT || 'umd'; 22 | const formats = ['umd', 'iife', 'cjs', 'es']; 23 | const extension = prod ? 'min.js' : 'js'; 24 | const isBrowser = format => format === 'umd' || format === 'iife'; 25 | 26 | const createOutput = (format = 'umd') => ({ 27 | sourcemap: prod, 28 | name: 'NetlifyCMSWidgetNativeColor', 29 | file: `dist/${format}/native-color.${extension}`, 30 | format, 31 | globals: format === 'iife' ? mapValues(globals, o => `window['${o}']`) : globals, 32 | }); 33 | 34 | export default (watch ? [WATCH_FORMAT] : formats).map(format => ({ 35 | input: 'src/index.js', 36 | output: createOutput(format), 37 | external, 38 | plugins: [ 39 | ...plug({ 40 | replace: { 'process.env.NODE_ENV': JSON.stringify(environment) }, 41 | 'node-resolve': true, 42 | commonjs: { 43 | include: ['**/node_modules/**'], 44 | }, 45 | babel: { 46 | babelrc: false, 47 | exclude: ['**/node_modules/**'], 48 | presets: [ 49 | ['@babel/preset-env', { modules: false }], 50 | ['@babel/preset-react', isBrowser(format) ? { pragma: 'h' } : {}], 51 | ], 52 | plugins: [ 53 | isBrowser(format) && [ 54 | 'transform-react-remove-prop-types', 55 | { 56 | removeImport: true, 57 | additionalLibraries: ['react-immutable-proptypes'], 58 | }, 59 | ], 60 | ].filter(Boolean), 61 | }, 62 | postcss: { 63 | sourcemap: prod, 64 | minimize: prod, 65 | }, 66 | }), 67 | ...plug({ strip: { debugger: true } }, 'terser::terser', prod), 68 | ...plug( 69 | { 70 | serve: { 71 | contentBase: [ 72 | '../../node_modules', 73 | '../../widgets', 74 | '../../core', 75 | `dist/${WATCH_FORMAT}`, 76 | 'public', 77 | ], 78 | historyApiFallback: true, 79 | }, 80 | livereload: true, 81 | }, 82 | watch, 83 | ), 84 | ], 85 | })); 86 | -------------------------------------------------------------------------------- /widgets/native-color/src/Control.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import createReactClass from 'create-react-class'; 3 | import PropTypes from 'prop-types'; 4 | import ImmutablePropTypes from 'react-immutable-proptypes'; 5 | 6 | export default createReactClass({ 7 | propTypes: { 8 | onChange: PropTypes.func.isRequired, 9 | forID: PropTypes.string.isRequired, 10 | value: PropTypes.node, 11 | setActiveStyle: PropTypes.func.isRequired, 12 | setInactiveStyle: PropTypes.func.isRequired, 13 | classNameWrapper: PropTypes.string.isRequired, 14 | field: ImmutablePropTypes.mapContains({ 15 | default: PropTypes.string, 16 | }).isRequired, 17 | }, 18 | 19 | getDefaultProps() { 20 | return { value: '' }; 21 | }, 22 | 23 | render() { 24 | const { 25 | forID, 26 | field, 27 | value, 28 | setActiveStyle, 29 | setInactiveStyle, 30 | onChange, 31 | classNameWrapper, 32 | } = this.props; 33 | const currentValue = value || field.get('default'); 34 | return ( 35 | 49 | ); 50 | }, 51 | }); 52 | -------------------------------------------------------------------------------- /widgets/native-color/src/index.js: -------------------------------------------------------------------------------- 1 | import Control from './Control'; 2 | 3 | export default { 4 | Control, 5 | }; 6 | --------------------------------------------------------------------------------