@dreamcommerce/aurora 0.3.4-165 → 0.3.4-169
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.
- package/build/cjs/src/components/button/index.js +2 -1
- package/build/cjs/src/components/button/index.js.map +1 -1
- package/build/cjs/src/components/color_picker/index.js +6 -2
- package/build/cjs/src/components/color_picker/index.js.map +1 -1
- package/build/cjs/src/components/controls/components/textarea.js +1 -1
- package/build/cjs/src/components/controls/components/textarea.js.map +1 -1
- package/build/esm/src/components/button/index.js +2 -1
- package/build/esm/src/components/button/index.js.map +1 -1
- package/build/esm/src/components/color_picker/index.js +6 -2
- package/build/esm/src/components/color_picker/index.js.map +1 -1
- package/build/esm/src/components/controls/components/textarea.js +1 -1
- package/build/esm/src/components/controls/components/textarea.js.map +1 -1
- package/package.json +1 -1
- package/build/esm/src/src/components/controls/components/textarea.d.ts +0 -4
- package/build/esm/src/src/components/controls/hoc/control_cell_selector/index.d.ts +0 -4
- package/build/esm/src/src/components/controls/hoc/control_checkbox/index.d.ts +0 -16
- package/build/esm/src/src/components/controls/hoc/control_checkbox_switch/index.d.ts +0 -16
- package/build/esm/src/src/components/controls/hoc/control_color_picker/index.d.ts +0 -16
- package/build/esm/src/src/components/controls/hoc/control_date_picker/index.d.ts +0 -4
- package/build/esm/src/src/components/controls/hoc/control_file_picker/index.d.ts +0 -4
- package/build/esm/src/src/components/controls/hoc/control_input/index.d.ts +0 -19
- package/build/esm/src/src/components/controls/hoc/control_multi_select/index.d.ts +0 -4
- package/build/esm/src/src/components/controls/hoc/control_radio/index.d.ts +0 -16
- package/build/esm/src/src/components/controls/hoc/control_radio_group/index.d.ts +0 -4
- package/build/esm/src/src/components/controls/hoc/control_range/index.d.ts +0 -4
- package/build/esm/src/src/components/controls/hoc/control_select/index.d.ts +0 -19
- package/build/esm/src/src/components/controls/hoc/control_tags_selector/index.d.ts +0 -4
- package/build/esm/src/src/components/controls/hoc/control_textarea/index.d.ts +0 -19
- package/build/esm/src/src/components/controls/index.d.ts +0 -4
- package/build/esm/src/src/components/date_picker/components/common_ranges.d.ts +0 -3
- package/build/esm/src/src/components/date_picker/components/month_controller.d.ts +0 -4
- package/build/esm/src/src/components/date_picker/components/pure_date_picker.d.ts +0 -4
- package/build/esm/src/src/components/date_picker/hoc/range_picker.d.ts +0 -4
- package/build/esm/src/src/components/date_picker/hoc/single_date_picker.d.ts +0 -4
- package/build/esm/src/src/components/date_picker/index.d.ts +0 -7
- package/build/esm/src/src/components/dropdown/components/option_multiple.d.ts +0 -22
- package/build/esm/src/src/components/dropdown/hoc/multiselect/index.d.ts +0 -20
- package/build/esm/src/src/components/dropdown/hoc/select/index.d.ts +0 -20
- package/build/esm/src/src/components/dropdown/index.d.ts +0 -22
- package/build/esm/src/src/components/tags_selector/index.d.ts +0 -4
- package/build/esm/src/src/index.d.ts +0 -79
- package/build/esm/src/stories/button/button.stories.d.ts +0 -146
- package/build/esm/src/stories/controls/control_cell_selector/control_cell_selector.stories.d.ts +0 -90
- package/build/esm/src/stories/controls/control_checkbox/checkbox.stories.d.ts +0 -89
- package/build/esm/src/stories/controls/control_checkbox_switch/checkbox_switch.stories.d.ts +0 -89
- package/build/esm/src/stories/controls/control_color_picker/control_color_picker.stories.d.ts +0 -126
- package/build/esm/src/stories/controls/control_date_picker/control_date_picker.stories.d.ts +0 -164
- package/build/esm/src/stories/controls/control_file_picker/control_file_picker.stories.d.ts +0 -128
- package/build/esm/src/stories/controls/control_input/control_input.stories.d.ts +0 -184
- package/build/esm/src/stories/controls/control_multi_select/control_multi_select.stories.d.ts +0 -89
- package/build/esm/src/stories/controls/control_radio/control_radio.stories.d.ts +0 -127
- package/build/esm/src/stories/controls/control_radio_group/control_radio.stories.d.ts +0 -32
- package/build/esm/src/stories/controls/control_range/control_range.stories.d.ts +0 -71
- package/build/esm/src/stories/controls/control_range_picker/control_range_picker.stories.d.ts +0 -108
- package/build/esm/src/stories/controls/control_select/control_select.stories.d.ts +0 -108
- package/build/esm/src/stories/controls/control_tags_selector/control_tags_selector.stories.d.ts +0 -126
- package/build/esm/src/stories/controls/control_textarea/control_textarea.stories.d.ts +0 -146
- package/build/esm/src/stories/data_table/data_table.stories.d.ts +0 -33
- package/build/esm/src/stories/dropdown/dropdown.stories.d.ts +0 -127
- package/build/esm/src/stories/flash_messenger/flash_messanger.stories.d.ts +0 -31
- package/build/esm/src/stories/gallery/gallery.stories.d.ts +0 -33
- package/build/esm/src/stories/grid/col.stories.d.ts +0 -89
- package/build/esm/src/stories/grid/grid.stories.d.ts +0 -32
- package/build/esm/src/stories/grid/main.stories.d.ts +0 -71
- package/build/esm/src/stories/grid/row.stories.d.ts +0 -108
- package/build/esm/src/stories/heading/heading.stories.d.ts +0 -51
- package/build/esm/src/stories/heading/subheadings.stories.d.ts +0 -32
- package/build/esm/src/stories/hint/hint.stories.d.ts +0 -70
- package/build/esm/src/stories/loader/loader.stories.d.ts +0 -70
- package/build/esm/src/stories/message_box/message_box.stories.d.ts +0 -50
- package/build/esm/src/stories/modal/modal.stories.d.ts +0 -126
- package/build/esm/src/stories/modal/modal_absolute_positioning.stories.d.ts +0 -183
- package/build/esm/src/stories/modal/modal_animations.stories.d.ts +0 -202
- package/build/esm/src/stories/modal/modal_relative_positioning.stories.d.ts +0 -88
- package/build/esm/src/stories/modal/modal_structure.stories.d.ts +0 -31
- package/build/esm/src/stories/multiselect_stories/multiselect.stories.d.ts +0 -281
- package/build/esm/src/stories/select_stories/select.stories.d.ts +0 -281
- package/build/esm/src/stories/spacing/spacing.stories.d.ts +0 -89
- package/build/esm/src/stories/table/table.stories.d.ts +0 -91
- package/build/esm/src/stories/tabs/tabs.stories.d.ts +0 -71
- package/build/esm/src/stories/tag/tag.stories.d.ts +0 -51
- package/build/esm/src/stories/tags_selector/tags_selector.stories.d.ts +0 -108
- package/build/esm/src/stories/with_loader/with_loader.stories.d.ts +0 -51
|
@@ -32,7 +32,7 @@ var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
|
|
|
32
32
|
*/
|
|
33
33
|
var Button = function (_a) {
|
|
34
34
|
var _b;
|
|
35
|
-
var _c = _a.as, as = _c === void 0 ? 'button' : _c, size = _a.size, color = _a.color, variant = _a.variant, inactive = _a.inactive, props = _tslib.__rest(_a, ["as", "size", "color", "variant", "inactive"]);
|
|
35
|
+
var _c = _a.as, as = _c === void 0 ? 'button' : _c, size = _a.size, color = _a.color, variant = _a.variant, inactive = _a.inactive, className = _a.className, props = _tslib.__rest(_a, ["as", "size", "color", "variant", "inactive", "className"]);
|
|
36
36
|
var buttonClassNames = classnames__default['default'](main_module['default'][css_classes.cssButton], (_b = {},
|
|
37
37
|
_b[main_module['default'][css_classes.cssButtonS]] = size,
|
|
38
38
|
_b[main_module['default'][css_classes.cssButtonBg]] = !variant,
|
|
@@ -40,6 +40,7 @@ var Button = function (_a) {
|
|
|
40
40
|
_b[main_module['default'][css_classes.cssButtonLink]] = variant === 'link',
|
|
41
41
|
_b[main_module['default'][css_classes.cssButtonSecondary]] = color === 'secondary',
|
|
42
42
|
_b[main_module['default'][css_classes.cssButtonInactive]] = inactive,
|
|
43
|
+
_b.className = className,
|
|
43
44
|
_b));
|
|
44
45
|
return index.buttonTypes[as].render(props, buttonClassNames);
|
|
45
46
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../../src/components/button/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport classnames from 'classnames';\nimport cssClasses from '@css/button/main.module.less';\n\nimport { IButtonProps } from './types';\nimport { cssButton, cssButtonOutline, cssButtonBg, cssButtonLink, cssButtonS, cssButtonSecondary, cssButtonInactive } from './css_classes';\nimport { buttonTypes } from './components';\n\n/**\n * @component\n * @example\n * return (\n * <Button\n * size=\"small\"\n * variant=\"light\">\n * Text button\n * </Button>\n *\n * <Button\n * as=\"link\"\n * href=\"https://onet.pl\">\n * Text button\n * </Button>\n * )\n */\nconst Button: React.FC<IButtonProps> = ({ as = 'button', size, color, variant, inactive, ...props }): JSX.Element => {\n const buttonClassNames = classnames(cssClasses[cssButton], {\n [cssClasses[cssButtonS]]: size,\n [cssClasses[cssButtonBg]]: !variant,\n [cssClasses[cssButtonOutline]]: variant === 'outline',\n [cssClasses[cssButtonLink]]: variant === 'link',\n [cssClasses[cssButtonSecondary]]: color === 'secondary',\n [cssClasses[cssButtonInactive]]: inactive,\n });\n\n return buttonTypes[as].render(props, buttonClassNames);\n};\n\nexport default Button;\n"],"names":["classnames","cssClasses","cssButton","cssButtonS","cssButtonBg","cssButtonOutline","cssButtonLink","cssButtonSecondary","cssButtonInactive","buttonTypes"],"mappings":";;;;;;;;;;;;;;;AASA;;;;;;;;;;;;;;;;;IAiBM,MAAM,GAA2B,UAAC,
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../../src/components/button/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport classnames from 'classnames';\nimport cssClasses from '@css/button/main.module.less';\n\nimport { IButtonProps } from './types';\nimport { cssButton, cssButtonOutline, cssButtonBg, cssButtonLink, cssButtonS, cssButtonSecondary, cssButtonInactive } from './css_classes';\nimport { buttonTypes } from './components';\n\n/**\n * @component\n * @example\n * return (\n * <Button\n * size=\"small\"\n * variant=\"light\">\n * Text button\n * </Button>\n *\n * <Button\n * as=\"link\"\n * href=\"https://onet.pl\">\n * Text button\n * </Button>\n * )\n */\nconst Button: React.FC<IButtonProps> = ({ as = 'button', size, color, variant, inactive, className, ...props }): JSX.Element => {\n const buttonClassNames = classnames(cssClasses[cssButton], {\n [cssClasses[cssButtonS]]: size,\n [cssClasses[cssButtonBg]]: !variant,\n [cssClasses[cssButtonOutline]]: variant === 'outline',\n [cssClasses[cssButtonLink]]: variant === 'link',\n [cssClasses[cssButtonSecondary]]: color === 'secondary',\n [cssClasses[cssButtonInactive]]: inactive,\n className,\n });\n\n return buttonTypes[as].render(props, buttonClassNames);\n};\n\nexport default Button;\n"],"names":["classnames","cssClasses","cssButton","cssButtonS","cssButtonBg","cssButtonOutline","cssButtonLink","cssButtonSecondary","cssButtonInactive","buttonTypes"],"mappings":";;;;;;;;;;;;;;;AASA;;;;;;;;;;;;;;;;;IAiBM,MAAM,GAA2B,UAAC,EAAsE;;IAApE,IAAA,UAAa,EAAb,kCAAa,EAAE,cAAI,EAAE,gBAAK,EAAE,oBAAO,EAAE,sBAAQ,EAAE,wBAAS,EAAE,sFAAQ;IACxG,IAAM,gBAAgB,GAAGA,8BAAU,CAACC,sBAAU,CAACC,qBAAS,CAAC;QACrD,GAACD,sBAAU,CAACE,sBAAU,CAAC,IAAG,IAAI;QAC9B,GAACF,sBAAU,CAACG,uBAAW,CAAC,IAAG,CAAC,OAAO;QACnC,GAACH,sBAAU,CAACI,4BAAgB,CAAC,IAAG,OAAO,KAAK,SAAS;QACrD,GAACJ,sBAAU,CAACK,yBAAa,CAAC,IAAG,OAAO,KAAK,MAAM;QAC/C,GAACL,sBAAU,CAACM,8BAAkB,CAAC,IAAG,KAAK,KAAK,WAAW;QACvD,GAACN,sBAAU,CAACO,6BAAiB,CAAC,IAAG,QAAQ;QACzC,YAAS,YAAA;YACX,CAAC;IAEH,OAAOC,iBAAW,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,EAAE,gBAAgB,CAAC,CAAC;AAC3D;;;;"}
|
|
@@ -71,11 +71,15 @@ var PureColorPicker = function (_a) {
|
|
|
71
71
|
var classes = useStyles({ color: color, saturationLightnessPointer: saturationLightnessPointer, hueSliderPointer: hueSliderPointer, screenName: screenName });
|
|
72
72
|
var inputOnChange = function (event) {
|
|
73
73
|
var value = event.target.value;
|
|
74
|
+
var hexValue = value.charAt(0) !== '#' ? "#" + value : value;
|
|
74
75
|
if (!(hueSliderRef === null || hueSliderRef === void 0 ? void 0 : hueSliderRef.current) || !(saturationLightnessPanelRef === null || saturationLightnessPanelRef === void 0 ? void 0 : saturationLightnessPanelRef.current)) {
|
|
75
76
|
return;
|
|
76
77
|
}
|
|
78
|
+
if (value !== hexValue) {
|
|
79
|
+
event.target.value = hexValue;
|
|
80
|
+
}
|
|
77
81
|
try {
|
|
78
|
-
var color_1 = utilities.getColorFromHex(
|
|
82
|
+
var color_1 = utilities.getColorFromHex(hexValue);
|
|
79
83
|
var _a = utilities.getIndicatorPositionsFromHEX({
|
|
80
84
|
hueSliderRef: hueSliderRef,
|
|
81
85
|
saturationLightnessPanelRef: saturationLightnessPanelRef,
|
|
@@ -86,7 +90,7 @@ var PureColorPicker = function (_a) {
|
|
|
86
90
|
setHueSliderPointer(hueSliderPointer_1);
|
|
87
91
|
}
|
|
88
92
|
catch (e) {
|
|
89
|
-
setColor(_tslib.__assign(_tslib.__assign({}, color), { hex:
|
|
93
|
+
setColor(_tslib.__assign(_tslib.__assign({}, color), { hex: hexValue }));
|
|
90
94
|
}
|
|
91
95
|
};
|
|
92
96
|
var restoreInitialColor = function () {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../../src/components/color_picker/index.tsx"],"sourcesContent":["import React, { ChangeEvent, useContext, useRef } from 'react';\nimport { createUseStyles } from 'react-jss';\nimport Input from '@components/controls/components/input';\nimport styles from '@css/color_picker/main.module.less';\nimport SaturationLightnessPicker from './components/saturation_lightness_picker';\nimport ColorPickerSlider from './components/hue_picker';\nimport ColorPickerButtons from './components/buttons';\nimport { getColorFromHex, getIndicatorPositionsFromHEX } from './utilities';\nimport { IColorPickerContextProps, IColorPickerProps, IPureColorPickerProps } from './types';\nimport { ColorPickerContext } from './context';\nimport { cssColorPicker, cssColorPickerPreview, cssColorPickerPreviewContainer } from '@components/color_picker/css_classes';\nimport { useColorPicker } from '@components/color_picker/use_color_picker';\n\nconst useStyles = createUseStyles({\n saturationLightnessPanel: {\n background: ({ color: { hue } }) => `hsl(${hue},100%, 50%)`,\n },\n saturationLightnessPointer: {\n transform: ({ saturationLightnessPointer: { left, top } }) => `translate3d(${left - 10}px,${top - 10}px,0px)`,\n '& > div': {\n background: ({ color: { hex } }) => hex,\n },\n },\n preview: {\n background: ({ color: { hex } }) => hex,\n },\n huePointer: {\n transform: ({ hueSliderPointer: { top, left }, screenName }) =>\n screenName === 'xs' ? `translate3d(${left - 10}px,0px,0px)` : `translate3d(0px,${top - 10}px,0px)`,\n '& > div': {\n background: ({ color: { hue } }) => `hsl(${hue},100%, 50%)`,\n },\n },\n colorPreview: {\n background: ({ color: { hex } }) => hex,\n },\n});\n\nexport const PureColorPicker: React.FC<IPureColorPickerProps> = ({ hideChooseCancelButtons }) => {\n const {\n color,\n setColor,\n initialColor,\n hueSliderPointer,\n saturationLightnessPointer,\n setHueSliderPointer,\n setSaturationLightnessPointer,\n screenName,\n } = useContext<IColorPickerContextProps>(ColorPickerContext);\n const saturationLightnessPanelRef = useRef<HTMLDivElement>(null);\n const hueSliderRef = useRef<HTMLDivElement>(null);\n const classes = useStyles({ color, saturationLightnessPointer, hueSliderPointer, screenName });\n\n const inputOnChange = (event: ChangeEvent<HTMLInputElement>) => {\n const { value } = event.target;\n if (!hueSliderRef?.current || !saturationLightnessPanelRef?.current) {\n return;\n }\n try {\n const color = getColorFromHex(
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../../src/components/color_picker/index.tsx"],"sourcesContent":["import React, { ChangeEvent, useContext, useRef } from 'react';\nimport { createUseStyles } from 'react-jss';\nimport Input from '@components/controls/components/input';\nimport styles from '@css/color_picker/main.module.less';\nimport SaturationLightnessPicker from './components/saturation_lightness_picker';\nimport ColorPickerSlider from './components/hue_picker';\nimport ColorPickerButtons from './components/buttons';\nimport { getColorFromHex, getIndicatorPositionsFromHEX } from './utilities';\nimport { IColorPickerContextProps, IColorPickerProps, IPureColorPickerProps } from './types';\nimport { ColorPickerContext } from './context';\nimport { cssColorPicker, cssColorPickerPreview, cssColorPickerPreviewContainer } from '@components/color_picker/css_classes';\nimport { useColorPicker } from '@components/color_picker/use_color_picker';\n\nconst useStyles = createUseStyles({\n saturationLightnessPanel: {\n background: ({ color: { hue } }) => `hsl(${hue},100%, 50%)`,\n },\n saturationLightnessPointer: {\n transform: ({ saturationLightnessPointer: { left, top } }) => `translate3d(${left - 10}px,${top - 10}px,0px)`,\n '& > div': {\n background: ({ color: { hex } }) => hex,\n },\n },\n preview: {\n background: ({ color: { hex } }) => hex,\n },\n huePointer: {\n transform: ({ hueSliderPointer: { top, left }, screenName }) =>\n screenName === 'xs' ? `translate3d(${left - 10}px,0px,0px)` : `translate3d(0px,${top - 10}px,0px)`,\n '& > div': {\n background: ({ color: { hue } }) => `hsl(${hue},100%, 50%)`,\n },\n },\n colorPreview: {\n background: ({ color: { hex } }) => hex,\n },\n});\n\nexport const PureColorPicker: React.FC<IPureColorPickerProps> = ({ hideChooseCancelButtons }) => {\n const {\n color,\n setColor,\n initialColor,\n hueSliderPointer,\n saturationLightnessPointer,\n setHueSliderPointer,\n setSaturationLightnessPointer,\n screenName,\n } = useContext<IColorPickerContextProps>(ColorPickerContext);\n const saturationLightnessPanelRef = useRef<HTMLDivElement>(null);\n const hueSliderRef = useRef<HTMLDivElement>(null);\n const classes = useStyles({ color, saturationLightnessPointer, hueSliderPointer, screenName });\n\n const inputOnChange = (event: ChangeEvent<HTMLInputElement>) => {\n const { value } = event.target;\n const hexValue = value.charAt(0) !== '#' ? `#${value}` : value;\n if (!hueSliderRef?.current || !saturationLightnessPanelRef?.current) {\n return;\n }\n\n if (value !== hexValue) {\n event.target.value = hexValue;\n }\n\n try {\n const color = getColorFromHex(hexValue);\n const { saturationLightnessPointer, hueSliderPointer } = getIndicatorPositionsFromHEX({\n hueSliderRef,\n saturationLightnessPanelRef,\n hex: event.target.value,\n });\n setColor(color);\n setSaturationLightnessPointer(saturationLightnessPointer);\n setHueSliderPointer(hueSliderPointer);\n } catch (e) {\n setColor({ ...color, hex: hexValue });\n }\n };\n\n const restoreInitialColor = () => {\n setColor(initialColor);\n };\n\n return (\n <div className={`${styles[cssColorPicker]}`}>\n <SaturationLightnessPicker classes={classes} saturationLightnessPanelRef={saturationLightnessPanelRef} />\n <ColorPickerSlider hueSliderRef={hueSliderRef} classes={classes} />\n <div className={styles[cssColorPickerPreviewContainer]}>\n <div className={`${classes.preview} ${styles[cssColorPickerPreview]}`} />\n <div>\n <Input id=\"color-picker-id\" value={color?.hex} onChange={inputOnChange} />\n </div>\n </div>\n {!hideChooseCancelButtons && <ColorPickerButtons restoreInitialColor={restoreInitialColor} />}\n </div>\n );\n};\n\nexport default ({ initialColor, onChange, hideChooseCancelButtons, name }: IColorPickerProps) => {\n const colorPickerContext = useColorPicker({ initialColorHex: initialColor || '#ffffff', onChange });\n\n return (\n <ColorPickerContext.Provider value={colorPickerContext}>\n <input type=\"hidden\" name={name} />\n <PureColorPicker hideChooseCancelButtons={hideChooseCancelButtons} />\n </ColorPickerContext.Provider>\n );\n};\n"],"names":["createUseStyles","useRef","getColorFromHex","React","styles","cssColorPicker","SaturationLightnessPicker","ColorPickerSlider","cssColorPickerPreviewContainer","cssColorPickerPreview","Input","ColorPickerButtons","useColorPicker","ColorPickerContext"],"mappings":"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"}
|
|
@@ -21,7 +21,7 @@ var Textarea = function (_a) {
|
|
|
21
21
|
_b[main_module['default'][css_classes.cssControlDisabled]] = disabled,
|
|
22
22
|
_b[main_module['default'][css_classes.cssControlReadonly]] = readOnly,
|
|
23
23
|
_b));
|
|
24
|
-
return (React__default['default'].createElement("textarea", _tslib.__assign({}, props, { className: inputClasses, id: id, name: name,
|
|
24
|
+
return (React__default['default'].createElement("textarea", _tslib.__assign({}, props, { className: inputClasses, id: id, name: name, value: value, placeholder: placeholder, disabled: disabled, readOnly: readOnly, onChange: onChange, onKeyPress: onKeyPress })));
|
|
25
25
|
};
|
|
26
26
|
|
|
27
27
|
exports.default = Textarea;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"textarea.js","sources":["../../../../../../src/components/controls/components/textarea.tsx"],"sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\n\nimport cssClasses from '@css/input/main.module.less';\nimport { ITextareaProps } from '../types';\nimport { cssControl, cssControlS, cssControlDisabled, cssControlReadonly } from '../css_classes';\n\nconst Textarea: React.FC<ITextareaProps> = ({\n id,\n name,\n padding,\n placeholder,\n value,\n disabled,\n readOnly,\n onChange,\n onKeyPress,\n ...props\n}): JSX.Element => {\n const inputClasses = classnames(cssClasses[cssControl], {\n [cssClasses[cssControlS]]: padding === 'small',\n [cssClasses[cssControlDisabled]]: disabled,\n [cssClasses[cssControlReadonly]]: readOnly\n });\n\n return (\n <textarea\n {...props}\n className={inputClasses}\n id={id}\n name={name}\n
|
|
1
|
+
{"version":3,"file":"textarea.js","sources":["../../../../../../src/components/controls/components/textarea.tsx"],"sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\n\nimport cssClasses from '@css/input/main.module.less';\nimport { ITextareaProps } from '../types';\nimport { cssControl, cssControlS, cssControlDisabled, cssControlReadonly } from '../css_classes';\n\nconst Textarea: React.FC<ITextareaProps> = ({\n id,\n name,\n padding,\n placeholder,\n value,\n disabled,\n readOnly,\n onChange,\n onKeyPress,\n ...props\n}): JSX.Element => {\n const inputClasses = classnames(cssClasses[cssControl], {\n [cssClasses[cssControlS]]: padding === 'small',\n [cssClasses[cssControlDisabled]]: disabled,\n [cssClasses[cssControlReadonly]]: readOnly\n });\n\n return (\n <textarea\n {...props}\n className={inputClasses}\n id={id}\n name={name}\n value={value}\n placeholder={placeholder}\n disabled={disabled}\n readOnly={readOnly}\n onChange={onChange}\n onKeyPress={onKeyPress}\n ></textarea>\n );\n};\n\nexport default Textarea;\n"],"names":["classnames","cssClasses","cssControl","cssControlS","cssControlDisabled","cssControlReadonly","React"],"mappings":";;;;;;;;;;;;;;;IAOM,QAAQ,GAA6B,UAAC,EAW3C;;IAVG,IAAA,UAAE,EACF,cAAI,EACJ,oBAAO,EACP,4BAAW,EACX,gBAAK,EACL,sBAAQ,EACR,sBAAQ,EACR,sBAAQ,EACR,0BAAU,EACV,8HAAQ;IAER,IAAM,YAAY,GAAGA,8BAAU,CAACC,sBAAU,CAACC,sBAAU,CAAC;QAClD,GAACD,sBAAU,CAACE,uBAAW,CAAC,IAAG,OAAO,KAAK,OAAO;QAC9C,GAACF,sBAAU,CAACG,8BAAkB,CAAC,IAAG,QAAQ;QAC1C,GAACH,sBAAU,CAACI,8BAAkB,CAAC,IAAG,QAAQ;YAC5C,CAAC;IAEH,QACIC,wEACQ,KAAK,IACT,SAAS,EAAE,YAAY,EACvB,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,UAAU,IACd,EACd;AACN;;;;"}
|
|
@@ -24,7 +24,7 @@ import { buttonTypes } from './components/index.js';
|
|
|
24
24
|
*/
|
|
25
25
|
var Button = function (_a) {
|
|
26
26
|
var _b;
|
|
27
|
-
var _c = _a.as, as = _c === void 0 ? 'button' : _c, size = _a.size, color = _a.color, variant = _a.variant, inactive = _a.inactive, props = __rest(_a, ["as", "size", "color", "variant", "inactive"]);
|
|
27
|
+
var _c = _a.as, as = _c === void 0 ? 'button' : _c, size = _a.size, color = _a.color, variant = _a.variant, inactive = _a.inactive, className = _a.className, props = __rest(_a, ["as", "size", "color", "variant", "inactive", "className"]);
|
|
28
28
|
var buttonClassNames = classnames(cssClasses[cssButton], (_b = {},
|
|
29
29
|
_b[cssClasses[cssButtonS]] = size,
|
|
30
30
|
_b[cssClasses[cssButtonBg]] = !variant,
|
|
@@ -32,6 +32,7 @@ var Button = function (_a) {
|
|
|
32
32
|
_b[cssClasses[cssButtonLink]] = variant === 'link',
|
|
33
33
|
_b[cssClasses[cssButtonSecondary]] = color === 'secondary',
|
|
34
34
|
_b[cssClasses[cssButtonInactive]] = inactive,
|
|
35
|
+
_b.className = className,
|
|
35
36
|
_b));
|
|
36
37
|
return buttonTypes[as].render(props, buttonClassNames);
|
|
37
38
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../../src/components/button/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport classnames from 'classnames';\nimport cssClasses from '@css/button/main.module.less';\n\nimport { IButtonProps } from './types';\nimport { cssButton, cssButtonOutline, cssButtonBg, cssButtonLink, cssButtonS, cssButtonSecondary, cssButtonInactive } from './css_classes';\nimport { buttonTypes } from './components';\n\n/**\n * @component\n * @example\n * return (\n * <Button\n * size=\"small\"\n * variant=\"light\">\n * Text button\n * </Button>\n *\n * <Button\n * as=\"link\"\n * href=\"https://onet.pl\">\n * Text button\n * </Button>\n * )\n */\nconst Button: React.FC<IButtonProps> = ({ as = 'button', size, color, variant, inactive, ...props }): JSX.Element => {\n const buttonClassNames = classnames(cssClasses[cssButton], {\n [cssClasses[cssButtonS]]: size,\n [cssClasses[cssButtonBg]]: !variant,\n [cssClasses[cssButtonOutline]]: variant === 'outline',\n [cssClasses[cssButtonLink]]: variant === 'link',\n [cssClasses[cssButtonSecondary]]: color === 'secondary',\n [cssClasses[cssButtonInactive]]: inactive,\n });\n\n return buttonTypes[as].render(props, buttonClassNames);\n};\n\nexport default Button;\n"],"names":[],"mappings":";;;;;;;AASA;;;;;;;;;;;;;;;;;IAiBM,MAAM,GAA2B,UAAC,
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../../src/components/button/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport classnames from 'classnames';\nimport cssClasses from '@css/button/main.module.less';\n\nimport { IButtonProps } from './types';\nimport { cssButton, cssButtonOutline, cssButtonBg, cssButtonLink, cssButtonS, cssButtonSecondary, cssButtonInactive } from './css_classes';\nimport { buttonTypes } from './components';\n\n/**\n * @component\n * @example\n * return (\n * <Button\n * size=\"small\"\n * variant=\"light\">\n * Text button\n * </Button>\n *\n * <Button\n * as=\"link\"\n * href=\"https://onet.pl\">\n * Text button\n * </Button>\n * )\n */\nconst Button: React.FC<IButtonProps> = ({ as = 'button', size, color, variant, inactive, className, ...props }): JSX.Element => {\n const buttonClassNames = classnames(cssClasses[cssButton], {\n [cssClasses[cssButtonS]]: size,\n [cssClasses[cssButtonBg]]: !variant,\n [cssClasses[cssButtonOutline]]: variant === 'outline',\n [cssClasses[cssButtonLink]]: variant === 'link',\n [cssClasses[cssButtonSecondary]]: color === 'secondary',\n [cssClasses[cssButtonInactive]]: inactive,\n className,\n });\n\n return buttonTypes[as].render(props, buttonClassNames);\n};\n\nexport default Button;\n"],"names":[],"mappings":";;;;;;;AASA;;;;;;;;;;;;;;;;;IAiBM,MAAM,GAA2B,UAAC,EAAsE;;IAApE,IAAA,UAAa,EAAb,kCAAa,EAAE,cAAI,EAAE,gBAAK,EAAE,oBAAO,EAAE,sBAAQ,EAAE,wBAAS,EAAE,+EAAQ;IACxG,IAAM,gBAAgB,GAAG,UAAU,CAAC,UAAU,CAAC,SAAS,CAAC;QACrD,GAAC,UAAU,CAAC,UAAU,CAAC,IAAG,IAAI;QAC9B,GAAC,UAAU,CAAC,WAAW,CAAC,IAAG,CAAC,OAAO;QACnC,GAAC,UAAU,CAAC,gBAAgB,CAAC,IAAG,OAAO,KAAK,SAAS;QACrD,GAAC,UAAU,CAAC,aAAa,CAAC,IAAG,OAAO,KAAK,MAAM;QAC/C,GAAC,UAAU,CAAC,kBAAkB,CAAC,IAAG,KAAK,KAAK,WAAW;QACvD,GAAC,UAAU,CAAC,iBAAiB,CAAC,IAAG,QAAQ;QACzC,YAAS,YAAA;YACX,CAAC;IAEH,OAAO,WAAW,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,EAAE,gBAAgB,CAAC,CAAC;AAC3D;;;;"}
|
|
@@ -63,11 +63,15 @@ var PureColorPicker = function (_a) {
|
|
|
63
63
|
var classes = useStyles({ color: color, saturationLightnessPointer: saturationLightnessPointer, hueSliderPointer: hueSliderPointer, screenName: screenName });
|
|
64
64
|
var inputOnChange = function (event) {
|
|
65
65
|
var value = event.target.value;
|
|
66
|
+
var hexValue = value.charAt(0) !== '#' ? "#" + value : value;
|
|
66
67
|
if (!(hueSliderRef === null || hueSliderRef === void 0 ? void 0 : hueSliderRef.current) || !(saturationLightnessPanelRef === null || saturationLightnessPanelRef === void 0 ? void 0 : saturationLightnessPanelRef.current)) {
|
|
67
68
|
return;
|
|
68
69
|
}
|
|
70
|
+
if (value !== hexValue) {
|
|
71
|
+
event.target.value = hexValue;
|
|
72
|
+
}
|
|
69
73
|
try {
|
|
70
|
-
var color_1 = getColorFromHex(
|
|
74
|
+
var color_1 = getColorFromHex(hexValue);
|
|
71
75
|
var _a = getIndicatorPositionsFromHEX({
|
|
72
76
|
hueSliderRef: hueSliderRef,
|
|
73
77
|
saturationLightnessPanelRef: saturationLightnessPanelRef,
|
|
@@ -78,7 +82,7 @@ var PureColorPicker = function (_a) {
|
|
|
78
82
|
setHueSliderPointer(hueSliderPointer_1);
|
|
79
83
|
}
|
|
80
84
|
catch (e) {
|
|
81
|
-
setColor(__assign(__assign({}, color), { hex:
|
|
85
|
+
setColor(__assign(__assign({}, color), { hex: hexValue }));
|
|
82
86
|
}
|
|
83
87
|
};
|
|
84
88
|
var restoreInitialColor = function () {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../../src/components/color_picker/index.tsx"],"sourcesContent":["import React, { ChangeEvent, useContext, useRef } from 'react';\nimport { createUseStyles } from 'react-jss';\nimport Input from '@components/controls/components/input';\nimport styles from '@css/color_picker/main.module.less';\nimport SaturationLightnessPicker from './components/saturation_lightness_picker';\nimport ColorPickerSlider from './components/hue_picker';\nimport ColorPickerButtons from './components/buttons';\nimport { getColorFromHex, getIndicatorPositionsFromHEX } from './utilities';\nimport { IColorPickerContextProps, IColorPickerProps, IPureColorPickerProps } from './types';\nimport { ColorPickerContext } from './context';\nimport { cssColorPicker, cssColorPickerPreview, cssColorPickerPreviewContainer } from '@components/color_picker/css_classes';\nimport { useColorPicker } from '@components/color_picker/use_color_picker';\n\nconst useStyles = createUseStyles({\n saturationLightnessPanel: {\n background: ({ color: { hue } }) => `hsl(${hue},100%, 50%)`,\n },\n saturationLightnessPointer: {\n transform: ({ saturationLightnessPointer: { left, top } }) => `translate3d(${left - 10}px,${top - 10}px,0px)`,\n '& > div': {\n background: ({ color: { hex } }) => hex,\n },\n },\n preview: {\n background: ({ color: { hex } }) => hex,\n },\n huePointer: {\n transform: ({ hueSliderPointer: { top, left }, screenName }) =>\n screenName === 'xs' ? `translate3d(${left - 10}px,0px,0px)` : `translate3d(0px,${top - 10}px,0px)`,\n '& > div': {\n background: ({ color: { hue } }) => `hsl(${hue},100%, 50%)`,\n },\n },\n colorPreview: {\n background: ({ color: { hex } }) => hex,\n },\n});\n\nexport const PureColorPicker: React.FC<IPureColorPickerProps> = ({ hideChooseCancelButtons }) => {\n const {\n color,\n setColor,\n initialColor,\n hueSliderPointer,\n saturationLightnessPointer,\n setHueSliderPointer,\n setSaturationLightnessPointer,\n screenName,\n } = useContext<IColorPickerContextProps>(ColorPickerContext);\n const saturationLightnessPanelRef = useRef<HTMLDivElement>(null);\n const hueSliderRef = useRef<HTMLDivElement>(null);\n const classes = useStyles({ color, saturationLightnessPointer, hueSliderPointer, screenName });\n\n const inputOnChange = (event: ChangeEvent<HTMLInputElement>) => {\n const { value } = event.target;\n if (!hueSliderRef?.current || !saturationLightnessPanelRef?.current) {\n return;\n }\n try {\n const color = getColorFromHex(
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../../src/components/color_picker/index.tsx"],"sourcesContent":["import React, { ChangeEvent, useContext, useRef } from 'react';\nimport { createUseStyles } from 'react-jss';\nimport Input from '@components/controls/components/input';\nimport styles from '@css/color_picker/main.module.less';\nimport SaturationLightnessPicker from './components/saturation_lightness_picker';\nimport ColorPickerSlider from './components/hue_picker';\nimport ColorPickerButtons from './components/buttons';\nimport { getColorFromHex, getIndicatorPositionsFromHEX } from './utilities';\nimport { IColorPickerContextProps, IColorPickerProps, IPureColorPickerProps } from './types';\nimport { ColorPickerContext } from './context';\nimport { cssColorPicker, cssColorPickerPreview, cssColorPickerPreviewContainer } from '@components/color_picker/css_classes';\nimport { useColorPicker } from '@components/color_picker/use_color_picker';\n\nconst useStyles = createUseStyles({\n saturationLightnessPanel: {\n background: ({ color: { hue } }) => `hsl(${hue},100%, 50%)`,\n },\n saturationLightnessPointer: {\n transform: ({ saturationLightnessPointer: { left, top } }) => `translate3d(${left - 10}px,${top - 10}px,0px)`,\n '& > div': {\n background: ({ color: { hex } }) => hex,\n },\n },\n preview: {\n background: ({ color: { hex } }) => hex,\n },\n huePointer: {\n transform: ({ hueSliderPointer: { top, left }, screenName }) =>\n screenName === 'xs' ? `translate3d(${left - 10}px,0px,0px)` : `translate3d(0px,${top - 10}px,0px)`,\n '& > div': {\n background: ({ color: { hue } }) => `hsl(${hue},100%, 50%)`,\n },\n },\n colorPreview: {\n background: ({ color: { hex } }) => hex,\n },\n});\n\nexport const PureColorPicker: React.FC<IPureColorPickerProps> = ({ hideChooseCancelButtons }) => {\n const {\n color,\n setColor,\n initialColor,\n hueSliderPointer,\n saturationLightnessPointer,\n setHueSliderPointer,\n setSaturationLightnessPointer,\n screenName,\n } = useContext<IColorPickerContextProps>(ColorPickerContext);\n const saturationLightnessPanelRef = useRef<HTMLDivElement>(null);\n const hueSliderRef = useRef<HTMLDivElement>(null);\n const classes = useStyles({ color, saturationLightnessPointer, hueSliderPointer, screenName });\n\n const inputOnChange = (event: ChangeEvent<HTMLInputElement>) => {\n const { value } = event.target;\n const hexValue = value.charAt(0) !== '#' ? `#${value}` : value;\n if (!hueSliderRef?.current || !saturationLightnessPanelRef?.current) {\n return;\n }\n\n if (value !== hexValue) {\n event.target.value = hexValue;\n }\n\n try {\n const color = getColorFromHex(hexValue);\n const { saturationLightnessPointer, hueSliderPointer } = getIndicatorPositionsFromHEX({\n hueSliderRef,\n saturationLightnessPanelRef,\n hex: event.target.value,\n });\n setColor(color);\n setSaturationLightnessPointer(saturationLightnessPointer);\n setHueSliderPointer(hueSliderPointer);\n } catch (e) {\n setColor({ ...color, hex: hexValue });\n }\n };\n\n const restoreInitialColor = () => {\n setColor(initialColor);\n };\n\n return (\n <div className={`${styles[cssColorPicker]}`}>\n <SaturationLightnessPicker classes={classes} saturationLightnessPanelRef={saturationLightnessPanelRef} />\n <ColorPickerSlider hueSliderRef={hueSliderRef} classes={classes} />\n <div className={styles[cssColorPickerPreviewContainer]}>\n <div className={`${classes.preview} ${styles[cssColorPickerPreview]}`} />\n <div>\n <Input id=\"color-picker-id\" value={color?.hex} onChange={inputOnChange} />\n </div>\n </div>\n {!hideChooseCancelButtons && <ColorPickerButtons restoreInitialColor={restoreInitialColor} />}\n </div>\n );\n};\n\nexport default ({ initialColor, onChange, hideChooseCancelButtons, name }: IColorPickerProps) => {\n const colorPickerContext = useColorPicker({ initialColorHex: initialColor || '#ffffff', onChange });\n\n return (\n <ColorPickerContext.Provider value={colorPickerContext}>\n <input type=\"hidden\" name={name} />\n <PureColorPicker hideChooseCancelButtons={hideChooseCancelButtons} />\n </ColorPickerContext.Provider>\n );\n};\n"],"names":["ColorPickerSlider"],"mappings":"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"}
|
|
@@ -12,7 +12,7 @@ var Textarea = function (_a) {
|
|
|
12
12
|
_b[cssClasses[cssControlDisabled]] = disabled,
|
|
13
13
|
_b[cssClasses[cssControlReadonly]] = readOnly,
|
|
14
14
|
_b));
|
|
15
|
-
return (React.createElement("textarea", __assign({}, props, { className: inputClasses, id: id, name: name,
|
|
15
|
+
return (React.createElement("textarea", __assign({}, props, { className: inputClasses, id: id, name: name, value: value, placeholder: placeholder, disabled: disabled, readOnly: readOnly, onChange: onChange, onKeyPress: onKeyPress })));
|
|
16
16
|
};
|
|
17
17
|
|
|
18
18
|
export default Textarea;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"textarea.js","sources":["../../../../../../src/components/controls/components/textarea.tsx"],"sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\n\nimport cssClasses from '@css/input/main.module.less';\nimport { ITextareaProps } from '../types';\nimport { cssControl, cssControlS, cssControlDisabled, cssControlReadonly } from '../css_classes';\n\nconst Textarea: React.FC<ITextareaProps> = ({\n id,\n name,\n padding,\n placeholder,\n value,\n disabled,\n readOnly,\n onChange,\n onKeyPress,\n ...props\n}): JSX.Element => {\n const inputClasses = classnames(cssClasses[cssControl], {\n [cssClasses[cssControlS]]: padding === 'small',\n [cssClasses[cssControlDisabled]]: disabled,\n [cssClasses[cssControlReadonly]]: readOnly\n });\n\n return (\n <textarea\n {...props}\n className={inputClasses}\n id={id}\n name={name}\n
|
|
1
|
+
{"version":3,"file":"textarea.js","sources":["../../../../../../src/components/controls/components/textarea.tsx"],"sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\n\nimport cssClasses from '@css/input/main.module.less';\nimport { ITextareaProps } from '../types';\nimport { cssControl, cssControlS, cssControlDisabled, cssControlReadonly } from '../css_classes';\n\nconst Textarea: React.FC<ITextareaProps> = ({\n id,\n name,\n padding,\n placeholder,\n value,\n disabled,\n readOnly,\n onChange,\n onKeyPress,\n ...props\n}): JSX.Element => {\n const inputClasses = classnames(cssClasses[cssControl], {\n [cssClasses[cssControlS]]: padding === 'small',\n [cssClasses[cssControlDisabled]]: disabled,\n [cssClasses[cssControlReadonly]]: readOnly\n });\n\n return (\n <textarea\n {...props}\n className={inputClasses}\n id={id}\n name={name}\n value={value}\n placeholder={placeholder}\n disabled={disabled}\n readOnly={readOnly}\n onChange={onChange}\n onKeyPress={onKeyPress}\n ></textarea>\n );\n};\n\nexport default Textarea;\n"],"names":[],"mappings":";;;;;;IAOM,QAAQ,GAA6B,UAAC,EAW3C;;IAVG,IAAA,UAAE,EACF,cAAI,EACJ,oBAAO,EACP,4BAAW,EACX,gBAAK,EACL,sBAAQ,EACR,sBAAQ,EACR,sBAAQ,EACR,0BAAU,EACV,uHAAQ;IAER,IAAM,YAAY,GAAG,UAAU,CAAC,UAAU,CAAC,UAAU,CAAC;QAClD,GAAC,UAAU,CAAC,WAAW,CAAC,IAAG,OAAO,KAAK,OAAO;QAC9C,GAAC,UAAU,CAAC,kBAAkB,CAAC,IAAG,QAAQ;QAC1C,GAAC,UAAU,CAAC,kBAAkB,CAAC,IAAG,QAAQ;YAC5C,CAAC;IAEH,QACI,6CACQ,KAAK,IACT,SAAS,EAAE,YAAY,EACvB,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,UAAU,IACd,EACd;AACN;;;;"}
|
package/package.json
CHANGED
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { IControlCheckboxProps } from '../../types';
|
|
3
|
-
/**
|
|
4
|
-
* @component
|
|
5
|
-
* @example
|
|
6
|
-
* return (
|
|
7
|
-
* <ControlCheckbox
|
|
8
|
-
* id="checkbox_example"
|
|
9
|
-
* label="Label"
|
|
10
|
-
* labelPosition="left"
|
|
11
|
-
* checked
|
|
12
|
-
* />
|
|
13
|
-
* )
|
|
14
|
-
*/
|
|
15
|
-
declare const ControlCheckbox: React.FC<IControlCheckboxProps>;
|
|
16
|
-
export default ControlCheckbox;
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { IControlCheckboxProps } from '../../types';
|
|
3
|
-
/**
|
|
4
|
-
* @component
|
|
5
|
-
* @example
|
|
6
|
-
* return (
|
|
7
|
-
* <ControlCheckbox
|
|
8
|
-
* id="checkbox_example"
|
|
9
|
-
* label="Label"
|
|
10
|
-
* labelPosition="left"
|
|
11
|
-
* checked
|
|
12
|
-
* />
|
|
13
|
-
* )
|
|
14
|
-
*/
|
|
15
|
-
declare const ControlCheckboxSwitch: React.FC<IControlCheckboxProps>;
|
|
16
|
-
export default ControlCheckboxSwitch;
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { IControlColorPickerProps } from '@components/controls/types';
|
|
3
|
-
/**
|
|
4
|
-
* @component
|
|
5
|
-
* @example
|
|
6
|
-
* return (
|
|
7
|
-
* <ControlColorPicker
|
|
8
|
-
* initialColor="#FF00FF"
|
|
9
|
-
* name="Example color picker"
|
|
10
|
-
* isRequired
|
|
11
|
-
* label="Example color picker label"
|
|
12
|
-
* />
|
|
13
|
-
* )
|
|
14
|
-
*/
|
|
15
|
-
declare const ControlColorPicker: React.FC<IControlColorPickerProps>;
|
|
16
|
-
export default ControlColorPicker;
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { IControlInputProps } from '../../types';
|
|
3
|
-
/**
|
|
4
|
-
* @component
|
|
5
|
-
* @example
|
|
6
|
-
* return (
|
|
7
|
-
* <ControlInput
|
|
8
|
-
* label="Label"
|
|
9
|
-
* isRequired={true}
|
|
10
|
-
* id="input_example"
|
|
11
|
-
* postfix="zł"
|
|
12
|
-
* placeholder="Enter text"
|
|
13
|
-
* value="example"
|
|
14
|
-
* onChange={() => {}}
|
|
15
|
-
* />
|
|
16
|
-
* )
|
|
17
|
-
*/
|
|
18
|
-
declare const ControlInput: React.FC<IControlInputProps>;
|
|
19
|
-
export default ControlInput;
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { IControlRadioProps } from '../../types';
|
|
3
|
-
/**
|
|
4
|
-
* @component
|
|
5
|
-
* @example
|
|
6
|
-
* return (
|
|
7
|
-
* <ControlRadio
|
|
8
|
-
* id="checkbox_example"
|
|
9
|
-
* label="Label"
|
|
10
|
-
* labelPosition="left"
|
|
11
|
-
* checked
|
|
12
|
-
* />
|
|
13
|
-
* )
|
|
14
|
-
*/
|
|
15
|
-
declare const ControlRadio: React.FC<IControlRadioProps>;
|
|
16
|
-
export default ControlRadio;
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { IControlSelectProps } from '../../types';
|
|
3
|
-
/**
|
|
4
|
-
* @component
|
|
5
|
-
* @example
|
|
6
|
-
* return (
|
|
7
|
-
* <ControlInput
|
|
8
|
-
* label="Label"
|
|
9
|
-
* isRequired={true}
|
|
10
|
-
* id="input_example"
|
|
11
|
-
* postfix="zł"
|
|
12
|
-
* placeholder="Enter text"
|
|
13
|
-
* value="example"
|
|
14
|
-
* onChange={() => {}}
|
|
15
|
-
* />
|
|
16
|
-
* )
|
|
17
|
-
*/
|
|
18
|
-
declare const ControlSelect: React.FC<IControlSelectProps>;
|
|
19
|
-
export default ControlSelect;
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { IControlTextareaProps } from '../../types';
|
|
3
|
-
/**
|
|
4
|
-
* @component
|
|
5
|
-
* @example
|
|
6
|
-
* return (
|
|
7
|
-
* <ControlInput
|
|
8
|
-
* label="Label"
|
|
9
|
-
* isRequired={true}
|
|
10
|
-
* id="input_example"
|
|
11
|
-
* postfix="zł"
|
|
12
|
-
* placeholder="Enter text"
|
|
13
|
-
* value="example"
|
|
14
|
-
* onChange={() => {}}
|
|
15
|
-
* />
|
|
16
|
-
* )
|
|
17
|
-
*/
|
|
18
|
-
declare const ControlTextarea: React.FC<IControlTextareaProps>;
|
|
19
|
-
export default ControlTextarea;
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { IDatepickerProps } from './types';
|
|
3
|
-
import RangePicker from './hoc/range_picker';
|
|
4
|
-
import SingleDatepicker from './hoc/single_date_picker';
|
|
5
|
-
export { RangePicker, SingleDatepicker };
|
|
6
|
-
declare const _default: ({ defaultDate, defaultRange, type, name, onChange, maxDate, minDate, maxRange, minRange, className, showButtons, showDefaultRanges, }: IDatepickerProps) => JSX.Element;
|
|
7
|
-
export default _default;
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { IDropdownOptionMultipleProps } from '../types';
|
|
3
|
-
/**
|
|
4
|
-
* Dropdown.OptionMultiple component. Should be only used within Dropdown.List
|
|
5
|
-
* @component
|
|
6
|
-
* @example
|
|
7
|
-
* const option = {
|
|
8
|
-
* text: 'Option 1',
|
|
9
|
-
* value: '1'
|
|
10
|
-
* }
|
|
11
|
-
*
|
|
12
|
-
* <Dropdown.OptionMultiple
|
|
13
|
-
* key="id1"
|
|
14
|
-
* option={option}
|
|
15
|
-
* isSelected={false}
|
|
16
|
-
* isDisabled={false}
|
|
17
|
-
* isReadonly={false}
|
|
18
|
-
* onClick={(option) => console.log(option)}
|
|
19
|
-
* />
|
|
20
|
-
*/
|
|
21
|
-
declare const OptionMultiple: React.FC<IDropdownOptionMultipleProps>;
|
|
22
|
-
export default OptionMultiple;
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { IMultiSelectProps } from '../../types';
|
|
3
|
-
/**
|
|
4
|
-
* MultiSelect component. Build with Dropdown composed components.
|
|
5
|
-
*
|
|
6
|
-
* @component
|
|
7
|
-
* @example
|
|
8
|
-
* const options = [{
|
|
9
|
-
* text: 'Option 1',
|
|
10
|
-
* value: 'value1'
|
|
11
|
-
* }, {
|
|
12
|
-
* text: 'Option 2,,
|
|
13
|
-
* value: 'value2'
|
|
14
|
-
* }];
|
|
15
|
-
* return (
|
|
16
|
-
* <MultiSelect name="my_select_name" options={options} onChange={(option) => console.log(option)} />
|
|
17
|
-
* )
|
|
18
|
-
*/
|
|
19
|
-
declare const Multiple: React.FC<IMultiSelectProps>;
|
|
20
|
-
export default Multiple;
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { ISelectProps } from '../../types';
|
|
3
|
-
/**
|
|
4
|
-
* Select component. Build with Dropdown composed components.
|
|
5
|
-
*
|
|
6
|
-
* @component
|
|
7
|
-
* @example
|
|
8
|
-
* const options = [{
|
|
9
|
-
* text: 'Option 1',
|
|
10
|
-
* value: 'value1'
|
|
11
|
-
* }, {
|
|
12
|
-
* text: 'Option 2,,
|
|
13
|
-
* value: 'value2'
|
|
14
|
-
* }];
|
|
15
|
-
* return (
|
|
16
|
-
* <Select name="my_select_name" options={options} onChange={(option) => console.log(option)} />
|
|
17
|
-
* )
|
|
18
|
-
*/
|
|
19
|
-
declare const Select: React.FC<ISelectProps>;
|
|
20
|
-
export default Select;
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { IDropdownProps, IDropdownComposition } from './types';
|
|
3
|
-
/**
|
|
4
|
-
* Dropdown composition component. Provides several Dropdown dependant components which can be composed to create selects, multiselects or dropdowns.
|
|
5
|
-
*
|
|
6
|
-
* @component
|
|
7
|
-
* @example
|
|
8
|
-
* return (
|
|
9
|
-
* <Dropdown>
|
|
10
|
-
* <Dropdown.Label label="Wybierz link" />
|
|
11
|
-
* <Dropdown.Content>
|
|
12
|
-
* <Dropdown.List>
|
|
13
|
-
* <Dropdown.Link text="shoper.pl" href="https://shoper.pl" />
|
|
14
|
-
* <Dropdown.Link text="forum.shoper.pl" href="https://forum.shoper.pl" />
|
|
15
|
-
* <Dropdown.Link text="shoper.pl/help" href="https://shoper.pl/help" />
|
|
16
|
-
* </Dropdown.List>
|
|
17
|
-
* </Dropdown.Content>
|
|
18
|
-
* <Dropdown>
|
|
19
|
-
* )
|
|
20
|
-
*/
|
|
21
|
-
declare const Dropdown: React.FC<IDropdownProps> & IDropdownComposition;
|
|
22
|
-
export default Dropdown;
|