@modernpoacher/cogs 0.1.256 → 1.0.0

package/src/{components → js/components}/error-message/index.cjs

@@ -11,7 +11,10 @@ const log = debug('@modernpoacher/cogs/components/error-message')
 log('`cogs` is awake')
 
 const {
-  default: component
+  default: ErrorMessage
 } = require('./index.jsx')
 
-module.exports = component
+/**
+ *  Exports only default
+ */
+module.exports = ErrorMessage

package/src/js/components/error-message/index.d.cts

@@ -0,0 +1,2 @@
+export { default } from '#cogs/components/error-message'
+export * from '#cogs/components/error-message'

package/src/{components → js/components}/error-message/index.d.mts

@@ -1,9 +1,6 @@
 declare module '#cogs/components/error-message' {
-  import React from 'react'
-
-  export type ErrorMessageProps = CogsTypes.ErrorDefinitionType
-
-  export default class ErrorMessage extends React.Component<ErrorMessageProps> {}
+  export { default } from '#cogs/super/components/error-message'
+  export * from '#cogs/super/components/error-message'
 }
 
 declare module '@modernpoacher/cogs/components/error-message' {

package/src/js/components/error-message/index.jsx

@@ -0,0 +1,5 @@
+/**
+ *  ErrorMessage component
+ */
+
+export { default } from '#cogs/super/components/error-message'

package/src/{components → js/components}/field/index.cjs

@@ -10,7 +10,15 @@ const log = debug('@modernpoacher/cogs/components/field')
 
 log('`cogs` is awake')
 
+const {
+  ValueField,
+  CheckField,
+  toInputValue
+} = require('./index.jsx')
+
 /**
- *  Exports default, etc
+ *  Exports ValueField and CheckField
  */
-module.exports = require('./index.jsx')
+module.exports.ValueField = ValueField
+module.exports.CheckField = CheckField
+module.exports.toInputValue = toInputValue

package/src/js/components/field/index.d.cts

@@ -0,0 +1 @@
+export * from '#cogs/components/field'

package/src/js/components/field/index.d.mts

@@ -0,0 +1,24 @@
+declare module '#cogs/components/field' {
+  import type { MouseEvent } from 'react'
+
+  import Field from '#cogs/super/components/field'
+
+  export function toInputValue (value: unknown): string
+
+  export type ValueProps = CogsTypes.Components.Field.ValueProps
+  export type CheckProps = CogsTypes.Components.Field.CheckProps
+
+  export class ValueField<P extends ValueProps> extends Field<P> {
+    shouldComponentUpdate (props: ValueProps): boolean
+  }
+
+  export class CheckField<P extends CheckProps> extends Field<P> {
+    shouldComponentUpdate (props: CheckProps): boolean
+
+    handleClick (event: MouseEvent<HTMLInputElement>): void
+  }
+}
+
+declare module '@modernpoacher/cogs/components/field' {
+  export * from '#cogs/components/field'
+}

package/src/js/components/field/index.jsx

@@ -0,0 +1,98 @@
+/**
+ *  @typedef {CogsTypes.OnEventType} OnEventType
+ *  @typedef {CogsTypes.Super.Components.Field.FieldProps} FieldProps
+ *  @typedef {CogsTypes.Components.Field.ValueProps} ValueProps
+ *  @typedef {CogsTypes.Components.Field.CheckProps} CheckProps
+ */
+
+/**
+ *  Field component
+ */
+import PropTypes from 'prop-types'
+
+import Field from '#cogs/super/components/field'
+
+/**
+ *  @type {OnEventType}
+ */
+function DEFAULT_HANDLE_EVENT () {
+  //
+}
+
+/**
+ *  @param {unknown} value
+ *  @returns {string}
+ */
+export function toInputValue (value) {
+  return (value === undefined) ? '' : String(value)
+}
+
+/**
+ *  ValueField component
+ *
+ *  @extends {Field<FieldProps & ValueProps>}
+ */
+export class ValueField extends Field {}
+
+ValueField.propTypes = {
+  ...Field.propTypes,
+  defaultValue: PropTypes.string
+}
+
+/**
+ *  CheckField component
+ *
+ *  @extends {Field<FieldProps & CheckProps>}
+ */
+export class CheckField extends Field {
+  /**
+   *  @param {CheckProps} props
+   *  @returns {boolean}
+   */
+  shouldComponentUpdate (props) {
+    const {
+      checked,
+      defaultChecked,
+      onClick,
+      ...superProps
+    } = props
+
+    return (
+      (checked !== this.props.checked) ||
+      (defaultChecked !== this.props.defaultChecked) ||
+      super.shouldComponentUpdate(superProps) ||
+      (onClick !== this.props.onClick)
+    )
+  }
+
+  /**
+   *  @param {{ target: { value?: string, checked?: boolean } }} event
+   *  @returns {void}
+   */
+  handleChange = ({ target: { value, checked } }) => {
+    const {
+      onChange = DEFAULT_HANDLE_EVENT
+    } = this.props
+
+    onChange(value, checked)
+  }
+
+  /**
+   *  @param {{ target: { value?: string, checked?: boolean } }} event
+   *  @returns {void}
+   */
+  handleClick = ({ target: { value, checked } }) => {
+    const {
+      onClick = DEFAULT_HANDLE_EVENT
+    } = this.props
+
+    onClick(value, checked)
+  }
+}
+
+CheckField.propTypes = {
+  ...Field.propTypes,
+  checked: PropTypes.bool,
+  defaultChecked: PropTypes.bool,
+  onClick: PropTypes.func
+}

package/src/js/components/index.cjs

@@ -0,0 +1,38 @@
+require('@babel/register')({
+  ignore: [
+    /node_modules\/(?!shinkansen|@modernpoacher)/
+  ]
+})
+
+const debug = require('debug')
+
+const log = debug('@modernpoacher/cogs/components')
+
+log('`cogs` is awake')
+
+const {
+  default: Description
+} = require('./description/index.jsx')
+
+const {
+  default: ErrorMessage
+} = require('./error-message/index.jsx')
+
+const {
+  ValueField,
+  CheckField,
+  toInputValue
+} = require('./field/index.jsx')
+
+const {
+  default: Title
+} = require('./title/index.jsx')
+
+module.exports.Description = Description
+module.exports.ErrorMessage = ErrorMessage
+module.exports.Field = {
+  ValueField,
+  CheckField,
+  toInputValue
+}
+module.exports.Title = Title

package/src/js/components/index.d.cts

@@ -0,0 +1,4 @@
+export { default as Description } from '#cogs/components/description'
+export { default as ErrorMessage } from '#cogs/components/error-message'
+export { default as Field } from '#cogs/components/field'
+export { default as Title } from '#cogs/components/title'

package/src/js/components/index.d.mts

@@ -0,0 +1,4 @@
+export { default as Description } from '#cogs/components/description'
+export { default as ErrorMessage } from '#cogs/components/error-message'
+export { default as Field } from '#cogs/components/field'
+export { default as Title } from '#cogs/components/title'

package/src/js/components/index.mjs

@@ -0,0 +1,10 @@
+import debug from 'debug'
+
+const log = debug('@modernpoacher/cogs/components')
+
+log('`cogs` is awake')
+
+export { default as Description } from './description/index.cjs'
+export { default as ErrorMessage } from './error-message/index.cjs'
+export { default as Field } from './field/index.cjs'
+export { default as Title } from './title/index.cjs'

package/src/{components → js/components}/title/index.cjs

@@ -11,10 +11,10 @@ const log = debug('@modernpoacher/cogs/components/title')
 log('`cogs` is awake')
 
 const {
-  default: component
+  default: Title
 } = require('./index.jsx')
 
 /**
  *  Exports only default
  */
-module.exports = component
+module.exports = Title

package/src/js/components/title/index.d.cts

@@ -0,0 +1,2 @@
+export { default } from '#cogs/components/title'
+export * from '#cogs/components/title'

package/src/js/components/title/index.d.mts

@@ -0,0 +1,9 @@
+declare module '#cogs/components/title' {
+  export { default } from '#cogs/super/components/title'
+  export * from '#cogs/super/components/title'
+}
+
+declare module '@modernpoacher/cogs/components/title' {
+  export { default } from '#cogs/components/title'
+  export * from '#cogs/components/title'
+}

package/src/js/components/title/index.jsx

@@ -0,0 +1,5 @@
+/**
+ * Title component
+ */
+
+export { default } from '#cogs/super/components/title'

package/src/js/index.d.cts

@@ -0,0 +1,72 @@
+import type CheckboxCog from '#cogs/cogs/checkbox'
+
+import type {
+  CheckboxProps
+} from '#cogs/cogs/checkbox'
+
+import type EmailCog from '#cogs/cogs/email'
+
+import type {
+  EmailProps
+} from '#cogs/cogs/email'
+
+import type NumberCog from '#cogs/cogs/number'
+
+import type {
+  NumberProps
+} from '#cogs/cogs/number'
+
+import type PasswordCog from '#cogs/cogs/password'
+
+import type {
+  PasswordProps
+} from '#cogs/cogs/password'
+
+import type RadioCog from '#cogs/cogs/radio'
+
+import type {
+  RadioProps
+} from '#cogs/cogs/radio'
+
+import type SelectCog from '#cogs/cogs/select'
+
+import type {
+  SelectProps
+} from '#cogs/cogs/select'
+
+import type TextCog from '#cogs/cogs/text'
+
+import type {
+  TextProps
+} from '#cogs/cogs/text'
+
+import type TextareaCog from '#cogs/cogs/textarea'
+
+import type {
+  TextareaProps
+} from '#cogs/cogs/textarea'
+
+export type ErrorDefinitionType = CogsTypes.ErrorDefinitionType
+export type FieldErrorType = CogsTypes.FieldErrorType
+
+export { default as CheckboxCog } from '#cogs/cogs/checkbox'
+export { default as EmailCog } from '#cogs/cogs/email'
+export { default as NumberCog } from '#cogs/cogs/number'
+export { default as PasswordCog } from '#cogs/cogs/password'
+export { default as RadioCog } from '#cogs/cogs/radio'
+export { default as SelectCog } from '#cogs/cogs/select'
+export { default as TextCog } from '#cogs/cogs/text'
+export { default as TextareaCog } from '#cogs/cogs/textarea'
+
+declare const cogs: {
+  CheckboxCog: CheckboxCog<CheckboxProps>
+  EmailCog: EmailCog<EmailProps>
+  NumberCog: NumberCog<NumberProps>
+  PasswordCog: PasswordCog<PasswordProps>
+  RadioCog: RadioCog<RadioProps>
+  SelectCog: SelectCog<SelectProps>
+  TextCog: TextCog<TextProps>
+  TextareaCog: TextareaCog<TextareaProps>
+}
+
+export default cogs

package/src/js/index.d.mts

@@ -0,0 +1,72 @@
+import type CheckboxCog from '#cogs/cogs/checkbox'
+
+import type {
+  CheckboxProps
+} from '#cogs/cogs/checkbox'
+
+import type EmailCog from '#cogs/cogs/email'
+
+import type {
+  EmailProps
+} from '#cogs/cogs/email'
+
+import type NumberCog from '#cogs/cogs/number'
+
+import type {
+  NumberProps
+} from '#cogs/cogs/number'
+
+import type PasswordCog from '#cogs/cogs/password'
+
+import type {
+  PasswordProps
+} from '#cogs/cogs/password'
+
+import type RadioCog from '#cogs/cogs/radio'
+
+import type {
+  RadioProps
+} from '#cogs/cogs/radio'
+
+import type SelectCog from '#cogs/cogs/select'
+
+import type {
+  SelectProps
+} from '#cogs/cogs/select'
+
+import type TextCog from '#cogs/cogs/text'
+
+import type {
+  TextProps
+} from '#cogs/cogs/text'
+
+import type TextareaCog from '#cogs/cogs/textarea'
+
+import type {
+  TextareaProps
+} from '#cogs/cogs/textarea'
+
+export type ErrorDefinitionType = CogsTypes.ErrorDefinitionType
+export type FieldErrorType = CogsTypes.FieldErrorType
+
+export { default as CheckboxCog } from '#cogs/cogs/checkbox'
+export { default as EmailCog } from '#cogs/cogs/email'
+export { default as NumberCog } from '#cogs/cogs/number'
+export { default as PasswordCog } from '#cogs/cogs/password'
+export { default as RadioCog } from '#cogs/cogs/radio'
+export { default as SelectCog } from '#cogs/cogs/select'
+export { default as TextCog } from '#cogs/cogs/text'
+export { default as TextareaCog } from '#cogs/cogs/textarea'
+
+declare const cogs: {
+  CheckboxCog: CheckboxCog<CheckboxProps>
+  EmailCog: EmailCog<EmailProps>
+  NumberCog: NumberCog<NumberProps>
+  PasswordCog: PasswordCog<PasswordProps>
+  RadioCog: RadioCog<RadioProps>
+  SelectCog: SelectCog<SelectProps>
+  TextCog: TextCog<TextProps>
+  TextareaCog: TextareaCog<TextareaProps>
+}
+
+export default cogs

package/src/js/super/cogs/index.cjs

@@ -0,0 +1,20 @@
+require('@babel/register')({
+  ignore: [
+    /node_modules\/(?!shinkansen|@modernpoacher)/
+  ]
+})
+
+const debug = require('debug')
+
+const log = debug('@modernpoacher/cogs/super/cogs')
+
+log('`cogs` is awake')
+
+const {
+  default: Cog
+} = require('./index.jsx')
+
+/**
+ *  Exports only default
+ */
+module.exports = Cog

package/src/js/super/cogs/index.d.cts

@@ -0,0 +1,2 @@
+export { default } from '#cogs/super/cogs'
+export * from '#cogs/super/cogs'

package/src/js/super/cogs/index.d.mts

@@ -0,0 +1,28 @@
+declare module '#cogs/super/cogs' {
+  import React from 'react'
+
+  export type CogProps = CogsTypes.Super.Cogs.CogProps
+
+  export default class Cog<P extends CogProps> extends React.Component<P> {
+    static propTypes: Record<PropertyKey, unknown>
+
+    getClassName (): string
+
+    getId (): string
+
+    shouldComponentUpdate (props: CogProps): boolean
+
+    renderTitle (): React.JSX.Element | null
+
+    renderDescription (): React.JSX.Element | null
+
+    renderErrorMessage (): React.JSX.Element | null
+
+    renderField (): React.JSX.Element | null
+  }
+}
+
+declare module '@modernpoacher/cogs/super/cogs' {
+  export { default } from '#cogs/super/cogs'
+  export * from '#cogs/super/cogs'
+}

package/src/{cogs → js/super/cogs}/index.jsx

@@ -1,24 +1,26 @@
 /**
- * Cog component
- *
- * @typedef {import('@modernpoacher/cogs/cogs').CogProps} CogProps
+ *  @typedef {CogsTypes.OnEventType} OnEventType
+ *  @typedef {CogsTypes.Super.Cogs.CogProps} CogProps
+ */
+
+/**
+ *  Cog component
  */
 import React, { Component } from 'react'
 import PropTypes from 'prop-types'
 import classnames from 'classnames'
 
-import {
-  DEFAULT_HANDLE_CHANGE,
-  DEFAULT_HANDLE_CLICK
-} from '#cogs/common'
+import Title from '#cogs/super/components/title'
+import Description from '#cogs/super/components/description'
+import ErrorMessage from '#cogs/super/components/error-message'
+import Field from '#cogs/super/components/field'
 
-import Title from '#cogs/components/title'
-import Description from '#cogs/components/description'
-import ErrorMessage from '#cogs/components/error-message'
-import Field, {
-  ValueField,
-  CheckField
-} from '#cogs/components/field'
+/**
+ *  @type {OnEventType}
+ */
+function DEFAULT_HANDLE_EVENT () {
+  //
+}
 
 export default class Cog extends Component {
   getClassName () {
@@ -42,14 +44,15 @@ export default class Cog extends Component {
   }
 
   /**
-   * @param {CogProps} props
-   * @returns {boolean}
+   *  @param {CogProps} props
+   *  @returns {boolean}
    */
-  shouldComponentUpdate (props, state) {
+  shouldComponentUpdate (props) {
     return (
       (props.name !== this.props.name) ||
       (props.id !== this.props.id) ||
       (props.title !== this.props.title) ||
+      (props.value !== this.props.value) ||
       (props.description !== this.props.description) ||
       (props.errorMessage !== this.props.errorMessage) ||
       (props.required !== this.props.required) ||
@@ -112,20 +115,22 @@ export default class Cog extends Component {
 
     const {
       name,
+      value,
       required = false,
       disabled = false,
       readOnly = false,
       tabIndex,
       accessKey,
       placeholder,
-      onChange = DEFAULT_HANDLE_CHANGE,
+      onChange = DEFAULT_HANDLE_EVENT,
       fieldRef
     } = this.props
 
     return (
       <Field
-        id={id}
         name={name}
+        id={id}
+        value={value}
         required={required}
         disabled={disabled}
         readOnly={readOnly}
@@ -153,113 +158,26 @@ export default class Cog extends Component {
 }
 
 Cog.propTypes = {
-  id: PropTypes.string,
   name: PropTypes.string.isRequired,
+  id: PropTypes.string,
   title: PropTypes.string,
+  value: PropTypes.string,
   description: PropTypes.string,
-  errorMessage: PropTypes.string,
+  errorMessage: PropTypes.shape({
+    type: PropTypes.string.isRequired,
+    params: PropTypes.shape({}).isRequired,
+    uri: PropTypes.string.isRequired
+  }),
   required: PropTypes.bool,
   disabled: PropTypes.bool,
   readOnly: PropTypes.bool,
+  tabIndex: PropTypes.number,
+  accessKey: PropTypes.string,
   placeholder: PropTypes.string,
   onChange: PropTypes.func,
   fieldRef: PropTypes.shape({
-    current: PropTypes.shape().isRequired
+    current: PropTypes.shape({
+      value: PropTypes.string
+    })
   })
 }
-
-export class ValueCog extends Cog {
-  shouldComponentUpdate (props, state) {
-    return (
-      super.shouldComponentUpdate(props) ||
-      (props.value !== this.props.value)
-    )
-  }
-
-  renderField () {
-    const id = this.getId()
-
-    const {
-      name,
-      required = false,
-      disabled = false,
-      readOnly = false,
-      tabIndex,
-      accessKey,
-      placeholder,
-      onChange = DEFAULT_HANDLE_CHANGE,
-      fieldRef
-    } = this.props
-
-    return (
-      <ValueField
-        id={id}
-        name={name}
-        required={required}
-        disabled={disabled}
-        readOnly={readOnly}
-        tabIndex={tabIndex}
-        accessKey={accessKey}
-        placeholder={placeholder}
-        onChange={onChange}
-        fieldRef={fieldRef}
-      />
-    )
-  }
-}
-
-ValueCog.propTypes = {
-  ...Cog.propTypes,
-  value: PropTypes.string,
-  defaultValue: PropTypes.string
-}
-
-export class CheckCog extends Cog {
-  shouldComponentUpdate (props, state) {
-    return (
-      super.shouldComponentUpdate(props) ||
-      (props.checked !== this.props.checked) ||
-      (props.onClick !== this.props.onClick)
-    )
-  }
-
-  renderField () {
-    const id = this.getId()
-
-    const {
-      name,
-      required = false,
-      disabled = false,
-      readOnly = false,
-      tabIndex,
-      accessKey,
-      placeholder,
-      onChange = DEFAULT_HANDLE_CHANGE,
-      onClick = DEFAULT_HANDLE_CLICK,
-      fieldRef
-    } = this.props
-
-    return (
-      <CheckField
-        id={id}
-        name={name}
-        required={required}
-        disabled={disabled}
-        readOnly={readOnly}
-        tabIndex={tabIndex}
-        accessKey={accessKey}
-        placeholder={placeholder}
-        onChange={onChange}
-        onClick={onClick}
-        fieldRef={fieldRef}
-      />
-    )
-  }
-}
-
-CheckCog.propTypes = {
-  ...Cog.propTypes,
-  checked: PropTypes.bool,
-  defaultChecked: PropTypes.bool,
-  onClick: PropTypes.func
-}