@entur/chip 0.4.22 → 0.4.23
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/CHANGELOG.md +4 -0
- package/dist/ActionChip.d.ts +1 -1
- package/dist/ChoiceChip.d.ts +1 -1
- package/dist/chip.cjs.development.js +63 -37
- package/dist/chip.cjs.development.js.map +1 -1
- package/dist/chip.cjs.production.min.js +1 -1
- package/dist/chip.cjs.production.min.js.map +1 -1
- package/dist/chip.esm.js +33 -10
- package/dist/chip.esm.js.map +1 -1
- package/dist/styles.css +54 -54
- package/package.json +9 -9
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,10 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [0.4.23](https://bitbucket.org/enturas/design-system/compare/@entur/chip@0.4.22...@entur/chip@0.4.23) (2022-02-09)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @entur/chip
|
|
9
|
+
|
|
6
10
|
## [0.4.22](https://bitbucket.org/enturas/design-system/compare/@entur/chip@0.4.21...@entur/chip@0.4.22) (2022-01-21)
|
|
7
11
|
|
|
8
12
|
**Note:** Version bump only for package @entur/chip
|
package/dist/ActionChip.d.ts
CHANGED
|
@@ -7,4 +7,4 @@ export declare type ActionChipProps = {
|
|
|
7
7
|
/** Ekstra klassenavn */
|
|
8
8
|
className?: string;
|
|
9
9
|
} & React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>;
|
|
10
|
-
export declare const ActionChip: React.ForwardRefExoticComponent<Pick<ActionChipProps, "
|
|
10
|
+
export declare const ActionChip: React.ForwardRefExoticComponent<Pick<ActionChipProps, "key" | keyof React.ButtonHTMLAttributes<HTMLButtonElement>> & React.RefAttributes<HTMLButtonElement>>;
|
package/dist/ChoiceChip.d.ts
CHANGED
|
@@ -13,4 +13,4 @@ export declare type ChoiceChipProps = {
|
|
|
13
13
|
/** Verdien til ChoiceChip */
|
|
14
14
|
value: string;
|
|
15
15
|
} & Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, 'value'>;
|
|
16
|
-
export declare const ChoiceChip: React.ForwardRefExoticComponent<Pick<ChoiceChipProps, "
|
|
16
|
+
export declare const ChoiceChip: React.ForwardRefExoticComponent<Pick<ChoiceChipProps, "accept" | "alt" | "autoComplete" | "autoFocus" | "capture" | "checked" | "crossOrigin" | "disabled" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "height" | "list" | "max" | "maxLength" | "min" | "minLength" | "multiple" | "name" | "pattern" | "value" | "key" | "placeholder" | "readOnly" | "required" | "size" | "src" | "step" | "type" | "width" | "onChange" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & React.RefAttributes<HTMLInputElement>>;
|
|
@@ -2,14 +2,35 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
|
|
6
|
-
|
|
7
5
|
var utils = require('@entur/utils');
|
|
8
|
-
var React =
|
|
9
|
-
var classNames =
|
|
6
|
+
var React = require('react');
|
|
7
|
+
var classNames = require('classnames');
|
|
10
8
|
var icons = require('@entur/icons');
|
|
11
9
|
var form = require('@entur/form');
|
|
12
10
|
|
|
11
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
12
|
+
|
|
13
|
+
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
14
|
+
var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
|
|
15
|
+
|
|
16
|
+
function _extends() {
|
|
17
|
+
_extends = Object.assign || function (target) {
|
|
18
|
+
for (var i = 1; i < arguments.length; i++) {
|
|
19
|
+
var source = arguments[i];
|
|
20
|
+
|
|
21
|
+
for (var key in source) {
|
|
22
|
+
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
23
|
+
target[key] = source[key];
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
return target;
|
|
29
|
+
};
|
|
30
|
+
|
|
31
|
+
return _extends.apply(this, arguments);
|
|
32
|
+
}
|
|
33
|
+
|
|
13
34
|
function _objectWithoutPropertiesLoose(source, excluded) {
|
|
14
35
|
if (source == null) return {};
|
|
15
36
|
var target = {};
|
|
@@ -25,10 +46,10 @@ function _objectWithoutPropertiesLoose(source, excluded) {
|
|
|
25
46
|
return target;
|
|
26
47
|
}
|
|
27
48
|
|
|
28
|
-
var ChoiceChipGroupContext = /*#__PURE__*/
|
|
49
|
+
var ChoiceChipGroupContext = /*#__PURE__*/React__default["default"].createContext(null);
|
|
29
50
|
var ChoiceChipGroupContextProvider = ChoiceChipGroupContext.Provider;
|
|
30
51
|
var useChoiceChipGroupContext = function useChoiceChipGroupContext() {
|
|
31
|
-
var context =
|
|
52
|
+
var context = React__default["default"].useContext(ChoiceChipGroupContext);
|
|
32
53
|
|
|
33
54
|
if (!context) {
|
|
34
55
|
throw new Error('You need to wrap your ChoiceChips in a ChoiceChipGroup-component');
|
|
@@ -37,19 +58,20 @@ var useChoiceChipGroupContext = function useChoiceChipGroupContext() {
|
|
|
37
58
|
return context;
|
|
38
59
|
};
|
|
39
60
|
|
|
40
|
-
var
|
|
61
|
+
var _excluded$4 = ["className", "children", "value", "disabled", "style"];
|
|
62
|
+
var ChoiceChip = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
|
|
41
63
|
var className = _ref.className,
|
|
42
64
|
children = _ref.children,
|
|
43
65
|
value = _ref.value,
|
|
44
66
|
_ref$disabled = _ref.disabled,
|
|
45
67
|
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
46
68
|
style = _ref.style,
|
|
47
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
69
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$4);
|
|
48
70
|
|
|
49
|
-
var childrenArray =
|
|
71
|
+
var childrenArray = React__default["default"].Children.toArray(children);
|
|
50
72
|
var hasLeadingIcon = childrenArray.length > 1 && typeof childrenArray[0] !== 'string';
|
|
51
73
|
var hasTrailingIcon = childrenArray.length > 1 && typeof childrenArray[childrenArray.length - 1] !== 'string';
|
|
52
|
-
var classList =
|
|
74
|
+
var classList = classNames__default["default"](className, 'eds-chip', {
|
|
53
75
|
'eds-chip--disabled': disabled,
|
|
54
76
|
'eds-chip--leading-icon': hasLeadingIcon,
|
|
55
77
|
'eds-chip--trailing-icon': hasTrailingIcon
|
|
@@ -60,10 +82,10 @@ var ChoiceChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
60
82
|
selectedValue = _useChoiceChipGroupCo.value,
|
|
61
83
|
onChange = _useChoiceChipGroupCo.onChange;
|
|
62
84
|
|
|
63
|
-
return
|
|
85
|
+
return React__default["default"].createElement("label", {
|
|
64
86
|
className: "eds-choice-chip",
|
|
65
87
|
style: style
|
|
66
|
-
},
|
|
88
|
+
}, React__default["default"].createElement("input", _extends({
|
|
67
89
|
className: "eds-choice-chip__input",
|
|
68
90
|
type: "radio",
|
|
69
91
|
name: name,
|
|
@@ -72,21 +94,22 @@ var ChoiceChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
72
94
|
disabled: disabled,
|
|
73
95
|
checked: selectedValue === value,
|
|
74
96
|
onChange: onChange
|
|
75
|
-
}, rest)),
|
|
97
|
+
}, rest)), React__default["default"].createElement("div", {
|
|
76
98
|
className: classList
|
|
77
99
|
}, children));
|
|
78
100
|
});
|
|
79
101
|
|
|
80
|
-
var
|
|
102
|
+
var _excluded$3 = ["children", "className"];
|
|
103
|
+
var ActionChip = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
|
|
81
104
|
var children = _ref.children,
|
|
82
105
|
className = _ref.className,
|
|
83
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
106
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
|
|
84
107
|
|
|
85
|
-
var childrenArray =
|
|
108
|
+
var childrenArray = React__default["default"].Children.toArray(children);
|
|
86
109
|
var hasLeadingIcon = childrenArray.length > 1 && typeof childrenArray[0] !== 'string';
|
|
87
110
|
var hasTrailingIcon = childrenArray.length > 1 && typeof childrenArray[childrenArray.length - 1] !== 'string';
|
|
88
|
-
return
|
|
89
|
-
className:
|
|
111
|
+
return React__default["default"].createElement("button", _extends({
|
|
112
|
+
className: classNames__default["default"]('eds-chip', 'eds-action-chip', {
|
|
90
113
|
'eds-chip--leading-icon': hasLeadingIcon,
|
|
91
114
|
'eds-chip--trailing-icon': hasTrailingIcon
|
|
92
115
|
}, className),
|
|
@@ -95,23 +118,25 @@ var ActionChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
95
118
|
}, rest), children);
|
|
96
119
|
});
|
|
97
120
|
|
|
98
|
-
var
|
|
121
|
+
var _excluded$2 = ["children", "className", "onClose"];
|
|
122
|
+
var TagChip = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
|
|
99
123
|
var children = _ref.children,
|
|
100
124
|
className = _ref.className,
|
|
101
125
|
onClose = _ref.onClose,
|
|
102
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
126
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
|
|
103
127
|
|
|
104
|
-
return
|
|
105
|
-
className:
|
|
106
|
-
}, rest), children,
|
|
128
|
+
return React__default["default"].createElement("div", _extends({
|
|
129
|
+
className: classNames__default["default"]('eds-chip', 'eds-tag-chip', className)
|
|
130
|
+
}, rest), children, React__default["default"].createElement("button", {
|
|
107
131
|
className: "eds-tag-chip__close-button",
|
|
108
132
|
type: "button",
|
|
109
133
|
onClick: onClose,
|
|
110
134
|
ref: ref
|
|
111
|
-
},
|
|
135
|
+
}, React__default["default"].createElement(icons.CloseIcon, null)));
|
|
112
136
|
});
|
|
113
137
|
|
|
114
|
-
var
|
|
138
|
+
var _excluded$1 = ["className", "children", "value", "disabled", "name", "style"];
|
|
139
|
+
var FilterChip = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
|
|
115
140
|
var className = _ref.className,
|
|
116
141
|
children = _ref.children,
|
|
117
142
|
value = _ref.value,
|
|
@@ -119,55 +144,56 @@ var FilterChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
119
144
|
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
120
145
|
name = _ref.name,
|
|
121
146
|
style = _ref.style,
|
|
122
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
147
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
|
|
123
148
|
|
|
124
|
-
var classList =
|
|
125
|
-
return
|
|
149
|
+
var classList = classNames__default["default"](className, 'eds-chip', 'eds-filter-chip');
|
|
150
|
+
return React__default["default"].createElement("label", {
|
|
126
151
|
className: classList,
|
|
127
152
|
style: style
|
|
128
|
-
},
|
|
153
|
+
}, React__default["default"].createElement("input", _extends({
|
|
129
154
|
className: "eds-filter-chip__input",
|
|
130
155
|
type: "checkbox",
|
|
131
156
|
name: name,
|
|
132
157
|
ref: ref,
|
|
133
158
|
value: value,
|
|
134
159
|
disabled: disabled
|
|
135
|
-
}, rest)),
|
|
160
|
+
}, rest)), React__default["default"].createElement("span", {
|
|
136
161
|
className: "eds-filter-chip__icon"
|
|
137
|
-
},
|
|
162
|
+
}, React__default["default"].createElement(CheckboxIcon, null)), children);
|
|
138
163
|
});
|
|
139
164
|
|
|
140
165
|
var CheckboxIcon = function CheckboxIcon() {
|
|
141
|
-
return
|
|
166
|
+
return React__default["default"].createElement("svg", {
|
|
142
167
|
className: "eds-filter-chip-icon",
|
|
143
168
|
width: "11px",
|
|
144
169
|
height: "9px",
|
|
145
170
|
viewBox: "6 11 37 33"
|
|
146
|
-
},
|
|
171
|
+
}, React__default["default"].createElement("path", {
|
|
147
172
|
className: "eds-filter-chip-icon__path",
|
|
148
173
|
d: "M14.1 27.2l7.1 7.2 14.6-14.8",
|
|
149
174
|
fill: "none"
|
|
150
175
|
}));
|
|
151
176
|
};
|
|
152
177
|
|
|
178
|
+
var _excluded = ["name", "value", "children", "onChange", "label"];
|
|
153
179
|
var ChoiceChipGroup = function ChoiceChipGroup(_ref) {
|
|
154
180
|
var name = _ref.name,
|
|
155
181
|
value = _ref.value,
|
|
156
182
|
children = _ref.children,
|
|
157
183
|
onChange = _ref.onChange,
|
|
158
184
|
label = _ref.label,
|
|
159
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
185
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
160
186
|
|
|
161
|
-
var contextValue =
|
|
187
|
+
var contextValue = React__default["default"].useMemo(function () {
|
|
162
188
|
return {
|
|
163
189
|
name: name,
|
|
164
190
|
value: value,
|
|
165
191
|
onChange: onChange
|
|
166
192
|
};
|
|
167
193
|
}, [name, value, onChange]);
|
|
168
|
-
return
|
|
194
|
+
return React__default["default"].createElement(ChoiceChipGroupContextProvider, {
|
|
169
195
|
value: contextValue
|
|
170
|
-
},
|
|
196
|
+
}, React__default["default"].createElement(form.Fieldset, _extends({
|
|
171
197
|
className: "eds-choice-chips-group",
|
|
172
198
|
label: label
|
|
173
199
|
}, rest), children));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"chip.cjs.development.js","sources":["../src/ChoiceChipGroupContext.tsx","../src/ChoiceChip.tsx","../src/ActionChip.tsx","../src/TagChip.tsx","../src/FilterChip.tsx","../src/ChoiceChipGroup.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\n\ntype ChoiceChipGroupContextProps = {\n name: string;\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n value: string | null;\n};\n\nconst ChoiceChipGroupContext =\n React.createContext<ChoiceChipGroupContextProps | null>(null);\n\nexport const ChoiceChipGroupContextProvider = ChoiceChipGroupContext.Provider;\n\nexport const useChoiceChipGroupContext: () => ChoiceChipGroupContextProps =\n () => {\n const context = React.useContext(ChoiceChipGroupContext);\n if (!context) {\n throw new Error(\n 'You need to wrap your ChoiceChips in a ChoiceChipGroup-component',\n );\n }\n return context;\n };\n","import React from 'react';\nimport cx from 'classnames';\nimport { useChoiceChipGroupContext } from './ChoiceChipGroupContext';\nimport './BaseChip.scss';\nimport './ChoiceChip.scss';\n\nexport type ChoiceChipProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Om Choicechip er deaktivert eller ikke\n * @default false\n */\n disabled?: boolean;\n /** Label til ChoiceChip */\n children?: React.ReactNode;\n /** Verdien til ChoiceChip */\n value: string;\n} & Omit<\n React.DetailedHTMLProps<\n React.InputHTMLAttributes<HTMLInputElement>,\n HTMLInputElement\n >,\n 'value'\n>;\n\nexport const ChoiceChip = React.forwardRef<HTMLInputElement, ChoiceChipProps>(\n (\n { className, children, value, disabled = false, style, ...rest },\n ref: React.Ref<HTMLInputElement>,\n ) => {\n const childrenArray = React.Children.toArray(children);\n const hasLeadingIcon =\n childrenArray.length > 1 && typeof childrenArray[0] !== 'string';\n const hasTrailingIcon =\n childrenArray.length > 1 &&\n typeof childrenArray[childrenArray.length - 1] !== 'string';\n\n const classList = cx(className, 'eds-chip', {\n 'eds-chip--disabled': disabled,\n 'eds-chip--leading-icon': hasLeadingIcon,\n 'eds-chip--trailing-icon': hasTrailingIcon,\n });\n const {\n name,\n value: selectedValue,\n onChange,\n } = useChoiceChipGroupContext();\n return (\n <label className=\"eds-choice-chip\" style={style}>\n <input\n className=\"eds-choice-chip__input\"\n type=\"radio\"\n name={name}\n ref={ref}\n value={value}\n disabled={disabled}\n checked={selectedValue === value}\n onChange={onChange}\n {...rest}\n />\n <div className={classList}>{children}</div>\n </label>\n );\n },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport './BaseChip.scss';\nimport './ActionChip.scss';\n\nexport type ActionChipProps = {\n /** Teksten som vises i ActionChip */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n} & React.DetailedHTMLProps<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n HTMLButtonElement\n>;\n\nexport const ActionChip = React.forwardRef<HTMLButtonElement, ActionChipProps>(\n ({ children, className, ...rest }, ref: React.Ref<HTMLButtonElement>) => {\n const childrenArray = React.Children.toArray(children);\n const hasLeadingIcon =\n childrenArray.length > 1 && typeof childrenArray[0] !== 'string';\n const hasTrailingIcon =\n childrenArray.length > 1 &&\n typeof childrenArray[childrenArray.length - 1] !== 'string';\n\n return (\n <button\n className={classNames(\n 'eds-chip',\n 'eds-action-chip',\n {\n 'eds-chip--leading-icon': hasLeadingIcon,\n 'eds-chip--trailing-icon': hasTrailingIcon,\n },\n className,\n )}\n ref={ref}\n type=\"button\"\n {...rest}\n >\n {children}\n </button>\n );\n },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { CloseIcon } from '@entur/icons';\nimport './BaseChip.scss';\nimport './TagChip.scss';\n\nexport type TagChipProps = {\n /** Teksten som vises i TagChip */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Callback for når man klikker på krysset */\n onClose: () => void;\n};\n\nexport const TagChip = React.forwardRef<HTMLButtonElement, TagChipProps>(\n (\n { children, className, onClose, ...rest },\n ref: React.Ref<HTMLButtonElement>,\n ) => {\n return (\n <div\n className={classNames('eds-chip', 'eds-tag-chip', className)}\n {...rest}\n >\n {children}\n <button\n className=\"eds-tag-chip__close-button\"\n type=\"button\"\n onClick={onClose}\n ref={ref}\n >\n <CloseIcon />\n </button>\n </div>\n );\n },\n);\n","import React from 'react';\nimport cx from 'classnames';\nimport './BaseChip.scss';\nimport './FilterChip.scss';\n\nexport type FilterChipProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Label til FilterChip */\n children?: React.ReactNode;\n /** Verdien til FilterChip */\n value: string;\n} & React.InputHTMLAttributes<HTMLInputElement>;\n\nexport const FilterChip = React.forwardRef<HTMLInputElement, FilterChipProps>(\n (\n { className, children, value, disabled = false, name, style, ...rest },\n ref: React.Ref<HTMLInputElement>,\n ) => {\n const classList = cx(className, 'eds-chip', 'eds-filter-chip');\n\n return (\n <label className={classList} style={style}>\n <input\n className=\"eds-filter-chip__input\"\n type=\"checkbox\"\n name={name}\n ref={ref}\n value={value}\n disabled={disabled}\n {...rest}\n />\n <span className=\"eds-filter-chip__icon\">\n <CheckboxIcon />\n </span>\n {children}\n </label>\n );\n },\n);\n\nconst CheckboxIcon: React.FC = () => {\n return (\n <svg\n className=\"eds-filter-chip-icon\"\n width=\"11px\"\n height=\"9px\"\n viewBox=\"6 11 37 33\"\n >\n <path\n className=\"eds-filter-chip-icon__path\"\n d=\"M14.1 27.2l7.1 7.2 14.6-14.8\"\n fill=\"none\"\n />\n </svg>\n );\n};\n","import React from 'react';\nimport { ChoiceChipGroupContextProvider } from './ChoiceChipGroupContext';\nimport { Fieldset } from '@entur/form';\nexport type ChoiceChipGroupProps = {\n /** Navnet til ChoiceChipsGroup */\n name: string;\n /** Verdien til den valgte ChoiceChipen */\n value: string | null;\n /** ChoiceChip-komponentene sendes inn som children */\n children: React.ReactNode;\n /** En callback som blir kalles hver gang en ChoiceChip klikkes på */\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n /** Labelen til ChoiceChip-gruppen. */\n label?: React.ReactNode;\n [key: string]: any;\n};\n\nexport const ChoiceChipGroup: React.FC<ChoiceChipGroupProps> = ({\n name,\n value,\n children,\n onChange,\n label,\n ...rest\n}) => {\n const contextValue = React.useMemo(() => ({ name, value, onChange }), [\n name,\n value,\n onChange,\n ]);\n return (\n <ChoiceChipGroupContextProvider value={contextValue}>\n <Fieldset className=\"eds-choice-chips-group\" label={label} {...rest}>\n {children}\n </Fieldset>\n </ChoiceChipGroupContextProvider>\n );\n};\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('chip', 'form');\n\nexport * from './ChoiceChip';\nexport * from './ActionChip';\nexport * from './TagChip';\nexport * from './FilterChip';\nexport * from './ChoiceChipGroup';\n"],"names":["ChoiceChipGroupContext","React","createContext","ChoiceChipGroupContextProvider","Provider","useChoiceChipGroupContext","context","useContext","Error","ChoiceChip","forwardRef","ref","className","children","value","disabled","style","rest","childrenArray","Children","toArray","hasLeadingIcon","length","hasTrailingIcon","classList","cx","name","selectedValue","onChange","type","checked","ActionChip","classNames","TagChip","onClose","onClick","CloseIcon","FilterChip","CheckboxIcon","width","height","viewBox","d","fill","ChoiceChipGroup","label","contextValue","useMemo","Fieldset","warnAboutMissingStyles"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"chip.cjs.development.js","sources":["../src/ChoiceChipGroupContext.tsx","../src/ChoiceChip.tsx","../src/ActionChip.tsx","../src/TagChip.tsx","../src/FilterChip.tsx","../src/ChoiceChipGroup.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\n\ntype ChoiceChipGroupContextProps = {\n name: string;\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n value: string | null;\n};\n\nconst ChoiceChipGroupContext =\n React.createContext<ChoiceChipGroupContextProps | null>(null);\n\nexport const ChoiceChipGroupContextProvider = ChoiceChipGroupContext.Provider;\n\nexport const useChoiceChipGroupContext: () => ChoiceChipGroupContextProps =\n () => {\n const context = React.useContext(ChoiceChipGroupContext);\n if (!context) {\n throw new Error(\n 'You need to wrap your ChoiceChips in a ChoiceChipGroup-component',\n );\n }\n return context;\n };\n","import React from 'react';\nimport cx from 'classnames';\nimport { useChoiceChipGroupContext } from './ChoiceChipGroupContext';\nimport './BaseChip.scss';\nimport './ChoiceChip.scss';\n\nexport type ChoiceChipProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Om Choicechip er deaktivert eller ikke\n * @default false\n */\n disabled?: boolean;\n /** Label til ChoiceChip */\n children?: React.ReactNode;\n /** Verdien til ChoiceChip */\n value: string;\n} & Omit<\n React.DetailedHTMLProps<\n React.InputHTMLAttributes<HTMLInputElement>,\n HTMLInputElement\n >,\n 'value'\n>;\n\nexport const ChoiceChip = React.forwardRef<HTMLInputElement, ChoiceChipProps>(\n (\n { className, children, value, disabled = false, style, ...rest },\n ref: React.Ref<HTMLInputElement>,\n ) => {\n const childrenArray = React.Children.toArray(children);\n const hasLeadingIcon =\n childrenArray.length > 1 && typeof childrenArray[0] !== 'string';\n const hasTrailingIcon =\n childrenArray.length > 1 &&\n typeof childrenArray[childrenArray.length - 1] !== 'string';\n\n const classList = cx(className, 'eds-chip', {\n 'eds-chip--disabled': disabled,\n 'eds-chip--leading-icon': hasLeadingIcon,\n 'eds-chip--trailing-icon': hasTrailingIcon,\n });\n const {\n name,\n value: selectedValue,\n onChange,\n } = useChoiceChipGroupContext();\n return (\n <label className=\"eds-choice-chip\" style={style}>\n <input\n className=\"eds-choice-chip__input\"\n type=\"radio\"\n name={name}\n ref={ref}\n value={value}\n disabled={disabled}\n checked={selectedValue === value}\n onChange={onChange}\n {...rest}\n />\n <div className={classList}>{children}</div>\n </label>\n );\n },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport './BaseChip.scss';\nimport './ActionChip.scss';\n\nexport type ActionChipProps = {\n /** Teksten som vises i ActionChip */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n} & React.DetailedHTMLProps<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n HTMLButtonElement\n>;\n\nexport const ActionChip = React.forwardRef<HTMLButtonElement, ActionChipProps>(\n ({ children, className, ...rest }, ref: React.Ref<HTMLButtonElement>) => {\n const childrenArray = React.Children.toArray(children);\n const hasLeadingIcon =\n childrenArray.length > 1 && typeof childrenArray[0] !== 'string';\n const hasTrailingIcon =\n childrenArray.length > 1 &&\n typeof childrenArray[childrenArray.length - 1] !== 'string';\n\n return (\n <button\n className={classNames(\n 'eds-chip',\n 'eds-action-chip',\n {\n 'eds-chip--leading-icon': hasLeadingIcon,\n 'eds-chip--trailing-icon': hasTrailingIcon,\n },\n className,\n )}\n ref={ref}\n type=\"button\"\n {...rest}\n >\n {children}\n </button>\n );\n },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { CloseIcon } from '@entur/icons';\nimport './BaseChip.scss';\nimport './TagChip.scss';\n\nexport type TagChipProps = {\n /** Teksten som vises i TagChip */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Callback for når man klikker på krysset */\n onClose: () => void;\n};\n\nexport const TagChip = React.forwardRef<HTMLButtonElement, TagChipProps>(\n (\n { children, className, onClose, ...rest },\n ref: React.Ref<HTMLButtonElement>,\n ) => {\n return (\n <div\n className={classNames('eds-chip', 'eds-tag-chip', className)}\n {...rest}\n >\n {children}\n <button\n className=\"eds-tag-chip__close-button\"\n type=\"button\"\n onClick={onClose}\n ref={ref}\n >\n <CloseIcon />\n </button>\n </div>\n );\n },\n);\n","import React from 'react';\nimport cx from 'classnames';\nimport './BaseChip.scss';\nimport './FilterChip.scss';\n\nexport type FilterChipProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Label til FilterChip */\n children?: React.ReactNode;\n /** Verdien til FilterChip */\n value: string;\n} & React.InputHTMLAttributes<HTMLInputElement>;\n\nexport const FilterChip = React.forwardRef<HTMLInputElement, FilterChipProps>(\n (\n { className, children, value, disabled = false, name, style, ...rest },\n ref: React.Ref<HTMLInputElement>,\n ) => {\n const classList = cx(className, 'eds-chip', 'eds-filter-chip');\n\n return (\n <label className={classList} style={style}>\n <input\n className=\"eds-filter-chip__input\"\n type=\"checkbox\"\n name={name}\n ref={ref}\n value={value}\n disabled={disabled}\n {...rest}\n />\n <span className=\"eds-filter-chip__icon\">\n <CheckboxIcon />\n </span>\n {children}\n </label>\n );\n },\n);\n\nconst CheckboxIcon: React.FC = () => {\n return (\n <svg\n className=\"eds-filter-chip-icon\"\n width=\"11px\"\n height=\"9px\"\n viewBox=\"6 11 37 33\"\n >\n <path\n className=\"eds-filter-chip-icon__path\"\n d=\"M14.1 27.2l7.1 7.2 14.6-14.8\"\n fill=\"none\"\n />\n </svg>\n );\n};\n","import React from 'react';\nimport { ChoiceChipGroupContextProvider } from './ChoiceChipGroupContext';\nimport { Fieldset } from '@entur/form';\nexport type ChoiceChipGroupProps = {\n /** Navnet til ChoiceChipsGroup */\n name: string;\n /** Verdien til den valgte ChoiceChipen */\n value: string | null;\n /** ChoiceChip-komponentene sendes inn som children */\n children: React.ReactNode;\n /** En callback som blir kalles hver gang en ChoiceChip klikkes på */\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n /** Labelen til ChoiceChip-gruppen. */\n label?: React.ReactNode;\n [key: string]: any;\n};\n\nexport const ChoiceChipGroup: React.FC<ChoiceChipGroupProps> = ({\n name,\n value,\n children,\n onChange,\n label,\n ...rest\n}) => {\n const contextValue = React.useMemo(() => ({ name, value, onChange }), [\n name,\n value,\n onChange,\n ]);\n return (\n <ChoiceChipGroupContextProvider value={contextValue}>\n <Fieldset className=\"eds-choice-chips-group\" label={label} {...rest}>\n {children}\n </Fieldset>\n </ChoiceChipGroupContextProvider>\n );\n};\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('chip', 'form');\n\nexport * from './ChoiceChip';\nexport * from './ActionChip';\nexport * from './TagChip';\nexport * from './FilterChip';\nexport * from './ChoiceChipGroup';\n"],"names":["ChoiceChipGroupContext","React","createContext","ChoiceChipGroupContextProvider","Provider","useChoiceChipGroupContext","context","useContext","Error","ChoiceChip","forwardRef","ref","className","children","value","disabled","style","rest","childrenArray","Children","toArray","hasLeadingIcon","length","hasTrailingIcon","classList","cx","name","selectedValue","onChange","type","checked","ActionChip","classNames","TagChip","onClose","onClick","CloseIcon","FilterChip","CheckboxIcon","width","height","viewBox","d","fill","ChoiceChipGroup","label","contextValue","useMemo","Fieldset","warnAboutMissingStyles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,IAAMA,sBAAsB,gBAC1BC,yBAAK,CAACC,aAAN,CAAwD,IAAxD,CADF;AAGO,IAAMC,8BAA8B,GAAGH,sBAAsB,CAACI,QAA9D;AAEA,IAAMC,yBAAyB,GACpC,SADWA,yBACX;AACE,MAAMC,OAAO,GAAGL,yBAAK,CAACM,UAAN,CAAiBP,sBAAjB,CAAhB;;AACA,MAAI,CAACM,OAAL,EAAc;AACZ,UAAM,IAAIE,KAAJ,CACJ,kEADI,CAAN;AAGD;;AACD,SAAOF,OAAP;AACD,CATI;;;ICYMG,UAAU,gBAAGR,yBAAK,CAACS,UAAN,CACxB,gBAEEC,GAFF;MACIC,iBAAAA;MAAWC,gBAAAA;MAAUC,aAAAA;2BAAOC;MAAAA,sCAAW;MAAOC,aAAAA;MAAUC;;AAG1D,MAAMC,aAAa,GAAGjB,yBAAK,CAACkB,QAAN,CAAeC,OAAf,CAAuBP,QAAvB,CAAtB;AACA,MAAMQ,cAAc,GAClBH,aAAa,CAACI,MAAd,GAAuB,CAAvB,IAA4B,OAAOJ,aAAa,CAAC,CAAD,CAApB,KAA4B,QAD1D;AAEA,MAAMK,eAAe,GACnBL,aAAa,CAACI,MAAd,GAAuB,CAAvB,IACA,OAAOJ,aAAa,CAACA,aAAa,CAACI,MAAd,GAAuB,CAAxB,CAApB,KAAmD,QAFrD;AAIA,MAAME,SAAS,GAAGC,8BAAE,CAACb,SAAD,EAAY,UAAZ,EAAwB;AAC1C,0BAAsBG,QADoB;AAE1C,8BAA0BM,cAFgB;AAG1C,+BAA2BE;AAHe,GAAxB,CAApB;;AAKA,8BAIIlB,yBAAyB,EAJ7B;AAAA,MACEqB,IADF,yBACEA,IADF;AAAA,MAESC,aAFT,yBAEEb,KAFF;AAAA,MAGEc,QAHF,yBAGEA,QAHF;;AAKA,SACE3B,uCAAA,QAAA;AAAOW,IAAAA,SAAS,EAAC;AAAkBI,IAAAA,KAAK,EAAEA;GAA1C,EACEf,uCAAA,QAAA;AACEW,IAAAA,SAAS,EAAC,wBADZ;AAEEiB,IAAAA,IAAI,EAAC,OAFP;AAGEH,IAAAA,IAAI,EAAEA,IAHR;AAIEf,IAAAA,GAAG,EAAEA,GAJP;AAKEG,IAAAA,KAAK,EAAEA,KALT;AAMEC,IAAAA,QAAQ,EAAEA,QANZ;AAOEe,IAAAA,OAAO,EAAEH,aAAa,KAAKb,KAP7B;AAQEc,IAAAA,QAAQ,EAAEA;AARZ,KASMX,IATN,EADF,EAYEhB,uCAAA,MAAA;AAAKW,IAAAA,SAAS,EAAEY;GAAhB,EAA4BX,QAA5B,CAZF,CADF;AAgBD,CAtCuB;;;ICVbkB,UAAU,gBAAG9B,yBAAK,CAACS,UAAN,CACxB,gBAAmCC,GAAnC;MAAGE,gBAAAA;MAAUD,iBAAAA;MAAcK;;AACzB,MAAMC,aAAa,GAAGjB,yBAAK,CAACkB,QAAN,CAAeC,OAAf,CAAuBP,QAAvB,CAAtB;AACA,MAAMQ,cAAc,GAClBH,aAAa,CAACI,MAAd,GAAuB,CAAvB,IAA4B,OAAOJ,aAAa,CAAC,CAAD,CAApB,KAA4B,QAD1D;AAEA,MAAMK,eAAe,GACnBL,aAAa,CAACI,MAAd,GAAuB,CAAvB,IACA,OAAOJ,aAAa,CAACA,aAAa,CAACI,MAAd,GAAuB,CAAxB,CAApB,KAAmD,QAFrD;AAIA,SACErB,uCAAA,SAAA;AACEW,IAAAA,SAAS,EAAEoB,8BAAU,CACnB,UADmB,EAEnB,iBAFmB,EAGnB;AACE,gCAA0BX,cAD5B;AAEE,iCAA2BE;AAF7B,KAHmB,EAOnBX,SAPmB,CADvB;AAUED,IAAAA,GAAG,EAAEA,GAVP;AAWEkB,IAAAA,IAAI,EAAC;AAXP,KAYMZ,IAZN,GAcGJ,QAdH,CADF;AAkBD,CA3BuB;;;ICAboB,OAAO,gBAAGhC,yBAAK,CAACS,UAAN,CACrB,gBAEEC,GAFF;MACIE,gBAAAA;MAAUD,iBAAAA;MAAWsB,eAAAA;MAAYjB;;AAGnC,SACEhB,uCAAA,MAAA;AACEW,IAAAA,SAAS,EAAEoB,8BAAU,CAAC,UAAD,EAAa,cAAb,EAA6BpB,SAA7B;AADvB,KAEMK,IAFN,GAIGJ,QAJH,EAKEZ,uCAAA,SAAA;AACEW,IAAAA,SAAS,EAAC;AACViB,IAAAA,IAAI,EAAC;AACLM,IAAAA,OAAO,EAAED;AACTvB,IAAAA,GAAG,EAAEA;GAJP,EAMEV,uCAAA,CAACmC,eAAD,MAAA,CANF,CALF,CADF;AAgBD,CArBoB;;;ICDVC,UAAU,gBAAGpC,yBAAK,CAACS,UAAN,CACxB,gBAEEC,GAFF;MACIC,iBAAAA;MAAWC,gBAAAA;MAAUC,aAAAA;2BAAOC;MAAAA,sCAAW;MAAOW,YAAAA;MAAMV,aAAAA;MAAUC;;AAGhE,MAAMO,SAAS,GAAGC,8BAAE,CAACb,SAAD,EAAY,UAAZ,EAAwB,iBAAxB,CAApB;AAEA,SACEX,uCAAA,QAAA;AAAOW,IAAAA,SAAS,EAAEY;AAAWR,IAAAA,KAAK,EAAEA;GAApC,EACEf,uCAAA,QAAA;AACEW,IAAAA,SAAS,EAAC,wBADZ;AAEEiB,IAAAA,IAAI,EAAC,UAFP;AAGEH,IAAAA,IAAI,EAAEA,IAHR;AAIEf,IAAAA,GAAG,EAAEA,GAJP;AAKEG,IAAAA,KAAK,EAAEA,KALT;AAMEC,IAAAA,QAAQ,EAAEA;AANZ,KAOME,IAPN,EADF,EAUEhB,uCAAA,OAAA;AAAMW,IAAAA,SAAS,EAAC;GAAhB,EACEX,uCAAA,CAACqC,YAAD,MAAA,CADF,CAVF,EAaGzB,QAbH,CADF;AAiBD,CAxBuB;;AA2B1B,IAAMyB,YAAY,GAAa,SAAzBA,YAAyB;AAC7B,SACErC,uCAAA,MAAA;AACEW,IAAAA,SAAS,EAAC;AACV2B,IAAAA,KAAK,EAAC;AACNC,IAAAA,MAAM,EAAC;AACPC,IAAAA,OAAO,EAAC;GAJV,EAMExC,uCAAA,OAAA;AACEW,IAAAA,SAAS,EAAC;AACV8B,IAAAA,CAAC,EAAC;AACFC,IAAAA,IAAI,EAAC;GAHP,CANF,CADF;AAcD,CAfD;;;ICxBaC,eAAe,GAAmC,SAAlDA,eAAkD;MAC7DlB,YAAAA;MACAZ,aAAAA;MACAD,gBAAAA;MACAe,gBAAAA;MACAiB,aAAAA;MACG5B;;AAEH,MAAM6B,YAAY,GAAG7C,yBAAK,CAAC8C,OAAN,CAAc;AAAA,WAAO;AAAErB,MAAAA,IAAI,EAAJA,IAAF;AAAQZ,MAAAA,KAAK,EAALA,KAAR;AAAec,MAAAA,QAAQ,EAARA;AAAf,KAAP;AAAA,GAAd,EAAiD,CACpEF,IADoE,EAEpEZ,KAFoE,EAGpEc,QAHoE,CAAjD,CAArB;AAKA,SACE3B,uCAAA,CAACE,8BAAD;AAAgCW,IAAAA,KAAK,EAAEgC;GAAvC,EACE7C,uCAAA,CAAC+C,aAAD;AAAUpC,IAAAA,SAAS,EAAC,wBAApB;AAA6CiC,IAAAA,KAAK,EAAEA;AAApD,KAA+D5B,IAA/D,GACGJ,QADH,CADF,CADF;AAOD;;AClCDoC,4BAAsB,CAAC,MAAD,EAAS,MAAT,CAAtB;;;;;;;;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@entur/utils"),t=require("react"),a=require("classnames"),l=require("@entur/icons"),n=require("@entur/form");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i=r(t),c=r(a);function s(){return s=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var l in a)Object.prototype.hasOwnProperty.call(a,l)&&(e[l]=a[l])}return e},s.apply(this,arguments)}function u(e,t){if(null==e)return{};var a,l,n={},r=Object.keys(e);for(l=0;l<r.length;l++)t.indexOf(a=r[l])>=0||(n[a]=e[a]);return n}var d=i.default.createContext(null),o=d.Provider,f=["className","children","value","disabled","style"],h=i.default.forwardRef((function(e,t){var a=e.className,l=e.children,n=e.value,r=e.disabled,o=void 0!==r&&r,h=e.style,p=u(e,f),m=i.default.Children.toArray(l),v=c.default(a,"eds-chip",{"eds-chip--disabled":o,"eds-chip--leading-icon":m.length>1&&"string"!=typeof m[0],"eds-chip--trailing-icon":m.length>1&&"string"!=typeof m[m.length-1]}),g=function(){var e=i.default.useContext(d);if(!e)throw new Error("You need to wrap your ChoiceChips in a ChoiceChipGroup-component");return e}();return i.default.createElement("label",{className:"eds-choice-chip",style:h},i.default.createElement("input",s({className:"eds-choice-chip__input",type:"radio",name:g.name,ref:t,value:n,disabled:o,checked:g.value===n,onChange:g.onChange},p)),i.default.createElement("div",{className:v},l))})),p=["children","className"],m=i.default.forwardRef((function(e,t){var a=e.children,l=e.className,n=u(e,p),r=i.default.Children.toArray(a);return i.default.createElement("button",s({className:c.default("eds-chip","eds-action-chip",{"eds-chip--leading-icon":r.length>1&&"string"!=typeof r[0],"eds-chip--trailing-icon":r.length>1&&"string"!=typeof r[r.length-1]},l),ref:t,type:"button"},n),a)})),v=["children","className","onClose"],g=i.default.forwardRef((function(e,t){var a=e.children,n=e.className,r=e.onClose,d=u(e,v);return i.default.createElement("div",s({className:c.default("eds-chip","eds-tag-chip",n)},d),a,i.default.createElement("button",{className:"eds-tag-chip__close-button",type:"button",onClick:r,ref:t},i.default.createElement(l.CloseIcon,null)))})),b=["className","children","value","disabled","name","style"],y=i.default.forwardRef((function(e,t){var a=e.className,l=e.children,n=e.value,r=e.disabled,d=void 0!==r&&r,o=e.name,f=e.style,h=u(e,b),p=c.default(a,"eds-chip","eds-filter-chip");return i.default.createElement("label",{className:p,style:f},i.default.createElement("input",s({className:"eds-filter-chip__input",type:"checkbox",name:o,ref:t,value:n,disabled:d},h)),i.default.createElement("span",{className:"eds-filter-chip__icon"},i.default.createElement(C,null)),l)})),C=function(){return i.default.createElement("svg",{className:"eds-filter-chip-icon",width:"11px",height:"9px",viewBox:"6 11 37 33"},i.default.createElement("path",{className:"eds-filter-chip-icon__path",d:"M14.1 27.2l7.1 7.2 14.6-14.8",fill:"none"}))},N=["name","value","children","onChange","label"];e.warnAboutMissingStyles("chip","form"),exports.ActionChip=m,exports.ChoiceChip=h,exports.ChoiceChipGroup=function(e){var t=e.name,a=e.value,l=e.children,r=e.onChange,c=e.label,d=u(e,N),f=i.default.useMemo((function(){return{name:t,value:a,onChange:r}}),[t,a,r]);return i.default.createElement(o,{value:f},i.default.createElement(n.Fieldset,s({className:"eds-choice-chips-group",label:c},d),l))},exports.FilterChip=y,exports.TagChip=g;
|
|
2
2
|
//# sourceMappingURL=chip.cjs.production.min.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"chip.cjs.production.min.js","sources":["../src/ChoiceChipGroupContext.tsx","../src/ChoiceChip.tsx","../src/ActionChip.tsx","../src/TagChip.tsx","../src/FilterChip.tsx","../src/index.tsx","../src/ChoiceChipGroup.tsx"],"sourcesContent":["import React from 'react';\n\ntype ChoiceChipGroupContextProps = {\n name: string;\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n value: string | null;\n};\n\nconst ChoiceChipGroupContext =\n React.createContext<ChoiceChipGroupContextProps | null>(null);\n\nexport const ChoiceChipGroupContextProvider = ChoiceChipGroupContext.Provider;\n\nexport const useChoiceChipGroupContext: () => ChoiceChipGroupContextProps =\n () => {\n const context = React.useContext(ChoiceChipGroupContext);\n if (!context) {\n throw new Error(\n 'You need to wrap your ChoiceChips in a ChoiceChipGroup-component',\n );\n }\n return context;\n };\n","import React from 'react';\nimport cx from 'classnames';\nimport { useChoiceChipGroupContext } from './ChoiceChipGroupContext';\nimport './BaseChip.scss';\nimport './ChoiceChip.scss';\n\nexport type ChoiceChipProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Om Choicechip er deaktivert eller ikke\n * @default false\n */\n disabled?: boolean;\n /** Label til ChoiceChip */\n children?: React.ReactNode;\n /** Verdien til ChoiceChip */\n value: string;\n} & Omit<\n React.DetailedHTMLProps<\n React.InputHTMLAttributes<HTMLInputElement>,\n HTMLInputElement\n >,\n 'value'\n>;\n\nexport const ChoiceChip = React.forwardRef<HTMLInputElement, ChoiceChipProps>(\n (\n { className, children, value, disabled = false, style, ...rest },\n ref: React.Ref<HTMLInputElement>,\n ) => {\n const childrenArray = React.Children.toArray(children);\n const hasLeadingIcon =\n childrenArray.length > 1 && typeof childrenArray[0] !== 'string';\n const hasTrailingIcon =\n childrenArray.length > 1 &&\n typeof childrenArray[childrenArray.length - 1] !== 'string';\n\n const classList = cx(className, 'eds-chip', {\n 'eds-chip--disabled': disabled,\n 'eds-chip--leading-icon': hasLeadingIcon,\n 'eds-chip--trailing-icon': hasTrailingIcon,\n });\n const {\n name,\n value: selectedValue,\n onChange,\n } = useChoiceChipGroupContext();\n return (\n <label className=\"eds-choice-chip\" style={style}>\n <input\n className=\"eds-choice-chip__input\"\n type=\"radio\"\n name={name}\n ref={ref}\n value={value}\n disabled={disabled}\n checked={selectedValue === value}\n onChange={onChange}\n {...rest}\n />\n <div className={classList}>{children}</div>\n </label>\n );\n },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport './BaseChip.scss';\nimport './ActionChip.scss';\n\nexport type ActionChipProps = {\n /** Teksten som vises i ActionChip */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n} & React.DetailedHTMLProps<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n HTMLButtonElement\n>;\n\nexport const ActionChip = React.forwardRef<HTMLButtonElement, ActionChipProps>(\n ({ children, className, ...rest }, ref: React.Ref<HTMLButtonElement>) => {\n const childrenArray = React.Children.toArray(children);\n const hasLeadingIcon =\n childrenArray.length > 1 && typeof childrenArray[0] !== 'string';\n const hasTrailingIcon =\n childrenArray.length > 1 &&\n typeof childrenArray[childrenArray.length - 1] !== 'string';\n\n return (\n <button\n className={classNames(\n 'eds-chip',\n 'eds-action-chip',\n {\n 'eds-chip--leading-icon': hasLeadingIcon,\n 'eds-chip--trailing-icon': hasTrailingIcon,\n },\n className,\n )}\n ref={ref}\n type=\"button\"\n {...rest}\n >\n {children}\n </button>\n );\n },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { CloseIcon } from '@entur/icons';\nimport './BaseChip.scss';\nimport './TagChip.scss';\n\nexport type TagChipProps = {\n /** Teksten som vises i TagChip */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Callback for når man klikker på krysset */\n onClose: () => void;\n};\n\nexport const TagChip = React.forwardRef<HTMLButtonElement, TagChipProps>(\n (\n { children, className, onClose, ...rest },\n ref: React.Ref<HTMLButtonElement>,\n ) => {\n return (\n <div\n className={classNames('eds-chip', 'eds-tag-chip', className)}\n {...rest}\n >\n {children}\n <button\n className=\"eds-tag-chip__close-button\"\n type=\"button\"\n onClick={onClose}\n ref={ref}\n >\n <CloseIcon />\n </button>\n </div>\n );\n },\n);\n","import React from 'react';\nimport cx from 'classnames';\nimport './BaseChip.scss';\nimport './FilterChip.scss';\n\nexport type FilterChipProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Label til FilterChip */\n children?: React.ReactNode;\n /** Verdien til FilterChip */\n value: string;\n} & React.InputHTMLAttributes<HTMLInputElement>;\n\nexport const FilterChip = React.forwardRef<HTMLInputElement, FilterChipProps>(\n (\n { className, children, value, disabled = false, name, style, ...rest },\n ref: React.Ref<HTMLInputElement>,\n ) => {\n const classList = cx(className, 'eds-chip', 'eds-filter-chip');\n\n return (\n <label className={classList} style={style}>\n <input\n className=\"eds-filter-chip__input\"\n type=\"checkbox\"\n name={name}\n ref={ref}\n value={value}\n disabled={disabled}\n {...rest}\n />\n <span className=\"eds-filter-chip__icon\">\n <CheckboxIcon />\n </span>\n {children}\n </label>\n );\n },\n);\n\nconst CheckboxIcon: React.FC = () => {\n return (\n <svg\n className=\"eds-filter-chip-icon\"\n width=\"11px\"\n height=\"9px\"\n viewBox=\"6 11 37 33\"\n >\n <path\n className=\"eds-filter-chip-icon__path\"\n d=\"M14.1 27.2l7.1 7.2 14.6-14.8\"\n fill=\"none\"\n />\n </svg>\n );\n};\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('chip', 'form');\n\nexport * from './ChoiceChip';\nexport * from './ActionChip';\nexport * from './TagChip';\nexport * from './FilterChip';\nexport * from './ChoiceChipGroup';\n","import React from 'react';\nimport { ChoiceChipGroupContextProvider } from './ChoiceChipGroupContext';\nimport { Fieldset } from '@entur/form';\nexport type ChoiceChipGroupProps = {\n /** Navnet til ChoiceChipsGroup */\n name: string;\n /** Verdien til den valgte ChoiceChipen */\n value: string | null;\n /** ChoiceChip-komponentene sendes inn som children */\n children: React.ReactNode;\n /** En callback som blir kalles hver gang en ChoiceChip klikkes på */\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n /** Labelen til ChoiceChip-gruppen. */\n label?: React.ReactNode;\n [key: string]: any;\n};\n\nexport const ChoiceChipGroup: React.FC<ChoiceChipGroupProps> = ({\n name,\n value,\n children,\n onChange,\n label,\n ...rest\n}) => {\n const contextValue = React.useMemo(() => ({ name, value, onChange }), [\n name,\n value,\n onChange,\n ]);\n return (\n <ChoiceChipGroupContextProvider value={contextValue}>\n <Fieldset className=\"eds-choice-chips-group\" label={label} {...rest}>\n {children}\n </Fieldset>\n </ChoiceChipGroupContextProvider>\n );\n};\n"],"names":["ChoiceChipGroupContext","React","createContext","ChoiceChipGroupContextProvider","Provider","ChoiceChip","forwardRef","ref","className","children","value","disabled","style","rest","childrenArray","Children","toArray","classList","cx","length","context","useContext","Error","useChoiceChipGroupContext","type","name","checked","onChange","ActionChip","classNames","TagChip","onClose","onClick","CloseIcon","FilterChip","CheckboxIcon","width","height","viewBox","d","fill","warnAboutMissingStyles","label","contextValue","useMemo","Fieldset"],"mappings":"gZAQA,IAAMA,EACJC,EAAMC,cAAkD,MAE7CC,EAAiCH,EAAuBI,SCcxDC,EAAaJ,EAAMK,YAC9B,WAEEC,OADEC,IAAAA,UAAWC,IAAAA,SAAUC,IAAAA,UAAOC,SAAAA,gBAAkBC,IAAAA,MAAUC,2DAGpDC,EAAgBb,EAAMc,SAASC,QAAQP,GAOvCQ,EAAYC,EAAGV,EAAW,WAAY,sBACpBG,2BANtBG,EAAcK,OAAS,GAAiC,iBAArBL,EAAc,6BAEjDA,EAAcK,OAAS,GAC4B,iBAA5CL,EAAcA,EAAcK,OAAS,ODrBhD,eACQC,EAAUnB,EAAMoB,WAAWrB,OAC5BoB,QACG,IAAIE,MACR,2EAGGF,ECyBHG,UAEFtB,yBAAOO,UAAU,kBAAkBI,MAAOA,GACxCX,uCACEO,UAAU,yBACVgB,KAAK,QACLC,OATJA,KAUIlB,IAAKA,EACLG,MAAOA,EACPC,SAAUA,EACVe,UAZJhB,QAY+BA,EAC3BiB,WAZJA,UAaQd,IAENZ,uBAAKO,UAAWS,GAAYR,OC7CvBmB,EAAa3B,EAAMK,YAC9B,WAAmCC,OAAhCE,IAAAA,SAAUD,IAAAA,UAAcK,gCACnBC,EAAgBb,EAAMc,SAASC,QAAQP,UAQ3CR,wCACEO,UAAWqB,EACT,WACA,kBACA,0BAVJf,EAAcK,OAAS,GAAiC,iBAArBL,EAAc,6BAEjDA,EAAcK,OAAS,GAC4B,iBAA5CL,EAAcA,EAAcK,OAAS,IAWxCX,GAEFD,IAAKA,EACLiB,KAAK,UACDX,GAEHJ,MCxBIqB,EAAU7B,EAAMK,YAC3B,WAEEC,OADEE,IAAAA,SAAUD,IAAAA,UAAWuB,IAAAA,QAAYlB,iDAIjCZ,qCACEO,UAAWqB,EAAW,WAAY,eAAgBrB,IAC9CK,GAEHJ,EACDR,0BACEO,UAAU,6BACVgB,KAAK,SACLQ,QAASD,EACTxB,IAAKA,GAELN,gBAACgC,uBClBEC,EAAajC,EAAMK,YAC9B,WAEEC,OADEC,IAAAA,UAAWC,IAAAA,SAAUC,IAAAA,UAAOC,SAAAA,gBAAkBc,IAAAA,KAAMb,IAAAA,MAAUC,kEAG1DI,EAAYC,EAAGV,EAAW,WAAY,0BAG1CP,yBAAOO,UAAWS,EAAWL,MAAOA,GAClCX,uCACEO,UAAU,yBACVgB,KAAK,WACLC,KAAMA,EACNlB,IAAKA,EACLG,MAAOA,EACPC,SAAUA,GACNE,IAENZ,wBAAMO,UAAU,yBACdP,gBAACkC,SAEF1B,MAMH0B,EAAyB,kBAE3BlC,uBACEO,UAAU,uBACV4B,MAAM,OACNC,OAAO,MACPC,QAAQ,cAERrC,wBACEO,UAAU,6BACV+B,EAAE,+BACFC,KAAK,WCjDbC,yBAAuB,OAAQ,0ECcgC,gBAC7DhB,IAAAA,KACAf,IAAAA,MACAD,IAAAA,SACAkB,IAAAA,SACAe,IAAAA,MACG7B,sDAEG8B,EAAe1C,EAAM2C,SAAQ,iBAAO,CAAEnB,KAAAA,EAAMf,MAAAA,EAAOiB,SAAAA,KAAa,CACpEF,EACAf,EACAiB,WAGA1B,gBAACE,GAA+BO,MAAOiC,GACrC1C,gBAAC4C,0BAASrC,UAAU,yBAAyBkC,MAAOA,GAAW7B,GAC5DJ"}
|
|
1
|
+
{"version":3,"file":"chip.cjs.production.min.js","sources":["../src/ChoiceChipGroupContext.tsx","../src/ChoiceChip.tsx","../src/ActionChip.tsx","../src/TagChip.tsx","../src/FilterChip.tsx","../src/index.tsx","../src/ChoiceChipGroup.tsx"],"sourcesContent":["import React from 'react';\n\ntype ChoiceChipGroupContextProps = {\n name: string;\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n value: string | null;\n};\n\nconst ChoiceChipGroupContext =\n React.createContext<ChoiceChipGroupContextProps | null>(null);\n\nexport const ChoiceChipGroupContextProvider = ChoiceChipGroupContext.Provider;\n\nexport const useChoiceChipGroupContext: () => ChoiceChipGroupContextProps =\n () => {\n const context = React.useContext(ChoiceChipGroupContext);\n if (!context) {\n throw new Error(\n 'You need to wrap your ChoiceChips in a ChoiceChipGroup-component',\n );\n }\n return context;\n };\n","import React from 'react';\nimport cx from 'classnames';\nimport { useChoiceChipGroupContext } from './ChoiceChipGroupContext';\nimport './BaseChip.scss';\nimport './ChoiceChip.scss';\n\nexport type ChoiceChipProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Om Choicechip er deaktivert eller ikke\n * @default false\n */\n disabled?: boolean;\n /** Label til ChoiceChip */\n children?: React.ReactNode;\n /** Verdien til ChoiceChip */\n value: string;\n} & Omit<\n React.DetailedHTMLProps<\n React.InputHTMLAttributes<HTMLInputElement>,\n HTMLInputElement\n >,\n 'value'\n>;\n\nexport const ChoiceChip = React.forwardRef<HTMLInputElement, ChoiceChipProps>(\n (\n { className, children, value, disabled = false, style, ...rest },\n ref: React.Ref<HTMLInputElement>,\n ) => {\n const childrenArray = React.Children.toArray(children);\n const hasLeadingIcon =\n childrenArray.length > 1 && typeof childrenArray[0] !== 'string';\n const hasTrailingIcon =\n childrenArray.length > 1 &&\n typeof childrenArray[childrenArray.length - 1] !== 'string';\n\n const classList = cx(className, 'eds-chip', {\n 'eds-chip--disabled': disabled,\n 'eds-chip--leading-icon': hasLeadingIcon,\n 'eds-chip--trailing-icon': hasTrailingIcon,\n });\n const {\n name,\n value: selectedValue,\n onChange,\n } = useChoiceChipGroupContext();\n return (\n <label className=\"eds-choice-chip\" style={style}>\n <input\n className=\"eds-choice-chip__input\"\n type=\"radio\"\n name={name}\n ref={ref}\n value={value}\n disabled={disabled}\n checked={selectedValue === value}\n onChange={onChange}\n {...rest}\n />\n <div className={classList}>{children}</div>\n </label>\n );\n },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport './BaseChip.scss';\nimport './ActionChip.scss';\n\nexport type ActionChipProps = {\n /** Teksten som vises i ActionChip */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n} & React.DetailedHTMLProps<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n HTMLButtonElement\n>;\n\nexport const ActionChip = React.forwardRef<HTMLButtonElement, ActionChipProps>(\n ({ children, className, ...rest }, ref: React.Ref<HTMLButtonElement>) => {\n const childrenArray = React.Children.toArray(children);\n const hasLeadingIcon =\n childrenArray.length > 1 && typeof childrenArray[0] !== 'string';\n const hasTrailingIcon =\n childrenArray.length > 1 &&\n typeof childrenArray[childrenArray.length - 1] !== 'string';\n\n return (\n <button\n className={classNames(\n 'eds-chip',\n 'eds-action-chip',\n {\n 'eds-chip--leading-icon': hasLeadingIcon,\n 'eds-chip--trailing-icon': hasTrailingIcon,\n },\n className,\n )}\n ref={ref}\n type=\"button\"\n {...rest}\n >\n {children}\n </button>\n );\n },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { CloseIcon } from '@entur/icons';\nimport './BaseChip.scss';\nimport './TagChip.scss';\n\nexport type TagChipProps = {\n /** Teksten som vises i TagChip */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Callback for når man klikker på krysset */\n onClose: () => void;\n};\n\nexport const TagChip = React.forwardRef<HTMLButtonElement, TagChipProps>(\n (\n { children, className, onClose, ...rest },\n ref: React.Ref<HTMLButtonElement>,\n ) => {\n return (\n <div\n className={classNames('eds-chip', 'eds-tag-chip', className)}\n {...rest}\n >\n {children}\n <button\n className=\"eds-tag-chip__close-button\"\n type=\"button\"\n onClick={onClose}\n ref={ref}\n >\n <CloseIcon />\n </button>\n </div>\n );\n },\n);\n","import React from 'react';\nimport cx from 'classnames';\nimport './BaseChip.scss';\nimport './FilterChip.scss';\n\nexport type FilterChipProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Label til FilterChip */\n children?: React.ReactNode;\n /** Verdien til FilterChip */\n value: string;\n} & React.InputHTMLAttributes<HTMLInputElement>;\n\nexport const FilterChip = React.forwardRef<HTMLInputElement, FilterChipProps>(\n (\n { className, children, value, disabled = false, name, style, ...rest },\n ref: React.Ref<HTMLInputElement>,\n ) => {\n const classList = cx(className, 'eds-chip', 'eds-filter-chip');\n\n return (\n <label className={classList} style={style}>\n <input\n className=\"eds-filter-chip__input\"\n type=\"checkbox\"\n name={name}\n ref={ref}\n value={value}\n disabled={disabled}\n {...rest}\n />\n <span className=\"eds-filter-chip__icon\">\n <CheckboxIcon />\n </span>\n {children}\n </label>\n );\n },\n);\n\nconst CheckboxIcon: React.FC = () => {\n return (\n <svg\n className=\"eds-filter-chip-icon\"\n width=\"11px\"\n height=\"9px\"\n viewBox=\"6 11 37 33\"\n >\n <path\n className=\"eds-filter-chip-icon__path\"\n d=\"M14.1 27.2l7.1 7.2 14.6-14.8\"\n fill=\"none\"\n />\n </svg>\n );\n};\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('chip', 'form');\n\nexport * from './ChoiceChip';\nexport * from './ActionChip';\nexport * from './TagChip';\nexport * from './FilterChip';\nexport * from './ChoiceChipGroup';\n","import React from 'react';\nimport { ChoiceChipGroupContextProvider } from './ChoiceChipGroupContext';\nimport { Fieldset } from '@entur/form';\nexport type ChoiceChipGroupProps = {\n /** Navnet til ChoiceChipsGroup */\n name: string;\n /** Verdien til den valgte ChoiceChipen */\n value: string | null;\n /** ChoiceChip-komponentene sendes inn som children */\n children: React.ReactNode;\n /** En callback som blir kalles hver gang en ChoiceChip klikkes på */\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n /** Labelen til ChoiceChip-gruppen. */\n label?: React.ReactNode;\n [key: string]: any;\n};\n\nexport const ChoiceChipGroup: React.FC<ChoiceChipGroupProps> = ({\n name,\n value,\n children,\n onChange,\n label,\n ...rest\n}) => {\n const contextValue = React.useMemo(() => ({ name, value, onChange }), [\n name,\n value,\n onChange,\n ]);\n return (\n <ChoiceChipGroupContextProvider value={contextValue}>\n <Fieldset className=\"eds-choice-chips-group\" label={label} {...rest}>\n {children}\n </Fieldset>\n </ChoiceChipGroupContextProvider>\n );\n};\n"],"names":["ChoiceChipGroupContext","React","createContext","ChoiceChipGroupContextProvider","Provider","ChoiceChip","forwardRef","ref","className","children","value","disabled","style","rest","childrenArray","Children","toArray","classList","cx","length","context","useContext","Error","useChoiceChipGroupContext","type","name","checked","onChange","ActionChip","classNames","TagChip","onClose","onClick","CloseIcon","FilterChip","CheckboxIcon","width","height","viewBox","d","fill","warnAboutMissingStyles","label","contextValue","useMemo","Fieldset"],"mappings":"8mBAQA,IAAMA,EACJC,UAAMC,cAAkD,MAE7CC,EAAiCH,EAAuBI,+DCcxDC,EAAaJ,UAAMK,YAC9B,WAEEC,OADEC,IAAAA,UAAWC,IAAAA,SAAUC,IAAAA,UAAOC,SAAAA,gBAAkBC,IAAAA,MAAUC,SAGpDC,EAAgBb,UAAMc,SAASC,QAAQP,GAOvCQ,EAAYC,UAAGV,EAAW,WAAY,sBACpBG,2BANtBG,EAAcK,OAAS,GAAiC,iBAArBL,EAAc,6BAEjDA,EAAcK,OAAS,GAC4B,iBAA5CL,EAAcA,EAAcK,OAAS,ODrBhD,eACQC,EAAUnB,UAAMoB,WAAWrB,OAC5BoB,QACG,IAAIE,MACR,2EAGGF,ECyBHG,UAEFtB,iCAAOO,UAAU,kBAAkBI,MAAOA,GACxCX,mCACEO,UAAU,yBACVgB,KAAK,QACLC,OATJA,KAUIlB,IAAKA,EACLG,MAAOA,EACPC,SAAUA,EACVe,UAZJhB,QAY+BA,EAC3BiB,WAZJA,UAaQd,IAENZ,+BAAKO,UAAWS,GAAYR,kCC7CvBmB,EAAa3B,UAAMK,YAC9B,WAAmCC,OAAhCE,IAAAA,SAAUD,IAAAA,UAAcK,SACnBC,EAAgBb,UAAMc,SAASC,QAAQP,UAQ3CR,oCACEO,UAAWqB,UACT,WACA,kBACA,0BAVJf,EAAcK,OAAS,GAAiC,iBAArBL,EAAc,6BAEjDA,EAAcK,OAAS,GAC4B,iBAA5CL,EAAcA,EAAcK,OAAS,IAWxCX,GAEFD,IAAKA,EACLiB,KAAK,UACDX,GAEHJ,2CCxBIqB,EAAU7B,UAAMK,YAC3B,WAEEC,OADEE,IAAAA,SAAUD,IAAAA,UAAWuB,IAAAA,QAAYlB,gBAIjCZ,iCACEO,UAAWqB,UAAW,WAAY,eAAgBrB,IAC9CK,GAEHJ,EACDR,kCACEO,UAAU,6BACVgB,KAAK,SACLQ,QAASD,EACTxB,IAAKA,GAELN,wBAACgC,oFClBEC,EAAajC,UAAMK,YAC9B,WAEEC,OADEC,IAAAA,UAAWC,IAAAA,SAAUC,IAAAA,UAAOC,SAAAA,gBAAkBc,IAAAA,KAAMb,IAAAA,MAAUC,SAG1DI,EAAYC,UAAGV,EAAW,WAAY,0BAG1CP,iCAAOO,UAAWS,EAAWL,MAAOA,GAClCX,mCACEO,UAAU,yBACVgB,KAAK,WACLC,KAAMA,EACNlB,IAAKA,EACLG,MAAOA,EACPC,SAAUA,GACNE,IAENZ,gCAAMO,UAAU,yBACdP,wBAACkC,SAEF1B,MAMH0B,EAAyB,kBAE3BlC,+BACEO,UAAU,uBACV4B,MAAM,OACNC,OAAO,MACPC,QAAQ,cAERrC,gCACEO,UAAU,6BACV+B,EAAE,+BACFC,KAAK,4DCjDbC,yBAAuB,OAAQ,0ECcgC,gBAC7DhB,IAAAA,KACAf,IAAAA,MACAD,IAAAA,SACAkB,IAAAA,SACAe,IAAAA,MACG7B,SAEG8B,EAAe1C,UAAM2C,SAAQ,iBAAO,CAAEnB,KAAAA,EAAMf,MAAAA,EAAOiB,SAAAA,KAAa,CACpEF,EACAf,EACAiB,WAGA1B,wBAACE,GAA+BO,MAAOiC,GACrC1C,wBAAC4C,cAASrC,UAAU,yBAAyBkC,MAAOA,GAAW7B,GAC5DJ"}
|
package/dist/chip.esm.js
CHANGED
|
@@ -4,6 +4,24 @@ import classNames from 'classnames';
|
|
|
4
4
|
import { CloseIcon } from '@entur/icons';
|
|
5
5
|
import { Fieldset } from '@entur/form';
|
|
6
6
|
|
|
7
|
+
function _extends() {
|
|
8
|
+
_extends = Object.assign || function (target) {
|
|
9
|
+
for (var i = 1; i < arguments.length; i++) {
|
|
10
|
+
var source = arguments[i];
|
|
11
|
+
|
|
12
|
+
for (var key in source) {
|
|
13
|
+
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
14
|
+
target[key] = source[key];
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
return target;
|
|
20
|
+
};
|
|
21
|
+
|
|
22
|
+
return _extends.apply(this, arguments);
|
|
23
|
+
}
|
|
24
|
+
|
|
7
25
|
function _objectWithoutPropertiesLoose(source, excluded) {
|
|
8
26
|
if (source == null) return {};
|
|
9
27
|
var target = {};
|
|
@@ -31,6 +49,7 @@ var useChoiceChipGroupContext = function useChoiceChipGroupContext() {
|
|
|
31
49
|
return context;
|
|
32
50
|
};
|
|
33
51
|
|
|
52
|
+
var _excluded$4 = ["className", "children", "value", "disabled", "style"];
|
|
34
53
|
var ChoiceChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
35
54
|
var className = _ref.className,
|
|
36
55
|
children = _ref.children,
|
|
@@ -38,7 +57,7 @@ var ChoiceChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
38
57
|
_ref$disabled = _ref.disabled,
|
|
39
58
|
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
40
59
|
style = _ref.style,
|
|
41
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
60
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$4);
|
|
42
61
|
|
|
43
62
|
var childrenArray = React.Children.toArray(children);
|
|
44
63
|
var hasLeadingIcon = childrenArray.length > 1 && typeof childrenArray[0] !== 'string';
|
|
@@ -57,7 +76,7 @@ var ChoiceChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
57
76
|
return React.createElement("label", {
|
|
58
77
|
className: "eds-choice-chip",
|
|
59
78
|
style: style
|
|
60
|
-
}, React.createElement("input",
|
|
79
|
+
}, React.createElement("input", _extends({
|
|
61
80
|
className: "eds-choice-chip__input",
|
|
62
81
|
type: "radio",
|
|
63
82
|
name: name,
|
|
@@ -71,15 +90,16 @@ var ChoiceChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
71
90
|
}, children));
|
|
72
91
|
});
|
|
73
92
|
|
|
93
|
+
var _excluded$3 = ["children", "className"];
|
|
74
94
|
var ActionChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
75
95
|
var children = _ref.children,
|
|
76
96
|
className = _ref.className,
|
|
77
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
97
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
|
|
78
98
|
|
|
79
99
|
var childrenArray = React.Children.toArray(children);
|
|
80
100
|
var hasLeadingIcon = childrenArray.length > 1 && typeof childrenArray[0] !== 'string';
|
|
81
101
|
var hasTrailingIcon = childrenArray.length > 1 && typeof childrenArray[childrenArray.length - 1] !== 'string';
|
|
82
|
-
return React.createElement("button",
|
|
102
|
+
return React.createElement("button", _extends({
|
|
83
103
|
className: classNames('eds-chip', 'eds-action-chip', {
|
|
84
104
|
'eds-chip--leading-icon': hasLeadingIcon,
|
|
85
105
|
'eds-chip--trailing-icon': hasTrailingIcon
|
|
@@ -89,13 +109,14 @@ var ActionChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
89
109
|
}, rest), children);
|
|
90
110
|
});
|
|
91
111
|
|
|
112
|
+
var _excluded$2 = ["children", "className", "onClose"];
|
|
92
113
|
var TagChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
93
114
|
var children = _ref.children,
|
|
94
115
|
className = _ref.className,
|
|
95
116
|
onClose = _ref.onClose,
|
|
96
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
117
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
|
|
97
118
|
|
|
98
|
-
return React.createElement("div",
|
|
119
|
+
return React.createElement("div", _extends({
|
|
99
120
|
className: classNames('eds-chip', 'eds-tag-chip', className)
|
|
100
121
|
}, rest), children, React.createElement("button", {
|
|
101
122
|
className: "eds-tag-chip__close-button",
|
|
@@ -105,6 +126,7 @@ var TagChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
105
126
|
}, React.createElement(CloseIcon, null)));
|
|
106
127
|
});
|
|
107
128
|
|
|
129
|
+
var _excluded$1 = ["className", "children", "value", "disabled", "name", "style"];
|
|
108
130
|
var FilterChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
109
131
|
var className = _ref.className,
|
|
110
132
|
children = _ref.children,
|
|
@@ -113,13 +135,13 @@ var FilterChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
113
135
|
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
114
136
|
name = _ref.name,
|
|
115
137
|
style = _ref.style,
|
|
116
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
138
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
|
|
117
139
|
|
|
118
140
|
var classList = classNames(className, 'eds-chip', 'eds-filter-chip');
|
|
119
141
|
return React.createElement("label", {
|
|
120
142
|
className: classList,
|
|
121
143
|
style: style
|
|
122
|
-
}, React.createElement("input",
|
|
144
|
+
}, React.createElement("input", _extends({
|
|
123
145
|
className: "eds-filter-chip__input",
|
|
124
146
|
type: "checkbox",
|
|
125
147
|
name: name,
|
|
@@ -144,13 +166,14 @@ var CheckboxIcon = function CheckboxIcon() {
|
|
|
144
166
|
}));
|
|
145
167
|
};
|
|
146
168
|
|
|
169
|
+
var _excluded = ["name", "value", "children", "onChange", "label"];
|
|
147
170
|
var ChoiceChipGroup = function ChoiceChipGroup(_ref) {
|
|
148
171
|
var name = _ref.name,
|
|
149
172
|
value = _ref.value,
|
|
150
173
|
children = _ref.children,
|
|
151
174
|
onChange = _ref.onChange,
|
|
152
175
|
label = _ref.label,
|
|
153
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
176
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
154
177
|
|
|
155
178
|
var contextValue = React.useMemo(function () {
|
|
156
179
|
return {
|
|
@@ -161,7 +184,7 @@ var ChoiceChipGroup = function ChoiceChipGroup(_ref) {
|
|
|
161
184
|
}, [name, value, onChange]);
|
|
162
185
|
return React.createElement(ChoiceChipGroupContextProvider, {
|
|
163
186
|
value: contextValue
|
|
164
|
-
}, React.createElement(Fieldset,
|
|
187
|
+
}, React.createElement(Fieldset, _extends({
|
|
165
188
|
className: "eds-choice-chips-group",
|
|
166
189
|
label: label
|
|
167
190
|
}, rest), children));
|
package/dist/chip.esm.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"chip.esm.js","sources":["../src/ChoiceChipGroupContext.tsx","../src/ChoiceChip.tsx","../src/ActionChip.tsx","../src/TagChip.tsx","../src/FilterChip.tsx","../src/ChoiceChipGroup.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\n\ntype ChoiceChipGroupContextProps = {\n name: string;\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n value: string | null;\n};\n\nconst ChoiceChipGroupContext =\n React.createContext<ChoiceChipGroupContextProps | null>(null);\n\nexport const ChoiceChipGroupContextProvider = ChoiceChipGroupContext.Provider;\n\nexport const useChoiceChipGroupContext: () => ChoiceChipGroupContextProps =\n () => {\n const context = React.useContext(ChoiceChipGroupContext);\n if (!context) {\n throw new Error(\n 'You need to wrap your ChoiceChips in a ChoiceChipGroup-component',\n );\n }\n return context;\n };\n","import React from 'react';\nimport cx from 'classnames';\nimport { useChoiceChipGroupContext } from './ChoiceChipGroupContext';\nimport './BaseChip.scss';\nimport './ChoiceChip.scss';\n\nexport type ChoiceChipProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Om Choicechip er deaktivert eller ikke\n * @default false\n */\n disabled?: boolean;\n /** Label til ChoiceChip */\n children?: React.ReactNode;\n /** Verdien til ChoiceChip */\n value: string;\n} & Omit<\n React.DetailedHTMLProps<\n React.InputHTMLAttributes<HTMLInputElement>,\n HTMLInputElement\n >,\n 'value'\n>;\n\nexport const ChoiceChip = React.forwardRef<HTMLInputElement, ChoiceChipProps>(\n (\n { className, children, value, disabled = false, style, ...rest },\n ref: React.Ref<HTMLInputElement>,\n ) => {\n const childrenArray = React.Children.toArray(children);\n const hasLeadingIcon =\n childrenArray.length > 1 && typeof childrenArray[0] !== 'string';\n const hasTrailingIcon =\n childrenArray.length > 1 &&\n typeof childrenArray[childrenArray.length - 1] !== 'string';\n\n const classList = cx(className, 'eds-chip', {\n 'eds-chip--disabled': disabled,\n 'eds-chip--leading-icon': hasLeadingIcon,\n 'eds-chip--trailing-icon': hasTrailingIcon,\n });\n const {\n name,\n value: selectedValue,\n onChange,\n } = useChoiceChipGroupContext();\n return (\n <label className=\"eds-choice-chip\" style={style}>\n <input\n className=\"eds-choice-chip__input\"\n type=\"radio\"\n name={name}\n ref={ref}\n value={value}\n disabled={disabled}\n checked={selectedValue === value}\n onChange={onChange}\n {...rest}\n />\n <div className={classList}>{children}</div>\n </label>\n );\n },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport './BaseChip.scss';\nimport './ActionChip.scss';\n\nexport type ActionChipProps = {\n /** Teksten som vises i ActionChip */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n} & React.DetailedHTMLProps<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n HTMLButtonElement\n>;\n\nexport const ActionChip = React.forwardRef<HTMLButtonElement, ActionChipProps>(\n ({ children, className, ...rest }, ref: React.Ref<HTMLButtonElement>) => {\n const childrenArray = React.Children.toArray(children);\n const hasLeadingIcon =\n childrenArray.length > 1 && typeof childrenArray[0] !== 'string';\n const hasTrailingIcon =\n childrenArray.length > 1 &&\n typeof childrenArray[childrenArray.length - 1] !== 'string';\n\n return (\n <button\n className={classNames(\n 'eds-chip',\n 'eds-action-chip',\n {\n 'eds-chip--leading-icon': hasLeadingIcon,\n 'eds-chip--trailing-icon': hasTrailingIcon,\n },\n className,\n )}\n ref={ref}\n type=\"button\"\n {...rest}\n >\n {children}\n </button>\n );\n },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { CloseIcon } from '@entur/icons';\nimport './BaseChip.scss';\nimport './TagChip.scss';\n\nexport type TagChipProps = {\n /** Teksten som vises i TagChip */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Callback for når man klikker på krysset */\n onClose: () => void;\n};\n\nexport const TagChip = React.forwardRef<HTMLButtonElement, TagChipProps>(\n (\n { children, className, onClose, ...rest },\n ref: React.Ref<HTMLButtonElement>,\n ) => {\n return (\n <div\n className={classNames('eds-chip', 'eds-tag-chip', className)}\n {...rest}\n >\n {children}\n <button\n className=\"eds-tag-chip__close-button\"\n type=\"button\"\n onClick={onClose}\n ref={ref}\n >\n <CloseIcon />\n </button>\n </div>\n );\n },\n);\n","import React from 'react';\nimport cx from 'classnames';\nimport './BaseChip.scss';\nimport './FilterChip.scss';\n\nexport type FilterChipProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Label til FilterChip */\n children?: React.ReactNode;\n /** Verdien til FilterChip */\n value: string;\n} & React.InputHTMLAttributes<HTMLInputElement>;\n\nexport const FilterChip = React.forwardRef<HTMLInputElement, FilterChipProps>(\n (\n { className, children, value, disabled = false, name, style, ...rest },\n ref: React.Ref<HTMLInputElement>,\n ) => {\n const classList = cx(className, 'eds-chip', 'eds-filter-chip');\n\n return (\n <label className={classList} style={style}>\n <input\n className=\"eds-filter-chip__input\"\n type=\"checkbox\"\n name={name}\n ref={ref}\n value={value}\n disabled={disabled}\n {...rest}\n />\n <span className=\"eds-filter-chip__icon\">\n <CheckboxIcon />\n </span>\n {children}\n </label>\n );\n },\n);\n\nconst CheckboxIcon: React.FC = () => {\n return (\n <svg\n className=\"eds-filter-chip-icon\"\n width=\"11px\"\n height=\"9px\"\n viewBox=\"6 11 37 33\"\n >\n <path\n className=\"eds-filter-chip-icon__path\"\n d=\"M14.1 27.2l7.1 7.2 14.6-14.8\"\n fill=\"none\"\n />\n </svg>\n );\n};\n","import React from 'react';\nimport { ChoiceChipGroupContextProvider } from './ChoiceChipGroupContext';\nimport { Fieldset } from '@entur/form';\nexport type ChoiceChipGroupProps = {\n /** Navnet til ChoiceChipsGroup */\n name: string;\n /** Verdien til den valgte ChoiceChipen */\n value: string | null;\n /** ChoiceChip-komponentene sendes inn som children */\n children: React.ReactNode;\n /** En callback som blir kalles hver gang en ChoiceChip klikkes på */\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n /** Labelen til ChoiceChip-gruppen. */\n label?: React.ReactNode;\n [key: string]: any;\n};\n\nexport const ChoiceChipGroup: React.FC<ChoiceChipGroupProps> = ({\n name,\n value,\n children,\n onChange,\n label,\n ...rest\n}) => {\n const contextValue = React.useMemo(() => ({ name, value, onChange }), [\n name,\n value,\n onChange,\n ]);\n return (\n <ChoiceChipGroupContextProvider value={contextValue}>\n <Fieldset className=\"eds-choice-chips-group\" label={label} {...rest}>\n {children}\n </Fieldset>\n </ChoiceChipGroupContextProvider>\n );\n};\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('chip', 'form');\n\nexport * from './ChoiceChip';\nexport * from './ActionChip';\nexport * from './TagChip';\nexport * from './FilterChip';\nexport * from './ChoiceChipGroup';\n"],"names":["ChoiceChipGroupContext","React","createContext","ChoiceChipGroupContextProvider","Provider","useChoiceChipGroupContext","context","useContext","Error","ChoiceChip","forwardRef","ref","className","children","value","disabled","style","rest","childrenArray","Children","toArray","hasLeadingIcon","length","hasTrailingIcon","classList","cx","name","selectedValue","onChange","type","checked","ActionChip","classNames","TagChip","onClose","onClick","CloseIcon","FilterChip","CheckboxIcon","width","height","viewBox","d","fill","ChoiceChipGroup","label","contextValue","useMemo","Fieldset","warnAboutMissingStyles"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"chip.esm.js","sources":["../src/ChoiceChipGroupContext.tsx","../src/ChoiceChip.tsx","../src/ActionChip.tsx","../src/TagChip.tsx","../src/FilterChip.tsx","../src/ChoiceChipGroup.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\n\ntype ChoiceChipGroupContextProps = {\n name: string;\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n value: string | null;\n};\n\nconst ChoiceChipGroupContext =\n React.createContext<ChoiceChipGroupContextProps | null>(null);\n\nexport const ChoiceChipGroupContextProvider = ChoiceChipGroupContext.Provider;\n\nexport const useChoiceChipGroupContext: () => ChoiceChipGroupContextProps =\n () => {\n const context = React.useContext(ChoiceChipGroupContext);\n if (!context) {\n throw new Error(\n 'You need to wrap your ChoiceChips in a ChoiceChipGroup-component',\n );\n }\n return context;\n };\n","import React from 'react';\nimport cx from 'classnames';\nimport { useChoiceChipGroupContext } from './ChoiceChipGroupContext';\nimport './BaseChip.scss';\nimport './ChoiceChip.scss';\n\nexport type ChoiceChipProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Om Choicechip er deaktivert eller ikke\n * @default false\n */\n disabled?: boolean;\n /** Label til ChoiceChip */\n children?: React.ReactNode;\n /** Verdien til ChoiceChip */\n value: string;\n} & Omit<\n React.DetailedHTMLProps<\n React.InputHTMLAttributes<HTMLInputElement>,\n HTMLInputElement\n >,\n 'value'\n>;\n\nexport const ChoiceChip = React.forwardRef<HTMLInputElement, ChoiceChipProps>(\n (\n { className, children, value, disabled = false, style, ...rest },\n ref: React.Ref<HTMLInputElement>,\n ) => {\n const childrenArray = React.Children.toArray(children);\n const hasLeadingIcon =\n childrenArray.length > 1 && typeof childrenArray[0] !== 'string';\n const hasTrailingIcon =\n childrenArray.length > 1 &&\n typeof childrenArray[childrenArray.length - 1] !== 'string';\n\n const classList = cx(className, 'eds-chip', {\n 'eds-chip--disabled': disabled,\n 'eds-chip--leading-icon': hasLeadingIcon,\n 'eds-chip--trailing-icon': hasTrailingIcon,\n });\n const {\n name,\n value: selectedValue,\n onChange,\n } = useChoiceChipGroupContext();\n return (\n <label className=\"eds-choice-chip\" style={style}>\n <input\n className=\"eds-choice-chip__input\"\n type=\"radio\"\n name={name}\n ref={ref}\n value={value}\n disabled={disabled}\n checked={selectedValue === value}\n onChange={onChange}\n {...rest}\n />\n <div className={classList}>{children}</div>\n </label>\n );\n },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport './BaseChip.scss';\nimport './ActionChip.scss';\n\nexport type ActionChipProps = {\n /** Teksten som vises i ActionChip */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n} & React.DetailedHTMLProps<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n HTMLButtonElement\n>;\n\nexport const ActionChip = React.forwardRef<HTMLButtonElement, ActionChipProps>(\n ({ children, className, ...rest }, ref: React.Ref<HTMLButtonElement>) => {\n const childrenArray = React.Children.toArray(children);\n const hasLeadingIcon =\n childrenArray.length > 1 && typeof childrenArray[0] !== 'string';\n const hasTrailingIcon =\n childrenArray.length > 1 &&\n typeof childrenArray[childrenArray.length - 1] !== 'string';\n\n return (\n <button\n className={classNames(\n 'eds-chip',\n 'eds-action-chip',\n {\n 'eds-chip--leading-icon': hasLeadingIcon,\n 'eds-chip--trailing-icon': hasTrailingIcon,\n },\n className,\n )}\n ref={ref}\n type=\"button\"\n {...rest}\n >\n {children}\n </button>\n );\n },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { CloseIcon } from '@entur/icons';\nimport './BaseChip.scss';\nimport './TagChip.scss';\n\nexport type TagChipProps = {\n /** Teksten som vises i TagChip */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Callback for når man klikker på krysset */\n onClose: () => void;\n};\n\nexport const TagChip = React.forwardRef<HTMLButtonElement, TagChipProps>(\n (\n { children, className, onClose, ...rest },\n ref: React.Ref<HTMLButtonElement>,\n ) => {\n return (\n <div\n className={classNames('eds-chip', 'eds-tag-chip', className)}\n {...rest}\n >\n {children}\n <button\n className=\"eds-tag-chip__close-button\"\n type=\"button\"\n onClick={onClose}\n ref={ref}\n >\n <CloseIcon />\n </button>\n </div>\n );\n },\n);\n","import React from 'react';\nimport cx from 'classnames';\nimport './BaseChip.scss';\nimport './FilterChip.scss';\n\nexport type FilterChipProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Label til FilterChip */\n children?: React.ReactNode;\n /** Verdien til FilterChip */\n value: string;\n} & React.InputHTMLAttributes<HTMLInputElement>;\n\nexport const FilterChip = React.forwardRef<HTMLInputElement, FilterChipProps>(\n (\n { className, children, value, disabled = false, name, style, ...rest },\n ref: React.Ref<HTMLInputElement>,\n ) => {\n const classList = cx(className, 'eds-chip', 'eds-filter-chip');\n\n return (\n <label className={classList} style={style}>\n <input\n className=\"eds-filter-chip__input\"\n type=\"checkbox\"\n name={name}\n ref={ref}\n value={value}\n disabled={disabled}\n {...rest}\n />\n <span className=\"eds-filter-chip__icon\">\n <CheckboxIcon />\n </span>\n {children}\n </label>\n );\n },\n);\n\nconst CheckboxIcon: React.FC = () => {\n return (\n <svg\n className=\"eds-filter-chip-icon\"\n width=\"11px\"\n height=\"9px\"\n viewBox=\"6 11 37 33\"\n >\n <path\n className=\"eds-filter-chip-icon__path\"\n d=\"M14.1 27.2l7.1 7.2 14.6-14.8\"\n fill=\"none\"\n />\n </svg>\n );\n};\n","import React from 'react';\nimport { ChoiceChipGroupContextProvider } from './ChoiceChipGroupContext';\nimport { Fieldset } from '@entur/form';\nexport type ChoiceChipGroupProps = {\n /** Navnet til ChoiceChipsGroup */\n name: string;\n /** Verdien til den valgte ChoiceChipen */\n value: string | null;\n /** ChoiceChip-komponentene sendes inn som children */\n children: React.ReactNode;\n /** En callback som blir kalles hver gang en ChoiceChip klikkes på */\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n /** Labelen til ChoiceChip-gruppen. */\n label?: React.ReactNode;\n [key: string]: any;\n};\n\nexport const ChoiceChipGroup: React.FC<ChoiceChipGroupProps> = ({\n name,\n value,\n children,\n onChange,\n label,\n ...rest\n}) => {\n const contextValue = React.useMemo(() => ({ name, value, onChange }), [\n name,\n value,\n onChange,\n ]);\n return (\n <ChoiceChipGroupContextProvider value={contextValue}>\n <Fieldset className=\"eds-choice-chips-group\" label={label} {...rest}>\n {children}\n </Fieldset>\n </ChoiceChipGroupContextProvider>\n );\n};\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('chip', 'form');\n\nexport * from './ChoiceChip';\nexport * from './ActionChip';\nexport * from './TagChip';\nexport * from './FilterChip';\nexport * from './ChoiceChipGroup';\n"],"names":["ChoiceChipGroupContext","React","createContext","ChoiceChipGroupContextProvider","Provider","useChoiceChipGroupContext","context","useContext","Error","ChoiceChip","forwardRef","ref","className","children","value","disabled","style","rest","childrenArray","Children","toArray","hasLeadingIcon","length","hasTrailingIcon","classList","cx","name","selectedValue","onChange","type","checked","ActionChip","classNames","TagChip","onClose","onClick","CloseIcon","FilterChip","CheckboxIcon","width","height","viewBox","d","fill","ChoiceChipGroup","label","contextValue","useMemo","Fieldset","warnAboutMissingStyles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,IAAMA,sBAAsB,gBAC1BC,KAAK,CAACC,aAAN,CAAwD,IAAxD,CADF;AAGO,IAAMC,8BAA8B,GAAGH,sBAAsB,CAACI,QAA9D;AAEA,IAAMC,yBAAyB,GACpC,SADWA,yBACX;AACE,MAAMC,OAAO,GAAGL,KAAK,CAACM,UAAN,CAAiBP,sBAAjB,CAAhB;;AACA,MAAI,CAACM,OAAL,EAAc;AACZ,UAAM,IAAIE,KAAJ,CACJ,kEADI,CAAN;AAGD;;AACD,SAAOF,OAAP;AACD,CATI;;;ICYMG,UAAU,gBAAGR,KAAK,CAACS,UAAN,CACxB,gBAEEC,GAFF;MACIC,iBAAAA;MAAWC,gBAAAA;MAAUC,aAAAA;2BAAOC;MAAAA,sCAAW;MAAOC,aAAAA;MAAUC;;AAG1D,MAAMC,aAAa,GAAGjB,KAAK,CAACkB,QAAN,CAAeC,OAAf,CAAuBP,QAAvB,CAAtB;AACA,MAAMQ,cAAc,GAClBH,aAAa,CAACI,MAAd,GAAuB,CAAvB,IAA4B,OAAOJ,aAAa,CAAC,CAAD,CAApB,KAA4B,QAD1D;AAEA,MAAMK,eAAe,GACnBL,aAAa,CAACI,MAAd,GAAuB,CAAvB,IACA,OAAOJ,aAAa,CAACA,aAAa,CAACI,MAAd,GAAuB,CAAxB,CAApB,KAAmD,QAFrD;AAIA,MAAME,SAAS,GAAGC,UAAE,CAACb,SAAD,EAAY,UAAZ,EAAwB;AAC1C,0BAAsBG,QADoB;AAE1C,8BAA0BM,cAFgB;AAG1C,+BAA2BE;AAHe,GAAxB,CAApB;;AAKA,8BAIIlB,yBAAyB,EAJ7B;AAAA,MACEqB,IADF,yBACEA,IADF;AAAA,MAESC,aAFT,yBAEEb,KAFF;AAAA,MAGEc,QAHF,yBAGEA,QAHF;;AAKA,SACE3B,mBAAA,QAAA;AAAOW,IAAAA,SAAS,EAAC;AAAkBI,IAAAA,KAAK,EAAEA;GAA1C,EACEf,mBAAA,QAAA;AACEW,IAAAA,SAAS,EAAC,wBADZ;AAEEiB,IAAAA,IAAI,EAAC,OAFP;AAGEH,IAAAA,IAAI,EAAEA,IAHR;AAIEf,IAAAA,GAAG,EAAEA,GAJP;AAKEG,IAAAA,KAAK,EAAEA,KALT;AAMEC,IAAAA,QAAQ,EAAEA,QANZ;AAOEe,IAAAA,OAAO,EAAEH,aAAa,KAAKb,KAP7B;AAQEc,IAAAA,QAAQ,EAAEA;AARZ,KASMX,IATN,EADF,EAYEhB,mBAAA,MAAA;AAAKW,IAAAA,SAAS,EAAEY;GAAhB,EAA4BX,QAA5B,CAZF,CADF;AAgBD,CAtCuB;;;ICVbkB,UAAU,gBAAG9B,KAAK,CAACS,UAAN,CACxB,gBAAmCC,GAAnC;MAAGE,gBAAAA;MAAUD,iBAAAA;MAAcK;;AACzB,MAAMC,aAAa,GAAGjB,KAAK,CAACkB,QAAN,CAAeC,OAAf,CAAuBP,QAAvB,CAAtB;AACA,MAAMQ,cAAc,GAClBH,aAAa,CAACI,MAAd,GAAuB,CAAvB,IAA4B,OAAOJ,aAAa,CAAC,CAAD,CAApB,KAA4B,QAD1D;AAEA,MAAMK,eAAe,GACnBL,aAAa,CAACI,MAAd,GAAuB,CAAvB,IACA,OAAOJ,aAAa,CAACA,aAAa,CAACI,MAAd,GAAuB,CAAxB,CAApB,KAAmD,QAFrD;AAIA,SACErB,mBAAA,SAAA;AACEW,IAAAA,SAAS,EAAEoB,UAAU,CACnB,UADmB,EAEnB,iBAFmB,EAGnB;AACE,gCAA0BX,cAD5B;AAEE,iCAA2BE;AAF7B,KAHmB,EAOnBX,SAPmB,CADvB;AAUED,IAAAA,GAAG,EAAEA,GAVP;AAWEkB,IAAAA,IAAI,EAAC;AAXP,KAYMZ,IAZN,GAcGJ,QAdH,CADF;AAkBD,CA3BuB;;;ICAboB,OAAO,gBAAGhC,KAAK,CAACS,UAAN,CACrB,gBAEEC,GAFF;MACIE,gBAAAA;MAAUD,iBAAAA;MAAWsB,eAAAA;MAAYjB;;AAGnC,SACEhB,mBAAA,MAAA;AACEW,IAAAA,SAAS,EAAEoB,UAAU,CAAC,UAAD,EAAa,cAAb,EAA6BpB,SAA7B;AADvB,KAEMK,IAFN,GAIGJ,QAJH,EAKEZ,mBAAA,SAAA;AACEW,IAAAA,SAAS,EAAC;AACViB,IAAAA,IAAI,EAAC;AACLM,IAAAA,OAAO,EAAED;AACTvB,IAAAA,GAAG,EAAEA;GAJP,EAMEV,mBAAA,CAACmC,SAAD,MAAA,CANF,CALF,CADF;AAgBD,CArBoB;;;ICDVC,UAAU,gBAAGpC,KAAK,CAACS,UAAN,CACxB,gBAEEC,GAFF;MACIC,iBAAAA;MAAWC,gBAAAA;MAAUC,aAAAA;2BAAOC;MAAAA,sCAAW;MAAOW,YAAAA;MAAMV,aAAAA;MAAUC;;AAGhE,MAAMO,SAAS,GAAGC,UAAE,CAACb,SAAD,EAAY,UAAZ,EAAwB,iBAAxB,CAApB;AAEA,SACEX,mBAAA,QAAA;AAAOW,IAAAA,SAAS,EAAEY;AAAWR,IAAAA,KAAK,EAAEA;GAApC,EACEf,mBAAA,QAAA;AACEW,IAAAA,SAAS,EAAC,wBADZ;AAEEiB,IAAAA,IAAI,EAAC,UAFP;AAGEH,IAAAA,IAAI,EAAEA,IAHR;AAIEf,IAAAA,GAAG,EAAEA,GAJP;AAKEG,IAAAA,KAAK,EAAEA,KALT;AAMEC,IAAAA,QAAQ,EAAEA;AANZ,KAOME,IAPN,EADF,EAUEhB,mBAAA,OAAA;AAAMW,IAAAA,SAAS,EAAC;GAAhB,EACEX,mBAAA,CAACqC,YAAD,MAAA,CADF,CAVF,EAaGzB,QAbH,CADF;AAiBD,CAxBuB;;AA2B1B,IAAMyB,YAAY,GAAa,SAAzBA,YAAyB;AAC7B,SACErC,mBAAA,MAAA;AACEW,IAAAA,SAAS,EAAC;AACV2B,IAAAA,KAAK,EAAC;AACNC,IAAAA,MAAM,EAAC;AACPC,IAAAA,OAAO,EAAC;GAJV,EAMExC,mBAAA,OAAA;AACEW,IAAAA,SAAS,EAAC;AACV8B,IAAAA,CAAC,EAAC;AACFC,IAAAA,IAAI,EAAC;GAHP,CANF,CADF;AAcD,CAfD;;;ICxBaC,eAAe,GAAmC,SAAlDA,eAAkD;MAC7DlB,YAAAA;MACAZ,aAAAA;MACAD,gBAAAA;MACAe,gBAAAA;MACAiB,aAAAA;MACG5B;;AAEH,MAAM6B,YAAY,GAAG7C,KAAK,CAAC8C,OAAN,CAAc;AAAA,WAAO;AAAErB,MAAAA,IAAI,EAAJA,IAAF;AAAQZ,MAAAA,KAAK,EAALA,KAAR;AAAec,MAAAA,QAAQ,EAARA;AAAf,KAAP;AAAA,GAAd,EAAiD,CACpEF,IADoE,EAEpEZ,KAFoE,EAGpEc,QAHoE,CAAjD,CAArB;AAKA,SACE3B,mBAAA,CAACE,8BAAD;AAAgCW,IAAAA,KAAK,EAAEgC;GAAvC,EACE7C,mBAAA,CAAC+C,QAAD;AAAUpC,IAAAA,SAAS,EAAC,wBAApB;AAA6CiC,IAAAA,KAAK,EAAEA;AAApD,KAA+D5B,IAA/D,GACGJ,QADH,CADF,CADF;AAOD;;AClCDoC,sBAAsB,CAAC,MAAD,EAAS,MAAT,CAAtB;;;;"}
|
package/dist/styles.css
CHANGED
|
@@ -2,6 +2,42 @@
|
|
|
2
2
|
--eds-chip: 1;
|
|
3
3
|
}/* DO NOT CHANGE!*/
|
|
4
4
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
5
|
+
.eds-tag-chip {
|
|
6
|
+
cursor: default;
|
|
7
|
+
padding-right: 0.25rem;
|
|
8
|
+
width: fit-content;
|
|
9
|
+
}
|
|
10
|
+
.eds-tag-chip__close-button {
|
|
11
|
+
appearance: none;
|
|
12
|
+
background: none;
|
|
13
|
+
border: none;
|
|
14
|
+
border-radius: 50%;
|
|
15
|
+
color: #181c56;
|
|
16
|
+
cursor: pointer;
|
|
17
|
+
display: flex;
|
|
18
|
+
font-size: 0.875rem;
|
|
19
|
+
padding: 0.25rem;
|
|
20
|
+
margin-left: 0.25rem;
|
|
21
|
+
transition: box-shadow 0.1s ease-in-out, background 0.1s ease-in-out;
|
|
22
|
+
}
|
|
23
|
+
.eds-contrast .eds-tag-chip__close-button {
|
|
24
|
+
color: #ffffff;
|
|
25
|
+
}
|
|
26
|
+
.eds-tag-chip__close-button:hover {
|
|
27
|
+
background: #babbcf;
|
|
28
|
+
}
|
|
29
|
+
.eds-contrast .eds-tag-chip__close-button:hover {
|
|
30
|
+
background: #54568c;
|
|
31
|
+
}
|
|
32
|
+
.eds-tag-chip__close-button:focus {
|
|
33
|
+
outline-offset: 0.125rem;
|
|
34
|
+
outline: none;
|
|
35
|
+
box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
|
|
36
|
+
}
|
|
37
|
+
.eds-contrast .eds-tag-chip__close-button:focus {
|
|
38
|
+
box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
|
|
39
|
+
}/* DO NOT CHANGE!*/
|
|
40
|
+
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
5
41
|
.eds-chip {
|
|
6
42
|
background: #ebebf1;
|
|
7
43
|
border: 0.0625rem solid #d1d4e3;
|
|
@@ -31,40 +67,30 @@
|
|
|
31
67
|
margin-left: 0.5rem;
|
|
32
68
|
}/* DO NOT CHANGE!*/
|
|
33
69
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
34
|
-
.eds-
|
|
35
|
-
cursor: default;
|
|
36
|
-
padding-right: 0.25rem;
|
|
37
|
-
width: fit-content;
|
|
38
|
-
}
|
|
39
|
-
.eds-tag-chip__close-button {
|
|
40
|
-
appearance: none;
|
|
41
|
-
background: none;
|
|
42
|
-
border: none;
|
|
43
|
-
border-radius: 50%;
|
|
44
|
-
color: #181c56;
|
|
70
|
+
.eds-action-chip {
|
|
45
71
|
cursor: pointer;
|
|
46
|
-
display: flex;
|
|
47
|
-
font-size: 0.875rem;
|
|
48
|
-
padding: 0.25rem;
|
|
49
|
-
margin-left: 0.25rem;
|
|
50
|
-
transition: box-shadow 0.1s ease-in-out, background 0.1s ease-in-out;
|
|
51
|
-
}
|
|
52
|
-
.eds-contrast .eds-tag-chip__close-button {
|
|
53
|
-
color: #ffffff;
|
|
54
|
-
}
|
|
55
|
-
.eds-tag-chip__close-button:hover {
|
|
56
|
-
background: #babbcf;
|
|
57
|
-
}
|
|
58
|
-
.eds-contrast .eds-tag-chip__close-button:hover {
|
|
59
|
-
background: #54568c;
|
|
60
72
|
}
|
|
61
|
-
.eds-
|
|
62
|
-
outline-offset: 0.125rem;
|
|
73
|
+
.eds-action-chip:focus {
|
|
63
74
|
outline: none;
|
|
64
75
|
box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
|
|
76
|
+
outline-offset: 0.125rem;
|
|
65
77
|
}
|
|
66
|
-
.eds-contrast .eds-
|
|
78
|
+
.eds-contrast .eds-action-chip:focus {
|
|
67
79
|
box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
|
|
80
|
+
}
|
|
81
|
+
.eds-action-chip:hover {
|
|
82
|
+
border-color: #181c56;
|
|
83
|
+
}
|
|
84
|
+
.eds-contrast .eds-action-chip:hover {
|
|
85
|
+
background-color: #54568c;
|
|
86
|
+
border-color: #54568c;
|
|
87
|
+
}
|
|
88
|
+
.eds-action-chip:active {
|
|
89
|
+
background: #d1d4e3;
|
|
90
|
+
}
|
|
91
|
+
.eds-contrast .eds-action-chip:active {
|
|
92
|
+
background-color: #292b6a;
|
|
93
|
+
border-color: #292b6a;
|
|
68
94
|
}/* DO NOT CHANGE!*/
|
|
69
95
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
70
96
|
.eds-choice-chip {
|
|
@@ -137,32 +163,6 @@
|
|
|
137
163
|
color: #babbcf;
|
|
138
164
|
}/* DO NOT CHANGE!*/
|
|
139
165
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
140
|
-
.eds-action-chip {
|
|
141
|
-
cursor: pointer;
|
|
142
|
-
}
|
|
143
|
-
.eds-action-chip:focus {
|
|
144
|
-
outline: none;
|
|
145
|
-
box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
|
|
146
|
-
outline-offset: 0.125rem;
|
|
147
|
-
}
|
|
148
|
-
.eds-contrast .eds-action-chip:focus {
|
|
149
|
-
box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
|
|
150
|
-
}
|
|
151
|
-
.eds-action-chip:hover {
|
|
152
|
-
border-color: #181c56;
|
|
153
|
-
}
|
|
154
|
-
.eds-contrast .eds-action-chip:hover {
|
|
155
|
-
background-color: #54568c;
|
|
156
|
-
border-color: #54568c;
|
|
157
|
-
}
|
|
158
|
-
.eds-action-chip:active {
|
|
159
|
-
background: #d1d4e3;
|
|
160
|
-
}
|
|
161
|
-
.eds-contrast .eds-action-chip:active {
|
|
162
|
-
background-color: #292b6a;
|
|
163
|
-
border-color: #292b6a;
|
|
164
|
-
}/* DO NOT CHANGE!*/
|
|
165
|
-
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
166
166
|
.eds-filter-chip {
|
|
167
167
|
cursor: pointer;
|
|
168
168
|
user-select: none;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@entur/chip",
|
|
3
|
-
"version": "0.4.
|
|
3
|
+
"version": "0.4.23",
|
|
4
4
|
"license": "EUPL-1.2",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/chip.esm.js",
|
|
@@ -17,20 +17,20 @@
|
|
|
17
17
|
"access": "public"
|
|
18
18
|
},
|
|
19
19
|
"scripts": {
|
|
20
|
-
"start": "
|
|
21
|
-
"build": "
|
|
22
|
-
"test": "
|
|
23
|
-
"lint": "
|
|
20
|
+
"start": "dts watch --noClean",
|
|
21
|
+
"build": "dts build",
|
|
22
|
+
"test": "dts test --env=jsdom",
|
|
23
|
+
"lint": "dts lint"
|
|
24
24
|
},
|
|
25
25
|
"peerDependencies": {
|
|
26
26
|
"react": ">=16.8.0",
|
|
27
27
|
"react-dom": ">=16.8.0"
|
|
28
28
|
},
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"@entur/form": "^5.2.
|
|
31
|
-
"@entur/tokens": "^3.3.
|
|
32
|
-
"@entur/utils": "^0.4.
|
|
30
|
+
"@entur/form": "^5.2.2",
|
|
31
|
+
"@entur/tokens": "^3.3.1",
|
|
32
|
+
"@entur/utils": "^0.4.3",
|
|
33
33
|
"classnames": "^2.3.1"
|
|
34
34
|
},
|
|
35
|
-
"gitHead": "
|
|
35
|
+
"gitHead": "61e643371cfc5653c93160b7c220152e5b2bafeb"
|
|
36
36
|
}
|