@capyx/components-library 0.0.8 → 0.0.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/dist/components/RichTextInput.d.ts +5 -0
  2. package/dist/components/RichTextInput.d.ts.map +1 -1
  3. package/dist/components/RichTextInput.js +3 -2
  4. package/dist/components/TagsInput.d.ts.map +1 -1
  5. package/dist/components/TagsInput.js +6 -6
  6. package/package.json +4 -4
package/dist/components/RichTextInput.d.ts CHANGED
@@ -1,5 +1,7 @@
1
1
  import { type FC } from 'react';
2
2
  import 'react-quill-new/dist/quill.snow.css';
3
+ declare const formats: readonly ["header", "bold", "color", "italic", "link", "strike", "script", "underline", "list", "code", "blockquote", "code-block"];
4
+ type FormatType = typeof formats[number];
3
5
  /**
4
6
  * Props for the RichTextInput component
5
7
  */
@@ -14,6 +16,8 @@ export type RichTextInputProps = {
14
16
  onChange?: (value: string) => void;
15
17
  /** Whether the input should be styled as invalid */
16
18
  isInvalid?: boolean;
19
+ /** Supported formats for the editor */
20
+ formats?: FormatType[];
17
21
  };
18
22
  /**
19
23
  * RichTextInput - A rich text editor component using ReactQuill
@@ -31,4 +35,5 @@ export type RichTextInputProps = {
31
35
  * ```
32
36
  */
33
37
  export declare const RichTextInput: FC<RichTextInputProps>;
38
+ export {};
34
39
  //# sourceMappingURL=RichTextInput.d.ts.map
package/dist/components/RichTextInput.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"RichTextInput.d.ts","sourceRoot":"","sources":["../../lib/components/RichTextInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,EAAwC,MAAM,OAAO,CAAC;AAGtE,OAAO,qCAAqC,CAAC;AAE7C;;GAEG;AACH,MAAM,MAAM,kBAAkB,GAAG;IAChC,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,yDAAyD;IACzD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gDAAgD;IAChD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,wDAAwD;IACxD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,oDAAoD;IACpD,SAAS,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CA2EhD,CAAC"}
1
+ {"version":3,"file":"RichTextInput.d.ts","sourceRoot":"","sources":["../../lib/components/RichTextInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,EAAwC,MAAM,OAAO,CAAC;AAGtE,OAAO,qCAAqC,CAAC;AAE7C,QAAA,MAAM,OAAO,qIAAsI,CAAC;AACpJ,KAAK,UAAU,GAAG,OAAO,OAAO,CAAC,MAAM,CAAC,CAAC;AAEzC;;GAEG;AACH,MAAM,MAAM,kBAAkB,GAAG;IAChC,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,yDAAyD;IACzD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gDAAgD;IAChD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,wDAAwD;IACxD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,oDAAoD;IACpD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,uCAAuC;IACvC,OAAO,CAAC,EAAE,UAAU,EAAE,CAAC;CACvB,CAAC;AAEF;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CA4EhD,CAAC"}
package/dist/components/RichTextInput.js CHANGED
@@ -3,6 +3,7 @@ import { useRef, useState } from 'react';
3
3
  import { Form } from 'react-bootstrap';
4
4
  import ReactQuill from 'react-quill-new';
5
5
  import 'react-quill-new/dist/quill.snow.css';
6
+ const formats = ['header', 'bold', 'color', 'italic', 'link', 'strike', 'script', 'underline', 'list', 'code', 'blockquote', 'code-block'];
6
7
  /**
7
8
  * RichTextInput - A rich text editor component using ReactQuill
8
9
  *
@@ -18,7 +19,7 @@ import 'react-quill-new/dist/quill.snow.css';
18
19
  * />
19
20
  * ```
20
21
  */
21
- export const RichTextInput = ({ readonly = false, maxLength, value = '', onChange, isInvalid = false, }) => {
22
+ export const RichTextInput = ({ readonly = false, maxLength, value = '', onChange, isInvalid = false, formats = ['header', 'bold', 'italic', 'underline', 'list'] }) => {
22
23
  const reactQuillRef = useRef(null);
23
24
  const [count, setCount] = useState(value.length);
24
25
  const checkCharacterCount = (event) => {
@@ -52,6 +53,6 @@ export const RichTextInput = ({ readonly = false, maxLength, value = '', onChang
52
53
  [{ list: 'ordered' }, { list: 'bullet' }],
53
54
  ],
54
55
  };
55
- const formats = ['header', 'bold', 'color', 'italic', 'link', 'strike', 'script', 'underline', 'list', 'code', 'blockquote', 'code-block'];
56
+ // const formats = ['header', 'bold', 'color', 'italic', 'link', 'strike', 'script', 'underline', 'list', 'code', 'blockquote', 'code-block'];
56
57
  return (_jsxs(_Fragment, { children: [_jsx(ReactQuill, { ref: reactQuillRef, theme: "snow", onKeyDown: checkCharacterCount, onKeyUp: setContentLength, formats: formats, modules: modules, value: value, onChange: onChange, readOnly: readonly, className: isInvalid ? 'is-invalid' : '' }), maxLength && (_jsxs(Form.Text, { className: count > maxLength ? 'text-danger' : 'text-muted', children: [count, "/", maxLength, " characters"] }))] }));
57
58
  };
package/dist/components/TagsInput.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"TagsInput.d.ts","sourceRoot":"","sources":["../../lib/components/TagsInput.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,EAAqB,MAAM,OAAO,CAAC;AAGnD;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG;IAC5B,6EAA6E;IAC7E,IAAI,EAAE,MAAM,CAAC;IACb,kCAAkC;IAClC,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,gDAAgD;IAChD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACrC,+EAA+E;IAC/E,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,oCAAoC;IACpC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2CAA2C;IAC3C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,0EAA0E;IAC1E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,sCAAsC;IACtC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,qCAAqC;IACrC,GAAG,CAAC,EAAE,MAAM,CAAC;CACb,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAgPxC,CAAC"}
1
+ {"version":3,"file":"TagsInput.d.ts","sourceRoot":"","sources":["../../lib/components/TagsInput.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,EAAqB,MAAM,OAAO,CAAC;AAGnD;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG;IAC5B,6EAA6E;IAC7E,IAAI,EAAE,MAAM,CAAC;IACb,kCAAkC;IAClC,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,gDAAgD;IAChD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACrC,+EAA+E;IAC/E,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,oCAAoC;IACpC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2CAA2C;IAC3C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,0EAA0E;IAC1E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,sCAAsC;IACtC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,qCAAqC;IACrC,GAAG,CAAC,EAAE,MAAM,CAAC;CACb,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CA2OxC,CAAC"}
package/dist/components/TagsInput.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { createElement as _createElement } from "react";
3
- import { Autocomplete, Chip, FormHelperText, TextField } from '@mui/material';
3
+ import { Autocomplete, Chip, TextField } from '@mui/material';
4
4
  import { useEffect, useRef } from 'react';
5
5
  import { Controller, useFormContext } from 'react-hook-form';
6
6
  /**
@@ -137,11 +137,11 @@ export const TagsInput = ({ name, value: valueProp = [], onChange, placeholder =
137
137
  const hasError = !!errorMessage;
138
138
  return (_jsx(Controller, { name: name, control: formContext.control, defaultValue: valueProp, rules: buildRules(), render: ({ field }) => {
139
139
  const tags = field.value ?? [];
140
- return (_jsxs("div", { children: [_jsx(Autocomplete, { multiple: true, freeSolo: true, options: [], value: tags, onChange: (_event, newValue) => {
141
- const cleaned = cleanValues(newValue);
142
- field.onChange(cleaned);
143
- onChange?.(cleaned);
144
- }, disabled: disabled, renderValue: (tagValue, getTagProps) => renderChips(tagValue, getTagProps), renderInput: (params) => (_jsx(TextField, { ...params, name: name, placeholder: tags.length === 0 ? placeholder : undefined, variant: "outlined", size: "small", error: hasError, sx: inputSx(hasError), onBlur: field.onBlur })) }), hasError && (_jsx(FormHelperText, { error: true, sx: { mx: '14px', mt: '3px' }, children: errorMessage }))] }));
140
+ return (_jsx("div", { children: _jsx(Autocomplete, { multiple: true, freeSolo: true, options: [], value: tags, onChange: (_event, newValue) => {
141
+ const cleaned = cleanValues(newValue);
142
+ field.onChange(cleaned);
143
+ onChange?.(cleaned);
144
+ }, disabled: disabled, renderValue: (tagValue, getTagProps) => renderChips(tagValue, getTagProps), renderInput: (params) => (_jsx(TextField, { ...params, name: name, placeholder: tags.length === 0 ? placeholder : undefined, variant: "outlined", size: "small", error: hasError, sx: inputSx(hasError), onBlur: field.onBlur })) }) }));
145
145
  } }));
146
146
  }
147
147
  // ── standalone mode ───────────────────────────────────────────────────
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@capyx/components-library",
3
- "version": "0.0.8",
3
+ "version": "0.0.10",
4
4
  "description": "Capyx Components Library for forms across applications",
5
5
  "publishConfig": {
6
6
  "access": "public"
@@ -50,7 +50,7 @@
50
50
  "build-storybook": "storybook build"
51
51
  },
52
52
  "devDependencies": {
53
- "@biomejs/biome": "^2.4.3",
53
+ "@biomejs/biome": "^2.4.4",
54
54
  "@chromatic-com/storybook": "^5.0.1",
55
55
  "@storybook/addon-a11y": "^10.2.10",
56
56
  "@storybook/addon-docs": "^10.2.10",
@@ -73,7 +73,7 @@
73
73
  "dependencies": {
74
74
  "@emotion/styled": "^11.14.1",
75
75
  "@mui/material": "^7.3.8",
76
- "@mui/x-date-pickers": "^8.27.0",
76
+ "@mui/x-date-pickers": "^8.27.2",
77
77
  "bootstrap": "^5.3.8",
78
78
  "dateformat": "^5.0.3",
79
79
  "dayjs": "^1.11.19",
@@ -81,7 +81,7 @@
81
81
  "react": "^19.2.4",
82
82
  "react-autosuggest": "^10.1.0",
83
83
  "react-bootstrap": "^2.10.10",
84
- "react-hook-form": "^7.71.1",
84
+ "react-hook-form": "^7.71.2",
85
85
  "react-quill-new": "^3.8.3"
86
86
  }
87
87
  }