forked from decaporg/decap-cms
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Add a uuid widget which supports options: * read_only (bool) * prefix (string) * use_b32_encoding (bool) close: decaporg#1975
- Loading branch information
Showing
14 changed files
with
184 additions
and
2 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,7 @@ | ||
| # Change Log | ||
|
|
||
| All notable changes to this project will be documented in this file. | ||
| See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. | ||
|
|
||
|
|
||
| **Note:** Version bump only for package netlify-cms-widget-uuid |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,11 @@ | ||
| # Docs coming soon! | ||
|
|
||
| Netlify CMS was recently converted from a single npm package to a "monorepo" of over 20 packages. | ||
| That's over 20 Readme's! We haven't created one for this package yet, but we will soon. | ||
|
|
||
| In the meantime, you can: | ||
|
|
||
| 1. Check out the [main readme](https://github.com/netlify/netlify-cms/#readme) or the [documentation | ||
| site](https://www.netlifycms.org) for more info. | ||
| 2. Reach out to the [community chat](https://netlifycms.org/chat/) if you need help. | ||
| 3. Help out and [write the readme yourself](https://github.com/netlify/netlify-cms/edit/master/packages/netlify-cms-widget-string/README.md)! |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,30 @@ | ||
| { | ||
| "name": "netlify-cms-widget-uuid", | ||
| "description": "Widget for uuid values in Netlify CMS.", | ||
| "version": "0.1.0", | ||
| "homepage": "https://www.netlifycms.org/docs/widgets/#uuid", | ||
| "repository": "https://github.com/netlify/netlify-cms/tree/master/packages/netlify-cms-widget-uuid", | ||
| "bugs": "https://github.com/netlify/netlify-cms/issues", | ||
| "module": "dist/esm/index.js", | ||
| "main": "dist/netlify-cms-widget-uuid.js", | ||
| "license": "MIT", | ||
| "keywords": [ | ||
| "netlify", | ||
| "netlify-cms", | ||
| "widget", | ||
| "uuid" | ||
| ], | ||
| "sideEffects": false, | ||
| "scripts": { | ||
| "develop": "yarn build:esm --watch", | ||
| "build": "cross-env NODE_ENV=production webpack", | ||
| "build:esm": "cross-env NODE_ENV=esm babel src --out-dir dist/esm --ignore \"**/__tests__\" --root-mode upward" | ||
| }, | ||
| "peerDependencies": { | ||
| "base32-encode": "^2.0.0", | ||
| "hex-to-array-buffer": "^2.0.0", | ||
| "netlify-cms-ui-default": "^2.12.1", | ||
| "prop-types": "^15.7.2", | ||
| "react": "^16.8.4 || ^17.0.0" | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,80 @@ | ||
| import React from 'react'; | ||
| import PropTypes from 'prop-types'; | ||
| import base32Encode from 'base32-encode'; | ||
| import hexToArrayBuffer from 'hex-to-array-buffer'; | ||
|
|
||
| export default class UuidControl extends React.Component { | ||
| static propTypes = { | ||
| onChange: PropTypes.func.isRequired, | ||
| forID: PropTypes.string, | ||
| value: PropTypes.node, | ||
| classNameWrapper: PropTypes.string.isRequired, | ||
| setActiveStyle: PropTypes.func.isRequired, | ||
| setInactiveStyle: PropTypes.func.isRequired, | ||
| }; | ||
|
|
||
| // The selection to maintain for the input element | ||
| _sel = 0; | ||
|
|
||
| // The input element ref | ||
| _el = null; | ||
|
|
||
| // NOTE: This prevents the cursor from jumping to the end of the text for | ||
| // nested inputs. In other words, this is not an issue on top-level text | ||
| // fields such as the `title` of a collection post. However, it becomes an | ||
| // issue on fields nested within other components, namely widgets nested | ||
| // within a `markdown` widget. For example, the alt text on a block image | ||
| // within markdown. | ||
| // SEE: https://github.com/netlify/netlify-cms/issues/4539 | ||
| // SEE: https://github.com/netlify/netlify-cms/issues/3578 | ||
| componentDidUpdate() { | ||
| if (this._el && this._el.selectionStart !== this._sel) { | ||
| this._el.setSelectionRange(this._sel, this._sel); | ||
| } | ||
| } | ||
|
|
||
| // componentDidMount is used for generate a UUID when the page loads for the first time | ||
| componentDidMount() { | ||
| const { value, field, onChange } = this.props; | ||
| if (!value) { | ||
| const prefix = field.get('prefix', ''); | ||
| const useB32Encode = field.get('use_b32_encode', false); | ||
| const uuid = crypto.randomUUID(); | ||
| const uuidFormatted = useB32Encode ? this.uuidToB32(uuid) : uuid; | ||
| onChange(prefix + uuidFormatted); | ||
| } | ||
| } | ||
|
|
||
| uuidToB32 = uuid => { | ||
| const bytes = hexToArrayBuffer(uuid.replace(/-/g, '') || ''); | ||
| const encodedUUID = base32Encode(bytes, 'RFC4648', { padding: false }); | ||
| return encodedUUID.toLowerCase(); | ||
| }; | ||
|
|
||
| handleChange = e => { | ||
| this._sel = e.target.selectionStart; | ||
| this.props.onChange(e.target.value); | ||
| }; | ||
|
|
||
| render() { | ||
| const { field, forID, value, classNameWrapper, setActiveStyle, setInactiveStyle } = this.props; | ||
| const readOnly = field.get('read_only', true); | ||
|
|
||
| return ( | ||
| <input | ||
| ref={el => { | ||
| this._el = el; | ||
| }} | ||
| type="text" | ||
| id={forID} | ||
| readOnly={readOnly} | ||
| style={{ fontFamily: 'monospace', opacity: readOnly ? '0.5' : '1.0' }} | ||
| className={classNameWrapper} | ||
| value={value || ''} | ||
| onChange={this.handleChange} | ||
| onFocus={setActiveStyle} | ||
| onBlur={setInactiveStyle} | ||
| /> | ||
| ); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,13 @@ | ||
| import React from 'react'; | ||
| import PropTypes from 'prop-types'; | ||
| import { WidgetPreviewContainer } from 'netlify-cms-ui-default'; | ||
|
|
||
| function UuidPreview({ value }) { | ||
| return <WidgetPreviewContainer>{value}</WidgetPreviewContainer>; | ||
| } | ||
|
|
||
| UuidPreview.propTypes = { | ||
| value: PropTypes.node, | ||
| }; | ||
|
|
||
| export default UuidPreview; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,14 @@ | ||
| import controlComponent from './UuidControl'; | ||
| import previewComponent from './UuidPreview'; | ||
|
|
||
| function Widget(opts = {}) { | ||
| return { | ||
| name: 'uuid', | ||
| controlComponent, | ||
| previewComponent, | ||
| ...opts, | ||
| }; | ||
| } | ||
|
|
||
| export const NetlifyCmsWidgetUuid = { Widget, controlComponent, previewComponent }; | ||
| export default NetlifyCmsWidgetUuid; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,3 @@ | ||
| const { getConfig } = require('../../scripts/webpack.js'); | ||
|
|
||
| module.exports = getConfig(); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters