@dktunited-techoff/techoff-suite-ui 1.14.5 → 1.14.7

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.
@@ -7,7 +7,7 @@ export const TsInput = ({ byDefault, error, icon, label, value, warning, onChang
7
7
  return (React.createElement("div", { className: `ts-input ${byDefault ? 'ts-input--padding-2' : icon ? 'ts-input--padding-1' : 'ts-input--padding-0'}` },
8
8
  label && React.createElement("div", { className: "ts-input-label" }, label),
9
9
  React.createElement("div", { className: `ts-input-container ${error || warning ? `ts-input-container--${error ? 'error' : 'warning'}` : ''}` },
10
- React.createElement("input", { type: "text", value: value, onChange: e => onChange(e.target.value), ...props }),
10
+ React.createElement("input", { type: "text", value: value, onChange: e => onChange(e.target.value), onWheel: (e) => e.target.blur(), ...props }),
11
11
  byDefault && React.createElement("div", { className: "ts-input-tag" },
12
12
  byDefault,
13
13
  " by default"),
@@ -1 +1 @@
1
- {"version":3,"file":"TsInput.js","sourceRoot":"","sources":["../../../../src/components/TsInput/TsInput/TsInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAE7C,OAAO,eAAe,CAAC;AAEvB,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAgB,EAAE,EAAE;IAC7G,YAAY;IACZ,YAAY;IACZ,OAAO,CACL,6BACE,SAAS,EAAE,YAAY,SAAS,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,qBAAqB,EAAE;QAEhH,KAAK,IAAI,6BAAK,SAAS,EAAC,gBAAgB,IAAE,KAAK,CAAO;QACvD,6BACE,SAAS,EAAE,sBAAsB,KAAK,IAAI,OAAO,CAAC,CAAC,CAAC,uBAAuB,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE;YAE/G,+BAAO,IAAI,EAAC,MAAM,EAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,KAAM,KAAK,GAAI;YACtF,SAAS,IAAI,6BAAK,SAAS,EAAC,cAAc;gBAAE,SAAS;8BAAkB;YACvE,IAAI,IAAI,CACP,6BAAK,SAAS,EAAC,eAAe;gBAC5B,oBAAC,MAAM,IAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAC,IAAI,GAAG,CAC5B,CACP,CACG;QAEL,CAAC,KAAK,IAAI,OAAO,CAAC,IAAI,CACrB,6BAAK,SAAS,EAAE,kBAAkB,OAAO,CAAC,CAAC,CAAC,yBAAyB,CAAC,CAAC,CAAC,EAAE,EAAE;YAC1E,6BAAK,SAAS,EAAC,sBAAsB;gBACnC,oBAAC,MAAM,IAAC,IAAI,EAAC,cAAc,EAAC,IAAI,EAAC,IAAI,GAAG,CACpC;YACN,6BAAK,SAAS,EAAC,uBAAuB,IAAE,KAAK,IAAI,OAAO,CAAO,CAC3D,CACP,CACG,CACP,CAAC;AACJ,CAAC,CAAC"}
1
+ {"version":3,"file":"TsInput.js","sourceRoot":"","sources":["../../../../src/components/TsInput/TsInput/TsInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAE7C,OAAO,eAAe,CAAC;AAEvB,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAgB,EAAE,EAAE;IAC7G,YAAY;IACZ,YAAY;IACZ,OAAO,CACL,6BACE,SAAS,EAAE,YAAY,SAAS,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,qBAAqB,EAAE;QAEhH,KAAK,IAAI,6BAAK,SAAS,EAAC,gBAAgB,IAAE,KAAK,CAAO;QACvD,6BACE,SAAS,EAAE,sBAAsB,KAAK,IAAI,OAAO,CAAC,CAAC,CAAC,uBAAuB,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE;YAE/G,+BACE,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EACvC,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAE,CAAC,CAAC,MAA2B,CAAC,IAAI,EAAE,KACjD,KAAK,GACT;YACD,SAAS,IAAI,6BAAK,SAAS,EAAC,cAAc;gBAAE,SAAS;8BAAkB;YACvE,IAAI,IAAI,CACP,6BAAK,SAAS,EAAC,eAAe;gBAC5B,oBAAC,MAAM,IAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAC,IAAI,GAAG,CAC5B,CACP,CACG;QAEL,CAAC,KAAK,IAAI,OAAO,CAAC,IAAI,CACrB,6BAAK,SAAS,EAAE,kBAAkB,OAAO,CAAC,CAAC,CAAC,yBAAyB,CAAC,CAAC,CAAC,EAAE,EAAE;YAC1E,6BAAK,SAAS,EAAC,sBAAsB;gBACnC,oBAAC,MAAM,IAAC,IAAI,EAAC,cAAc,EAAC,IAAI,EAAC,IAAI,GAAG,CACpC;YACN,6BAAK,SAAS,EAAC,uBAAuB,IAAE,KAAK,IAAI,OAAO,CAAO,CAC3D,CACP,CACG,CACP,CAAC;AACJ,CAAC,CAAC"}
@@ -14,7 +14,13 @@ export const TsInput = ({ byDefault, error, icon, label, value, warning, onChang
14
14
  <div
15
15
  className={`ts-input-container ${error || warning ? `ts-input-container--${error ? 'error' : 'warning'}` : ''}`}
16
16
  >
17
- <input type="text" value={value} onChange={e => onChange(e.target.value)} {...props} />
17
+ <input
18
+ type="text"
19
+ value={value}
20
+ onChange={e => onChange(e.target.value)}
21
+ onWheel={(e) => (e.target as HTMLInputElement).blur()}
22
+ {...props}
23
+ />
18
24
  {byDefault && <div className="ts-input-tag">{byDefault} by default</div>}
19
25
  {icon && (
20
26
  <div className="ts-input-icon">
@@ -28,6 +28,10 @@
28
28
  font-weight: 600;
29
29
  line-height: 150%;
30
30
  }
31
+ .ts-switcher-disabled{
32
+ cursor: not-allowed;
33
+ opacity: 0.5;
34
+ }
31
35
 
32
36
  /* ######### */
33
37
  /* GLOBALS */
@@ -1,4 +1,4 @@
1
1
  import * as React from 'react';
2
2
  import { TsSwitcherProps } from './TsSwitcher.types';
3
3
  import './TsSwitcher.css';
4
- export declare const TsSwitcher: ({ defaultSwitch, switchs, onChange }: TsSwitcherProps) => React.JSX.Element;
4
+ export declare const TsSwitcher: ({ disabled, defaultSwitch, switchs, onChange }: TsSwitcherProps) => React.JSX.Element;
@@ -2,7 +2,7 @@ import * as React from 'react';
2
2
  import { useEffect, useState } from 'react';
3
3
  import { TsIcon } from '../TsIcon/TsIcon';
4
4
  import './TsSwitcher.css';
5
- export const TsSwitcher = ({ defaultSwitch, switchs, onChange }) => {
5
+ export const TsSwitcher = ({ disabled, defaultSwitch, switchs, onChange }) => {
6
6
  const [selectedSwitch, setSelectedSwitch] = useState();
7
7
  // ########
8
8
  // Handlers
@@ -15,7 +15,11 @@ export const TsSwitcher = ({ defaultSwitch, switchs, onChange }) => {
15
15
  useEffect(() => setSelectedSwitch(defaultSwitch ?? ''), [defaultSwitch]);
16
16
  // #########
17
17
  // Rendering
18
- return (React.createElement("div", { className: "ts-content-switcher" }, switchs.map(s => (React.createElement("div", { key: s.value, className: `ts-switcher ${selectedSwitch === s.value ? 'ts-switcher--selected' : ''}`, onClick: () => handleChange(s.value) },
18
+ return (React.createElement("div", { className: "ts-content-switcher" }, switchs.map(s => (React.createElement("div", { key: s.value, className: `
19
+ ts-switcher
20
+ ${selectedSwitch === s.value ? 'ts-switcher--selected' : ''}
21
+ ${disabled ? 'ts-switcher-disabled' : ''}
22
+ `, onClick: () => !disabled && handleChange(s.value) },
19
23
  s.icon && (React.createElement("div", { className: "ts-switcher-icon" },
20
24
  React.createElement(TsIcon, { name: s.icon }))),
21
25
  React.createElement("div", { className: "ts-switcher-label" }, s.label))))));
@@ -1 +1 @@
1
- {"version":3,"file":"TsSwitcher.js","sourceRoot":"","sources":["../../../src/components/TsSwitcher/TsSwitcher.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAE1C,OAAO,kBAAkB,CAAC;AAE1B,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EAAE,aAAa,EAAE,OAAO,EAAE,QAAQ,EAAmB,EAAE,EAAE;IAClF,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,EAAU,CAAC;IAE/D,WAAW;IACX,WAAW;IACX,MAAM,YAAY,GAAG,CAAC,GAAW,EAAE,EAAE;QACnC,iBAAiB,CAAC,GAAG,CAAC,CAAC;QACvB,QAAQ,CAAC,GAAG,CAAC,CAAC;IAChB,CAAC,CAAC;IAEF,WAAW;IACX,WAAW;IACX,SAAS,CAAC,GAAG,EAAE,CAAC,iBAAiB,CAAC,aAAa,IAAI,EAAE,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEzE,YAAY;IACZ,YAAY;IACZ,OAAO,CACL,6BAAK,SAAS,EAAC,qBAAqB,IACjC,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAChB,6BACE,GAAG,EAAE,CAAC,CAAC,KAAK,EACZ,SAAS,EAAE,eAAe,cAAc,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC,EAAE,EAAE,EACrF,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC,KAAK,CAAC;QAEnC,CAAC,CAAC,IAAI,IAAI,CACT,6BAAK,SAAS,EAAC,kBAAkB;YAC/B,oBAAC,MAAM,IAAC,IAAI,EAAE,CAAC,CAAC,IAAI,GAAI,CACpB,CACP;QACD,6BAAK,SAAS,EAAC,mBAAmB,IAAE,CAAC,CAAC,KAAK,CAAO,CAC9C,CACP,CAAC,CACE,CACP,CAAC;AACJ,CAAC,CAAC"}
1
+ {"version":3,"file":"TsSwitcher.js","sourceRoot":"","sources":["../../../src/components/TsSwitcher/TsSwitcher.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAE1C,OAAO,kBAAkB,CAAC;AAE1B,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EAAE,QAAQ,EAAE,aAAa,EAAE,OAAO,EAAE,QAAQ,EAAmB,EAAE,EAAE;IAC5F,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,EAAU,CAAC;IAE/D,WAAW;IACX,WAAW;IACX,MAAM,YAAY,GAAG,CAAC,GAAW,EAAE,EAAE;QACnC,iBAAiB,CAAC,GAAG,CAAC,CAAC;QACvB,QAAQ,CAAC,GAAG,CAAC,CAAC;IAChB,CAAC,CAAC;IAEF,WAAW;IACX,WAAW;IACX,SAAS,CAAC,GAAG,EAAE,CAAC,iBAAiB,CAAC,aAAa,IAAI,EAAE,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEzE,YAAY;IACZ,YAAY;IACZ,OAAO,CACL,6BAAK,SAAS,EAAC,qBAAqB,IACjC,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAChB,6BACE,GAAG,EAAE,CAAC,CAAC,KAAK,EACZ,SAAS,EAAE;;cAEP,cAAc,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC,EAAE;cACzD,QAAQ,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,EAAE;WACzC,EACD,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,QAAQ,IAAI,YAAY,CAAC,CAAC,CAAC,KAAK,CAAC;QAEhD,CAAC,CAAC,IAAI,IAAI,CACT,6BAAK,SAAS,EAAC,kBAAkB;YAC/B,oBAAC,MAAM,IAAC,IAAI,EAAE,CAAC,CAAC,IAAI,GAAI,CACpB,CACP;QACD,6BAAK,SAAS,EAAC,mBAAmB,IAAE,CAAC,CAAC,KAAK,CAAO,CAC9C,CACP,CAAC,CACE,CACP,CAAC;AACJ,CAAC,CAAC"}
@@ -4,6 +4,7 @@ export type TsSwitchProps = {
4
4
  value: string;
5
5
  };
6
6
  export type TsSwitcherProps = {
7
+ disabled?: boolean;
7
8
  defaultSwitch?: string;
8
9
  switchs: TsSwitchProps[];
9
10
  onChange: (val: string) => void;
@@ -10,7 +10,7 @@ const TsInput = ({ byDefault, error, icon, label, value, warning, onChange, ...p
10
10
  return (React.createElement("div", { className: `ts-input ${byDefault ? 'ts-input--padding-2' : icon ? 'ts-input--padding-1' : 'ts-input--padding-0'}` },
11
11
  label && React.createElement("div", { className: "ts-input-label" }, label),
12
12
  React.createElement("div", { className: `ts-input-container ${error || warning ? `ts-input-container--${error ? 'error' : 'warning'}` : ''}` },
13
- React.createElement("input", { type: "text", value: value, onChange: e => onChange(e.target.value), ...props }),
13
+ React.createElement("input", { type: "text", value: value, onChange: e => onChange(e.target.value), onWheel: (e) => e.target.blur(), ...props }),
14
14
  byDefault && React.createElement("div", { className: "ts-input-tag" },
15
15
  byDefault,
16
16
  " by default"),
@@ -1 +1 @@
1
- {"version":3,"file":"TsInput.js","sourceRoot":"","sources":["../../../../src/components/TsInput/TsInput/TsInput.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAC/B,gDAA6C;AAE7C,yBAAuB;AAEhB,MAAM,OAAO,GAAG,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAgB,EAAE,EAAE;IAC7G,YAAY;IACZ,YAAY;IACZ,OAAO,CACL,6BACE,SAAS,EAAE,YAAY,SAAS,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,qBAAqB,EAAE;QAEhH,KAAK,IAAI,6BAAK,SAAS,EAAC,gBAAgB,IAAE,KAAK,CAAO;QACvD,6BACE,SAAS,EAAE,sBAAsB,KAAK,IAAI,OAAO,CAAC,CAAC,CAAC,uBAAuB,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE;YAE/G,+BAAO,IAAI,EAAC,MAAM,EAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,KAAM,KAAK,GAAI;YACtF,SAAS,IAAI,6BAAK,SAAS,EAAC,cAAc;gBAAE,SAAS;8BAAkB;YACvE,IAAI,IAAI,CACP,6BAAK,SAAS,EAAC,eAAe;gBAC5B,oBAAC,eAAM,IAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAC,IAAI,GAAG,CAC5B,CACP,CACG;QAEL,CAAC,KAAK,IAAI,OAAO,CAAC,IAAI,CACrB,6BAAK,SAAS,EAAE,kBAAkB,OAAO,CAAC,CAAC,CAAC,yBAAyB,CAAC,CAAC,CAAC,EAAE,EAAE;YAC1E,6BAAK,SAAS,EAAC,sBAAsB;gBACnC,oBAAC,eAAM,IAAC,IAAI,EAAC,cAAc,EAAC,IAAI,EAAC,IAAI,GAAG,CACpC;YACN,6BAAK,SAAS,EAAC,uBAAuB,IAAE,KAAK,IAAI,OAAO,CAAO,CAC3D,CACP,CACG,CACP,CAAC;AACJ,CAAC,CAAC;AA9BW,QAAA,OAAO,WA8BlB"}
1
+ {"version":3,"file":"TsInput.js","sourceRoot":"","sources":["../../../../src/components/TsInput/TsInput/TsInput.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAC/B,gDAA6C;AAE7C,yBAAuB;AAEhB,MAAM,OAAO,GAAG,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAgB,EAAE,EAAE;IAC7G,YAAY;IACZ,YAAY;IACZ,OAAO,CACL,6BACE,SAAS,EAAE,YAAY,SAAS,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,qBAAqB,EAAE;QAEhH,KAAK,IAAI,6BAAK,SAAS,EAAC,gBAAgB,IAAE,KAAK,CAAO;QACvD,6BACE,SAAS,EAAE,sBAAsB,KAAK,IAAI,OAAO,CAAC,CAAC,CAAC,uBAAuB,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE;YAE/G,+BACE,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EACvC,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAE,CAAC,CAAC,MAA2B,CAAC,IAAI,EAAE,KACjD,KAAK,GACT;YACD,SAAS,IAAI,6BAAK,SAAS,EAAC,cAAc;gBAAE,SAAS;8BAAkB;YACvE,IAAI,IAAI,CACP,6BAAK,SAAS,EAAC,eAAe;gBAC5B,oBAAC,eAAM,IAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAC,IAAI,GAAG,CAC5B,CACP,CACG;QAEL,CAAC,KAAK,IAAI,OAAO,CAAC,IAAI,CACrB,6BAAK,SAAS,EAAE,kBAAkB,OAAO,CAAC,CAAC,CAAC,yBAAyB,CAAC,CAAC,CAAC,EAAE,EAAE;YAC1E,6BAAK,SAAS,EAAC,sBAAsB;gBACnC,oBAAC,eAAM,IAAC,IAAI,EAAC,cAAc,EAAC,IAAI,EAAC,IAAI,GAAG,CACpC;YACN,6BAAK,SAAS,EAAC,uBAAuB,IAAE,KAAK,IAAI,OAAO,CAAO,CAC3D,CACP,CACG,CACP,CAAC;AACJ,CAAC,CAAC;AApCW,QAAA,OAAO,WAoClB"}
@@ -14,7 +14,13 @@ export const TsInput = ({ byDefault, error, icon, label, value, warning, onChang
14
14
  <div
15
15
  className={`ts-input-container ${error || warning ? `ts-input-container--${error ? 'error' : 'warning'}` : ''}`}
16
16
  >
17
- <input type="text" value={value} onChange={e => onChange(e.target.value)} {...props} />
17
+ <input
18
+ type="text"
19
+ value={value}
20
+ onChange={e => onChange(e.target.value)}
21
+ onWheel={(e) => (e.target as HTMLInputElement).blur()}
22
+ {...props}
23
+ />
18
24
  {byDefault && <div className="ts-input-tag">{byDefault} by default</div>}
19
25
  {icon && (
20
26
  <div className="ts-input-icon">
@@ -28,6 +28,10 @@
28
28
  font-weight: 600;
29
29
  line-height: 150%;
30
30
  }
31
+ .ts-switcher-disabled{
32
+ cursor: not-allowed;
33
+ opacity: 0.5;
34
+ }
31
35
 
32
36
  /* ######### */
33
37
  /* GLOBALS */
@@ -1,4 +1,4 @@
1
1
  import * as React from 'react';
2
2
  import { TsSwitcherProps } from './TsSwitcher.types';
3
3
  import './TsSwitcher.css';
4
- export declare const TsSwitcher: ({ defaultSwitch, switchs, onChange }: TsSwitcherProps) => React.JSX.Element;
4
+ export declare const TsSwitcher: ({ disabled, defaultSwitch, switchs, onChange }: TsSwitcherProps) => React.JSX.Element;
@@ -5,7 +5,7 @@ const React = require("react");
5
5
  const react_1 = require("react");
6
6
  const TsIcon_1 = require("../TsIcon/TsIcon");
7
7
  require("./TsSwitcher.css");
8
- const TsSwitcher = ({ defaultSwitch, switchs, onChange }) => {
8
+ const TsSwitcher = ({ disabled, defaultSwitch, switchs, onChange }) => {
9
9
  const [selectedSwitch, setSelectedSwitch] = (0, react_1.useState)();
10
10
  // ########
11
11
  // Handlers
@@ -18,7 +18,11 @@ const TsSwitcher = ({ defaultSwitch, switchs, onChange }) => {
18
18
  (0, react_1.useEffect)(() => setSelectedSwitch(defaultSwitch ?? ''), [defaultSwitch]);
19
19
  // #########
20
20
  // Rendering
21
- return (React.createElement("div", { className: "ts-content-switcher" }, switchs.map(s => (React.createElement("div", { key: s.value, className: `ts-switcher ${selectedSwitch === s.value ? 'ts-switcher--selected' : ''}`, onClick: () => handleChange(s.value) },
21
+ return (React.createElement("div", { className: "ts-content-switcher" }, switchs.map(s => (React.createElement("div", { key: s.value, className: `
22
+ ts-switcher
23
+ ${selectedSwitch === s.value ? 'ts-switcher--selected' : ''}
24
+ ${disabled ? 'ts-switcher-disabled' : ''}
25
+ `, onClick: () => !disabled && handleChange(s.value) },
22
26
  s.icon && (React.createElement("div", { className: "ts-switcher-icon" },
23
27
  React.createElement(TsIcon_1.TsIcon, { name: s.icon }))),
24
28
  React.createElement("div", { className: "ts-switcher-label" }, s.label))))));
@@ -1 +1 @@
1
- {"version":3,"file":"TsSwitcher.js","sourceRoot":"","sources":["../../../src/components/TsSwitcher/TsSwitcher.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAC/B,iCAA4C;AAC5C,6CAA0C;AAE1C,4BAA0B;AAEnB,MAAM,UAAU,GAAG,CAAC,EAAE,aAAa,EAAE,OAAO,EAAE,QAAQ,EAAmB,EAAE,EAAE;IAClF,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,IAAA,gBAAQ,GAAU,CAAC;IAE/D,WAAW;IACX,WAAW;IACX,MAAM,YAAY,GAAG,CAAC,GAAW,EAAE,EAAE;QACnC,iBAAiB,CAAC,GAAG,CAAC,CAAC;QACvB,QAAQ,CAAC,GAAG,CAAC,CAAC;IAChB,CAAC,CAAC;IAEF,WAAW;IACX,WAAW;IACX,IAAA,iBAAS,EAAC,GAAG,EAAE,CAAC,iBAAiB,CAAC,aAAa,IAAI,EAAE,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEzE,YAAY;IACZ,YAAY;IACZ,OAAO,CACL,6BAAK,SAAS,EAAC,qBAAqB,IACjC,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAChB,6BACE,GAAG,EAAE,CAAC,CAAC,KAAK,EACZ,SAAS,EAAE,eAAe,cAAc,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC,EAAE,EAAE,EACrF,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC,KAAK,CAAC;QAEnC,CAAC,CAAC,IAAI,IAAI,CACT,6BAAK,SAAS,EAAC,kBAAkB;YAC/B,oBAAC,eAAM,IAAC,IAAI,EAAE,CAAC,CAAC,IAAI,GAAI,CACpB,CACP;QACD,6BAAK,SAAS,EAAC,mBAAmB,IAAE,CAAC,CAAC,KAAK,CAAO,CAC9C,CACP,CAAC,CACE,CACP,CAAC;AACJ,CAAC,CAAC;AAlCW,QAAA,UAAU,cAkCrB"}
1
+ {"version":3,"file":"TsSwitcher.js","sourceRoot":"","sources":["../../../src/components/TsSwitcher/TsSwitcher.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAC/B,iCAA4C;AAC5C,6CAA0C;AAE1C,4BAA0B;AAEnB,MAAM,UAAU,GAAG,CAAC,EAAE,QAAQ,EAAE,aAAa,EAAE,OAAO,EAAE,QAAQ,EAAmB,EAAE,EAAE;IAC5F,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,IAAA,gBAAQ,GAAU,CAAC;IAE/D,WAAW;IACX,WAAW;IACX,MAAM,YAAY,GAAG,CAAC,GAAW,EAAE,EAAE;QACnC,iBAAiB,CAAC,GAAG,CAAC,CAAC;QACvB,QAAQ,CAAC,GAAG,CAAC,CAAC;IAChB,CAAC,CAAC;IAEF,WAAW;IACX,WAAW;IACX,IAAA,iBAAS,EAAC,GAAG,EAAE,CAAC,iBAAiB,CAAC,aAAa,IAAI,EAAE,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEzE,YAAY;IACZ,YAAY;IACZ,OAAO,CACL,6BAAK,SAAS,EAAC,qBAAqB,IACjC,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAChB,6BACE,GAAG,EAAE,CAAC,CAAC,KAAK,EACZ,SAAS,EAAE;;cAEP,cAAc,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC,EAAE;cACzD,QAAQ,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,EAAE;WACzC,EACD,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,QAAQ,IAAI,YAAY,CAAC,CAAC,CAAC,KAAK,CAAC;QAEhD,CAAC,CAAC,IAAI,IAAI,CACT,6BAAK,SAAS,EAAC,kBAAkB;YAC/B,oBAAC,eAAM,IAAC,IAAI,EAAE,CAAC,CAAC,IAAI,GAAI,CACpB,CACP;QACD,6BAAK,SAAS,EAAC,mBAAmB,IAAE,CAAC,CAAC,KAAK,CAAO,CAC9C,CACP,CAAC,CACE,CACP,CAAC;AACJ,CAAC,CAAC;AAtCW,QAAA,UAAU,cAsCrB"}
@@ -4,6 +4,7 @@ export type TsSwitchProps = {
4
4
  value: string;
5
5
  };
6
6
  export type TsSwitcherProps = {
7
+ disabled?: boolean;
7
8
  defaultSwitch?: string;
8
9
  switchs: TsSwitchProps[];
9
10
  onChange: (val: string) => void;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dktunited-techoff/techoff-suite-ui",
3
- "version": "1.14.5",
3
+ "version": "1.14.7",
4
4
  "main": "lib/index.js",
5
5
  "types": "./lib",
6
6
  "module": "esm/index.js",
@@ -14,7 +14,13 @@ export const TsInput = ({ byDefault, error, icon, label, value, warning, onChang
14
14
  <div
15
15
  className={`ts-input-container ${error || warning ? `ts-input-container--${error ? 'error' : 'warning'}` : ''}`}
16
16
  >
17
- <input type="text" value={value} onChange={e => onChange(e.target.value)} {...props} />
17
+ <input
18
+ type="text"
19
+ value={value}
20
+ onChange={e => onChange(e.target.value)}
21
+ onWheel={(e) => (e.target as HTMLInputElement).blur()}
22
+ {...props}
23
+ />
18
24
  {byDefault && <div className="ts-input-tag">{byDefault} by default</div>}
19
25
  {icon && (
20
26
  <div className="ts-input-icon">
@@ -28,6 +28,10 @@
28
28
  font-weight: 600;
29
29
  line-height: 150%;
30
30
  }
31
+ .ts-switcher-disabled{
32
+ cursor: not-allowed;
33
+ opacity: 0.5;
34
+ }
31
35
 
32
36
  /* ######### */
33
37
  /* GLOBALS */
@@ -4,7 +4,7 @@ import { TsIcon } from '../TsIcon/TsIcon';
4
4
  import { TsSwitcherProps } from './TsSwitcher.types';
5
5
  import './TsSwitcher.css';
6
6
 
7
- export const TsSwitcher = ({ defaultSwitch, switchs, onChange }: TsSwitcherProps) => {
7
+ export const TsSwitcher = ({ disabled, defaultSwitch, switchs, onChange }: TsSwitcherProps) => {
8
8
  const [selectedSwitch, setSelectedSwitch] = useState<string>();
9
9
 
10
10
  // ########
@@ -25,8 +25,12 @@ export const TsSwitcher = ({ defaultSwitch, switchs, onChange }: TsSwitcherProps
25
25
  {switchs.map(s => (
26
26
  <div
27
27
  key={s.value}
28
- className={`ts-switcher ${selectedSwitch === s.value ? 'ts-switcher--selected' : ''}`}
29
- onClick={() => handleChange(s.value)}
28
+ className={`
29
+ ts-switcher
30
+ ${selectedSwitch === s.value ? 'ts-switcher--selected' : ''}
31
+ ${disabled ? 'ts-switcher-disabled' : ''}
32
+ `}
33
+ onClick={() => !disabled && handleChange(s.value)}
30
34
  >
31
35
  {s.icon && (
32
36
  <div className="ts-switcher-icon">
@@ -1,2 +1,2 @@
1
1
  export type TsSwitchProps = { icon?: string; label: string; value: string };
2
- export type TsSwitcherProps = { defaultSwitch?: string; switchs: TsSwitchProps[]; onChange: (val: string) => void };
2
+ export type TsSwitcherProps = { disabled?: boolean; defaultSwitch?: string; switchs: TsSwitchProps[]; onChange: (val: string) => void };