Function createInputCountPlugin

packages/addons/src/plugins/inputCount.ts:24–108

(
  InputCountOptions?: InputCountOptions
)

 * @public
 */
export function createInputCountPlugin(
  InputCountOptions?: InputCountOptions
): FormKitPlugin {
  return (node: FormKitNode) => {
    node.addProps(['inputCount', 'inputCountString'])

    const allowTypes = InputCountOptions?.countTypes || [
      'text',
      'password',
      'textarea',
    ]

    const useInputCount =
      undefine(node.props.inputCount) ||
      node.props.inputCount === 'true' ||
      node.props.inputCount === true ||
      InputCountOptions?.useAsDefault === true

    if (useInputCount) {
      node.on('created', () => {
        if (!node.props || !node.props.definition) return
        const inputDefinition = clone(node.props.definition)
        if (allowTypes.includes(node.props.type)) {
          const originalSchema = inputDefinition.schema
          if (typeof originalSchema !== 'function') return

          node.props.inputCountString = ''

          const higherOrderSchema = (extensions: FormKitSectionsSchema) => {
            extensions.help = {
              if: 'true',
              children: [
                {
                  $el: 'span',
                  children: `$inputCountString`,
                  attrs: {
                    class: '$classes.inputCounter',
                  },
                },
                "$help || ''",
              ],
            }

            return originalSchema(extensions)
          }

          inputDefinition.schema = higherOrderSchema
          if (inputDefinition.schemaMemoKey) {
            inputDefinition.schemaMemoKey += '-input-count'
          }
          node.props.definition = inputDefinition

          let maxLength = getMaxLength()

          node.on('input', updateCountValue)
          node.on('prop:parsedRules', () => {
            maxLength = getMaxLength()
            // re-run the count value