@popmenu/common-ui 0.21.0 → 0.24.0
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/components/NumberField/NumberField.d.ts +3 -0
- package/build/components/NumberField/NumberFieldProps.d.ts +7 -0
- package/build/components/NumberField/NumberFieldStyles.d.ts +2 -0
- package/build/components/NumberField/index.d.ts +2 -0
- package/build/components/Typography/Typography.d.ts +2 -2
- package/build/components/Typography/TypographyProps.d.ts +4 -0
- package/build/components/Typography/TypographyStyles.d.ts +2 -2
- package/build/components/Typography/index.d.ts +1 -1
- package/build/components/index.d.ts +1 -0
- package/build/index.es.js +96 -23
- package/build/index.es.js.map +1 -1
- package/build/index.js +95 -22
- package/build/index.js.map +1 -1
- package/package.json +2 -2
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { FilledTextFieldProps } from '@material-ui/core';
|
|
2
|
+
export interface NumberFieldProps extends Omit<FilledTextFieldProps, 'variant'> {
|
|
3
|
+
/** Callback invoked when the plus sign is clicked. */
|
|
4
|
+
onIncrement: () => void;
|
|
5
|
+
/** Callback invoked when the minus sign is clicked. */
|
|
6
|
+
onDecrement: () => void;
|
|
7
|
+
}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { TypographyProps } from '
|
|
3
|
-
export declare const Typography: React.ForwardRefExoticComponent<Pick<TypographyProps
|
|
2
|
+
import { TypographyProps } from './TypographyProps';
|
|
3
|
+
export declare const Typography: React.ForwardRefExoticComponent<Pick<TypographyProps, "className" | "style" | "classes" | "innerRef" | "slot" | "title" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "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" | "onChange" | "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" | "noWrap" | "gutterBottom" | "paragraph" | "weight" | "align" | "display" | "variant" | "variantMapping"> & React.RefAttributes<HTMLParagraphElement | HTMLHeadingElement | HTMLSpanElement>>;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { TypographyProps } from '
|
|
2
|
-
export declare const useTypographyStyles: (props: TypographyProps
|
|
1
|
+
import { TypographyProps } from './TypographyProps';
|
|
2
|
+
export declare const useTypographyStyles: (props: TypographyProps) => import("@material-ui/styles").ClassNameMap<string>;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export { Typography as default } from './Typography';
|
|
2
|
-
export { TypographyProps } from '
|
|
2
|
+
export { TypographyProps } from './TypographyProps';
|
|
@@ -72,3 +72,4 @@ export { default as ToggleButtonGroup, ToggleButtonGroupProps } from './ToggleBu
|
|
|
72
72
|
export { default as Toolbar, ToolbarProps } from './Toolbar';
|
|
73
73
|
export { default as Tooltip, TooltipProps } from './Tooltip';
|
|
74
74
|
export { default as Typography, TypographyProps } from './Typography';
|
|
75
|
+
export { NumberField, NumberFieldProps } from './NumberField';
|
package/build/index.es.js
CHANGED
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
export { default as Alert } from '@material-ui/lab/Alert';
|
|
2
|
-
import { makeStyles, Paper as Paper$1, useTheme, Box, Popper, Grow, Slider, Link as Link$1 } from '@material-ui/core';
|
|
2
|
+
import { makeStyles, Typography as Typography$1, Paper as Paper$1, useTheme, Box, Popper, Grow, Slider, Link as Link$1, TextField as TextField$1 } from '@material-ui/core';
|
|
3
3
|
export { Accordion, AccordionActions, AccordionDetails, AccordionSummary, Box, Breadcrumbs, ButtonBase, ClickAwayListener, Fab, GridList, Hidden, Modal, Popover, Popper, Step, StepButton, StepConnector, StepContent, StepIcon, StepLabel, Stepper, ThemeProvider, Toolbar, alpha, createTheme, darken, decomposeColor, getLuminance, hexToRgb, lighten, makeStyles, recomposeColor, rgbToHex } from '@material-ui/core';
|
|
4
4
|
export { default as AppBar } from '@material-ui/core/AppBar';
|
|
5
5
|
import * as React from 'react';
|
|
6
6
|
import React__default, { createElement, forwardRef, useRef, useState, useReducer, useEffect, useMemo } from 'react';
|
|
7
7
|
import MuiIconButton from '@material-ui/core/IconButton';
|
|
8
|
-
import MuiTypography from '@material-ui/core/Typography';
|
|
9
8
|
import { makeStyles as makeStyles$1, useTheme as useTheme$1 } from '@material-ui/core/styles';
|
|
10
9
|
export { ServerStyleSheets } from '@material-ui/core/styles';
|
|
11
10
|
import MuiAvatar from '@material-ui/core/Avatar';
|
|
@@ -90,6 +89,42 @@ function __rest(s, e) {
|
|
|
90
89
|
return t;
|
|
91
90
|
}
|
|
92
91
|
|
|
92
|
+
var _path$3M;
|
|
93
|
+
|
|
94
|
+
function _extends$41() { _extends$41 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$41.apply(this, arguments); }
|
|
95
|
+
|
|
96
|
+
function SvgMinusCircle(props) {
|
|
97
|
+
return /*#__PURE__*/React.createElement("svg", _extends$41({
|
|
98
|
+
viewBox: "0 0 16 16",
|
|
99
|
+
strokeLinecap: "round",
|
|
100
|
+
strokeLinejoin: "round",
|
|
101
|
+
stroke: "currentColor",
|
|
102
|
+
width: "1em",
|
|
103
|
+
height: "1em",
|
|
104
|
+
fill: "none"
|
|
105
|
+
}, props), _path$3M || (_path$3M = /*#__PURE__*/React.createElement("path", {
|
|
106
|
+
d: "M8 14.667A6.667 6.667 0 108 1.333a6.667 6.667 0 000 13.334zM5.333 8h5.334"
|
|
107
|
+
})));
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
var _path$3E;
|
|
111
|
+
|
|
112
|
+
function _extends$3V() { _extends$3V = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$3V.apply(this, arguments); }
|
|
113
|
+
|
|
114
|
+
function SvgPlusCircle(props) {
|
|
115
|
+
return /*#__PURE__*/React.createElement("svg", _extends$3V({
|
|
116
|
+
viewBox: "0 0 16 16",
|
|
117
|
+
strokeLinecap: "round",
|
|
118
|
+
strokeLinejoin: "round",
|
|
119
|
+
stroke: "currentColor",
|
|
120
|
+
width: "1em",
|
|
121
|
+
height: "1em",
|
|
122
|
+
fill: "none"
|
|
123
|
+
}, props), _path$3E || (_path$3E = /*#__PURE__*/React.createElement("path", {
|
|
124
|
+
d: "M8 14.667A6.667 6.667 0 108 1.333a6.667 6.667 0 000 13.334zm0-9.334v5.334M5.333 8h5.334"
|
|
125
|
+
})));
|
|
126
|
+
}
|
|
127
|
+
|
|
93
128
|
var _path$3k;
|
|
94
129
|
|
|
95
130
|
function _extends$3B() { _extends$3B = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$3B.apply(this, arguments); }
|
|
@@ -338,29 +373,29 @@ IconButton.defaultProps = {
|
|
|
338
373
|
color: 'secondary',
|
|
339
374
|
};
|
|
340
375
|
|
|
341
|
-
var useTypographyStyles = makeStyles$1(function () {
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
});
|
|
376
|
+
var useTypographyStyles = makeStyles$1(function () { return ({
|
|
377
|
+
root: function (_a) {
|
|
378
|
+
var _b;
|
|
379
|
+
var weight = _a.weight;
|
|
380
|
+
return (__assign((_b = {}, _b["& ." + iconStaticClassName] = {
|
|
381
|
+
position: 'relative',
|
|
382
|
+
top: '0.125em',
|
|
383
|
+
padding: '0 0.125em',
|
|
384
|
+
boxSizing: 'content-box',
|
|
385
|
+
}, _b), (weight && { fontWeight: (weight === 'semi-bold' && 600) || (weight === 'bold' && 700) || 400 })));
|
|
386
|
+
},
|
|
387
|
+
caption: {
|
|
388
|
+
display: 'inline',
|
|
389
|
+
},
|
|
390
|
+
overline: {
|
|
391
|
+
display: 'inline',
|
|
392
|
+
},
|
|
393
|
+
}); });
|
|
360
394
|
|
|
361
395
|
var Typography = forwardRef(function (props, ref) {
|
|
396
|
+
props.weight; var restProps = __rest(props, ["weight"]);
|
|
362
397
|
var classes = useTypographyStyles(props);
|
|
363
|
-
return React__default.createElement(
|
|
398
|
+
return React__default.createElement(Typography$1, __assign({ ref: ref, classes: classes }, restProps));
|
|
364
399
|
});
|
|
365
400
|
Typography.displayName = 'Typography';
|
|
366
401
|
|
|
@@ -995,6 +1030,44 @@ var Tooltip = forwardRef(function (props, ref) {
|
|
|
995
1030
|
});
|
|
996
1031
|
Tooltip.displayName = 'Tooltip';
|
|
997
1032
|
|
|
1033
|
+
var useNumberFieldStyles = makeStyles(function () { return ({
|
|
1034
|
+
root: {
|
|
1035
|
+
height: 56,
|
|
1036
|
+
},
|
|
1037
|
+
}); });
|
|
1038
|
+
var useNumberInputStyles = makeStyles(function (theme) { return ({
|
|
1039
|
+
root: {
|
|
1040
|
+
height: '100%',
|
|
1041
|
+
width: 'min-content',
|
|
1042
|
+
borderRadius: theme.spacing(1),
|
|
1043
|
+
},
|
|
1044
|
+
input: {
|
|
1045
|
+
'&::-webkit-clear-button, &::-webkit-outer-spin-button, &::-webkit-inner-spin-button': {
|
|
1046
|
+
display: 'none',
|
|
1047
|
+
},
|
|
1048
|
+
'-moz-appearance': 'textfield',
|
|
1049
|
+
minWidth: 40,
|
|
1050
|
+
padding: 0,
|
|
1051
|
+
textAlign: 'center',
|
|
1052
|
+
},
|
|
1053
|
+
adornedStart: {
|
|
1054
|
+
padding: 0,
|
|
1055
|
+
},
|
|
1056
|
+
adornedEnd: {
|
|
1057
|
+
padding: 0,
|
|
1058
|
+
},
|
|
1059
|
+
}); });
|
|
1060
|
+
|
|
1061
|
+
var NumberField = function (props) {
|
|
1062
|
+
var onIncrement = props.onIncrement, onDecrement = props.onDecrement, _a = props.InputProps, InputProps = _a === void 0 ? {} : _a, classes = props.classes, restProps = __rest(props, ["onIncrement", "onDecrement", "InputProps", "classes"]);
|
|
1063
|
+
var _b = InputProps, inputClassesOverride = _b.classes, restInputProps = __rest(_b, ["classes"]);
|
|
1064
|
+
var fieldClasses = useNumberFieldStyles(props);
|
|
1065
|
+
var inputClasses = useNumberInputStyles(props);
|
|
1066
|
+
return (React__default.createElement(TextField$1, __assign({ classes: __assign(__assign({}, fieldClasses), classes), variant: "filled", type: "number", defaultValue: 0, InputProps: __assign({ classes: __assign(__assign({}, inputClasses), inputClassesOverride), disableUnderline: true, endAdornment: (React__default.createElement(IconButton, { style: { fontSize: 20 }, onClick: onIncrement },
|
|
1067
|
+
React__default.createElement(Icon, { icon: SvgPlusCircle }))), startAdornment: (React__default.createElement(IconButton, { style: { fontSize: 20 }, onClick: onDecrement },
|
|
1068
|
+
React__default.createElement(Icon, { icon: SvgMinusCircle }))) }, restInputProps) }, restProps)));
|
|
1069
|
+
};
|
|
1070
|
+
|
|
998
1071
|
var useCollapsibleText = function () {
|
|
999
1072
|
var _a = useState(false), open = _a[0], setOpen = _a[1];
|
|
1000
1073
|
var collapseState = useState(false);
|
|
@@ -1008,5 +1081,5 @@ var useCollapsibleText = function () {
|
|
|
1008
1081
|
};
|
|
1009
1082
|
};
|
|
1010
1083
|
|
|
1011
|
-
export { AudioPlayer, Avatar, Button, Checkbox, CollapsibleText, Divider, Icon, IconButton, Link, Paper, PaperContent, Radio, SplitInput, Switch, ToggleButton, ToggleButtonGroup, Tooltip, Typography, useCollapsibleText };
|
|
1084
|
+
export { AudioPlayer, Avatar, Button, Checkbox, CollapsibleText, Divider, Icon, IconButton, Link, NumberField, Paper, PaperContent, Radio, SplitInput, Switch, ToggleButton, ToggleButtonGroup, Tooltip, Typography, useCollapsibleText };
|
|
1012
1085
|
//# sourceMappingURL=index.es.js.map
|