@perses-dev/components 0.51.1 → 0.52.0-beta.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.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormatControls.d.ts","sourceRoot":"","sources":["../../src/FormatControls/FormatControls.tsx"],"names":[],"mappings":"AAaA,OAAO,
|
|
1
|
+
{"version":3,"file":"FormatControls.d.ts","sourceRoot":"","sources":["../../src/FormatControls/FormatControls.tsx"],"names":[],"mappings":"AAaA,OAAO,EACL,aAAa,EAMd,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAIrC,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,aAAa,CAAC;IACrB,QAAQ,EAAE,CAAC,IAAI,EAAE,aAAa,KAAK,IAAI,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AA+BD,wBAAgB,cAAc,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAgB,EAAE,EAAE,mBAAmB,GAAG,YAAY,CA0EvG"}
|
|
@@ -12,13 +12,14 @@
|
|
|
12
12
|
// limitations under the License.
|
|
13
13
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
14
14
|
import { Switch } from '@mui/material';
|
|
15
|
-
import {
|
|
15
|
+
import { UNIT_CONFIG, isUnitWithDecimalPlaces, isUnitWithShortValues, shouldShortenValues } from '@perses-dev/core';
|
|
16
16
|
import { OptionsEditorControl } from '../OptionsEditorLayout';
|
|
17
17
|
import { SettingsAutocomplete } from '../SettingsAutocomplete';
|
|
18
18
|
const KIND_OPTIONS = Object.entries(UNIT_CONFIG).map(([id, config])=>{
|
|
19
19
|
return {
|
|
20
|
+
...config,
|
|
20
21
|
id: id,
|
|
21
|
-
|
|
22
|
+
group: config.group || 'Decimal'
|
|
22
23
|
};
|
|
23
24
|
}).filter((config)=>!config.disableSelectorOption);
|
|
24
25
|
const DECIMAL_PLACES_OPTIONS = [
|
|
@@ -61,8 +62,8 @@ export function FormatControls({ value, onChange, disabled = false }) {
|
|
|
61
62
|
const hasShortValues = isUnitWithShortValues(value);
|
|
62
63
|
const handleKindChange = (_, newValue)=>{
|
|
63
64
|
onChange({
|
|
64
|
-
unit: newValue
|
|
65
|
-
});
|
|
65
|
+
unit: newValue?.id || 'decimal'
|
|
66
|
+
}); // Fallback to 'decimal' if no unit is selected
|
|
66
67
|
};
|
|
67
68
|
const handleDecimalPlacesChange = ({ decimalPlaces })=>{
|
|
68
69
|
if (hasDecimalPlaces) {
|
|
@@ -80,7 +81,7 @@ export function FormatControls({ value, onChange, disabled = false }) {
|
|
|
80
81
|
});
|
|
81
82
|
}
|
|
82
83
|
};
|
|
83
|
-
const unitConfig = UNIT_CONFIG[value
|
|
84
|
+
const unitConfig = UNIT_CONFIG[value?.unit || 'decimal'];
|
|
84
85
|
return /*#__PURE__*/ _jsxs(_Fragment, {
|
|
85
86
|
children: [
|
|
86
87
|
/*#__PURE__*/ _jsx(OptionsEditorControl, {
|
|
@@ -95,11 +96,11 @@ export function FormatControls({ value, onChange, disabled = false }) {
|
|
|
95
96
|
label: "Unit",
|
|
96
97
|
control: /*#__PURE__*/ _jsx(SettingsAutocomplete, {
|
|
97
98
|
value: {
|
|
98
|
-
id: value
|
|
99
|
+
id: value?.unit || 'decimal',
|
|
99
100
|
...unitConfig
|
|
100
101
|
},
|
|
101
102
|
options: KIND_OPTIONS,
|
|
102
|
-
groupBy: (option)=>option.group,
|
|
103
|
+
groupBy: (option)=>option.group ?? 'Decimal',
|
|
103
104
|
onChange: handleKindChange,
|
|
104
105
|
disableClearable: true,
|
|
105
106
|
disabled: disabled
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/FormatControls/FormatControls.tsx"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\nimport { Switch, SwitchProps } from '@mui/material';\nimport {\n
|
|
1
|
+
{"version":3,"sources":["../../src/FormatControls/FormatControls.tsx"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\nimport { Switch, SwitchProps } from '@mui/material';\nimport {\n FormatOptions,\n UNIT_CONFIG,\n UnitConfig,\n isUnitWithDecimalPlaces,\n isUnitWithShortValues,\n shouldShortenValues,\n} from '@perses-dev/core';\nimport { ReactElement } from 'react';\nimport { OptionsEditorControl } from '../OptionsEditorLayout';\nimport { SettingsAutocomplete } from '../SettingsAutocomplete';\n\nexport interface FormatControlsProps {\n value: FormatOptions;\n onChange: (unit: FormatOptions) => void;\n disabled?: boolean;\n}\n\ntype AutocompleteUnitOption = UnitConfig & {\n id: NonNullable<FormatOptions['unit']>;\n};\n\nconst KIND_OPTIONS: readonly AutocompleteUnitOption[] = Object.entries(UNIT_CONFIG)\n .map<AutocompleteUnitOption>(([id, config]) => {\n return {\n ...config,\n id: id as AutocompleteUnitOption['id'],\n group: config.group || 'Decimal',\n };\n })\n .filter((config) => !config.disableSelectorOption);\n\nconst DECIMAL_PLACES_OPTIONS: Array<{ id: string; label: string; decimalPlaces?: number }> = [\n { id: 'default', label: 'Default', decimalPlaces: undefined },\n { id: '0', label: '0', decimalPlaces: 0 },\n { id: '1', label: '1', decimalPlaces: 1 },\n { id: '2', label: '2', decimalPlaces: 2 },\n { id: '3', label: '3', decimalPlaces: 3 },\n { id: '4', label: '4', decimalPlaces: 4 },\n];\n\nfunction getOptionByDecimalPlaces(\n decimalPlaces?: number\n): { id: string; label: string; decimalPlaces?: number } | undefined {\n return DECIMAL_PLACES_OPTIONS.find((o) => o.decimalPlaces === decimalPlaces);\n}\n\nexport function FormatControls({ value, onChange, disabled = false }: FormatControlsProps): ReactElement {\n const hasDecimalPlaces = isUnitWithDecimalPlaces(value);\n const hasShortValues = isUnitWithShortValues(value);\n\n const handleKindChange = (_: unknown, newValue: AutocompleteUnitOption | null): void => {\n onChange({ unit: newValue?.id || 'decimal' }); // Fallback to 'decimal' if no unit is selected\n };\n\n const handleDecimalPlacesChange = ({\n decimalPlaces,\n }: {\n id: string;\n label: string;\n decimalPlaces?: number;\n }): void => {\n if (hasDecimalPlaces) {\n onChange({\n ...value,\n decimalPlaces: decimalPlaces,\n });\n }\n };\n\n const handleShortValuesChange: SwitchProps['onChange'] = (_: unknown, checked: boolean) => {\n if (hasShortValues) {\n onChange({\n ...value,\n shortValues: checked,\n });\n }\n };\n\n const unitConfig = UNIT_CONFIG[value?.unit || 'decimal'];\n\n return (\n <>\n <OptionsEditorControl\n label=\"Short values\"\n control={\n <Switch\n checked={hasShortValues ? shouldShortenValues(value.shortValues) : false}\n onChange={handleShortValuesChange}\n disabled={!hasShortValues}\n />\n }\n />\n <OptionsEditorControl\n label=\"Unit\"\n control={\n <SettingsAutocomplete<AutocompleteUnitOption, false, true>\n value={{ id: value?.unit || 'decimal', ...unitConfig }}\n options={KIND_OPTIONS}\n groupBy={(option) => option.group ?? 'Decimal'}\n onChange={handleKindChange}\n disableClearable\n disabled={disabled}\n />\n }\n />\n <OptionsEditorControl\n label=\"Decimals\"\n control={\n <SettingsAutocomplete\n value={getOptionByDecimalPlaces(value.decimalPlaces)}\n options={DECIMAL_PLACES_OPTIONS}\n getOptionLabel={(o) => o.label}\n onChange={(_, value) => handleDecimalPlacesChange(value)}\n disabled={!hasDecimalPlaces}\n disableClearable\n />\n }\n />\n </>\n );\n}\n"],"names":["Switch","UNIT_CONFIG","isUnitWithDecimalPlaces","isUnitWithShortValues","shouldShortenValues","OptionsEditorControl","SettingsAutocomplete","KIND_OPTIONS","Object","entries","map","id","config","group","filter","disableSelectorOption","DECIMAL_PLACES_OPTIONS","label","decimalPlaces","undefined","getOptionByDecimalPlaces","find","o","FormatControls","value","onChange","disabled","hasDecimalPlaces","hasShortValues","handleKindChange","_","newValue","unit","handleDecimalPlacesChange","handleShortValuesChange","checked","shortValues","unitConfig","control","options","groupBy","option","disableClearable","getOptionLabel"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;;AACjC,SAASA,MAAM,QAAqB,gBAAgB;AACpD,SAEEC,WAAW,EAEXC,uBAAuB,EACvBC,qBAAqB,EACrBC,mBAAmB,QACd,mBAAmB;AAE1B,SAASC,oBAAoB,QAAQ,yBAAyB;AAC9D,SAASC,oBAAoB,QAAQ,0BAA0B;AAY/D,MAAMC,eAAkDC,OAAOC,OAAO,CAACR,aACpES,GAAG,CAAyB,CAAC,CAACC,IAAIC,OAAO;IACxC,OAAO;QACL,GAAGA,MAAM;QACTD,IAAIA;QACJE,OAAOD,OAAOC,KAAK,IAAI;IACzB;AACF,GACCC,MAAM,CAAC,CAACF,SAAW,CAACA,OAAOG,qBAAqB;AAEnD,MAAMC,yBAAuF;IAC3F;QAAEL,IAAI;QAAWM,OAAO;QAAWC,eAAeC;IAAU;IAC5D;QAAER,IAAI;QAAKM,OAAO;QAAKC,eAAe;IAAE;IACxC;QAAEP,IAAI;QAAKM,OAAO;QAAKC,eAAe;IAAE;IACxC;QAAEP,IAAI;QAAKM,OAAO;QAAKC,eAAe;IAAE;IACxC;QAAEP,IAAI;QAAKM,OAAO;QAAKC,eAAe;IAAE;IACxC;QAAEP,IAAI;QAAKM,OAAO;QAAKC,eAAe;IAAE;CACzC;AAED,SAASE,yBACPF,aAAsB;IAEtB,OAAOF,uBAAuBK,IAAI,CAAC,CAACC,IAAMA,EAAEJ,aAAa,KAAKA;AAChE;AAEA,OAAO,SAASK,eAAe,EAAEC,KAAK,EAAEC,QAAQ,EAAEC,WAAW,KAAK,EAAuB;IACvF,MAAMC,mBAAmBzB,wBAAwBsB;IACjD,MAAMI,iBAAiBzB,sBAAsBqB;IAE7C,MAAMK,mBAAmB,CAACC,GAAYC;QACpCN,SAAS;YAAEO,MAAMD,UAAUpB,MAAM;QAAU,IAAI,+CAA+C;IAChG;IAEA,MAAMsB,4BAA4B,CAAC,EACjCf,aAAa,EAKd;QACC,IAAIS,kBAAkB;YACpBF,SAAS;gBACP,GAAGD,KAAK;gBACRN,eAAeA;YACjB;QACF;IACF;IAEA,MAAMgB,0BAAmD,CAACJ,GAAYK;QACpE,IAAIP,gBAAgB;YAClBH,SAAS;gBACP,GAAGD,KAAK;gBACRY,aAAaD;YACf;QACF;IACF;IAEA,MAAME,aAAapC,WAAW,CAACuB,OAAOQ,QAAQ,UAAU;IAExD,qBACE;;0BACE,KAAC3B;gBACCY,OAAM;gBACNqB,uBACE,KAACtC;oBACCmC,SAASP,iBAAiBxB,oBAAoBoB,MAAMY,WAAW,IAAI;oBACnEX,UAAUS;oBACVR,UAAU,CAACE;;;0BAIjB,KAACvB;gBACCY,OAAM;gBACNqB,uBACE,KAAChC;oBACCkB,OAAO;wBAAEb,IAAIa,OAAOQ,QAAQ;wBAAW,GAAGK,UAAU;oBAAC;oBACrDE,SAAShC;oBACTiC,SAAS,CAACC,SAAWA,OAAO5B,KAAK,IAAI;oBACrCY,UAAUI;oBACVa,gBAAgB;oBAChBhB,UAAUA;;;0BAIhB,KAACrB;gBACCY,OAAM;gBACNqB,uBACE,KAAChC;oBACCkB,OAAOJ,yBAAyBI,MAAMN,aAAa;oBACnDqB,SAASvB;oBACT2B,gBAAgB,CAACrB,IAAMA,EAAEL,KAAK;oBAC9BQ,UAAU,CAACK,GAAGN,QAAUS,0BAA0BT;oBAClDE,UAAU,CAACC;oBACXe,gBAAgB;;;;;AAM5B"}
|
|
@@ -27,8 +27,9 @@ const _OptionsEditorLayout = require("../OptionsEditorLayout");
|
|
|
27
27
|
const _SettingsAutocomplete = require("../SettingsAutocomplete");
|
|
28
28
|
const KIND_OPTIONS = Object.entries(_core.UNIT_CONFIG).map(([id, config])=>{
|
|
29
29
|
return {
|
|
30
|
+
...config,
|
|
30
31
|
id: id,
|
|
31
|
-
|
|
32
|
+
group: config.group || 'Decimal'
|
|
32
33
|
};
|
|
33
34
|
}).filter((config)=>!config.disableSelectorOption);
|
|
34
35
|
const DECIMAL_PLACES_OPTIONS = [
|
|
@@ -71,8 +72,8 @@ function FormatControls({ value, onChange, disabled = false }) {
|
|
|
71
72
|
const hasShortValues = (0, _core.isUnitWithShortValues)(value);
|
|
72
73
|
const handleKindChange = (_, newValue)=>{
|
|
73
74
|
onChange({
|
|
74
|
-
unit: newValue
|
|
75
|
-
});
|
|
75
|
+
unit: newValue?.id || 'decimal'
|
|
76
|
+
}); // Fallback to 'decimal' if no unit is selected
|
|
76
77
|
};
|
|
77
78
|
const handleDecimalPlacesChange = ({ decimalPlaces })=>{
|
|
78
79
|
if (hasDecimalPlaces) {
|
|
@@ -90,7 +91,7 @@ function FormatControls({ value, onChange, disabled = false }) {
|
|
|
90
91
|
});
|
|
91
92
|
}
|
|
92
93
|
};
|
|
93
|
-
const unitConfig = _core.UNIT_CONFIG[value
|
|
94
|
+
const unitConfig = _core.UNIT_CONFIG[value?.unit || 'decimal'];
|
|
94
95
|
return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
|
|
95
96
|
children: [
|
|
96
97
|
/*#__PURE__*/ (0, _jsxruntime.jsx)(_OptionsEditorLayout.OptionsEditorControl, {
|
|
@@ -105,11 +106,11 @@ function FormatControls({ value, onChange, disabled = false }) {
|
|
|
105
106
|
label: "Unit",
|
|
106
107
|
control: /*#__PURE__*/ (0, _jsxruntime.jsx)(_SettingsAutocomplete.SettingsAutocomplete, {
|
|
107
108
|
value: {
|
|
108
|
-
id: value
|
|
109
|
+
id: value?.unit || 'decimal',
|
|
109
110
|
...unitConfig
|
|
110
111
|
},
|
|
111
112
|
options: KIND_OPTIONS,
|
|
112
|
-
groupBy: (option)=>option.group,
|
|
113
|
+
groupBy: (option)=>option.group ?? 'Decimal',
|
|
113
114
|
onChange: handleKindChange,
|
|
114
115
|
disableClearable: true,
|
|
115
116
|
disabled: disabled
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@perses-dev/components",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.52.0-beta.0",
|
|
4
4
|
"description": "Common UI components used across Perses features",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"homepage": "https://github.com/perses/perses/blob/main/README.md",
|
|
@@ -33,7 +33,7 @@
|
|
|
33
33
|
"@codemirror/lang-json": "^6.0.1",
|
|
34
34
|
"@fontsource/lato": "^4.5.10",
|
|
35
35
|
"@mui/x-date-pickers": "^7.23.1",
|
|
36
|
-
"@perses-dev/core": "0.
|
|
36
|
+
"@perses-dev/core": "0.52.0-beta.0",
|
|
37
37
|
"@tanstack/react-table": "^8.20.5",
|
|
38
38
|
"@uiw/react-codemirror": "^4.19.1",
|
|
39
39
|
"date-fns": "^4.1.0",
|