@digdir/designsystemet-react 1.0.0-rc.8 → 1.0.0-rc.9

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.
Files changed (15) hide show
  1. package/dist/cjs/components/Tabs/Tab.js +3 -2
  2. package/dist/cjs/components/Tabs/TabContent.js +2 -2
  3. package/dist/cjs/components/Tabs/Tabs.js +2 -1
  4. package/dist/cjs/components/Tabs/useTab.js +1 -0
  5. package/dist/esm/components/Tabs/Tab.js +3 -2
  6. package/dist/esm/components/Tabs/TabContent.js +2 -2
  7. package/dist/esm/components/Tabs/Tabs.js +2 -1
  8. package/dist/esm/components/Tabs/useTab.js +1 -0
  9. package/dist/types/components/Tabs/Tab.d.ts.map +1 -1
  10. package/dist/types/components/Tabs/TabContent.d.ts.map +1 -1
  11. package/dist/types/components/Tabs/Tabs.d.ts +1 -0
  12. package/dist/types/components/Tabs/Tabs.d.ts.map +1 -1
  13. package/dist/types/components/Tabs/useTab.d.ts +4 -1
  14. package/dist/types/components/Tabs/useTab.d.ts.map +1 -1
  15. package/package.json +2 -2
package/dist/cjs/components/Tabs/Tab.js CHANGED
@@ -6,11 +6,12 @@ var React = require('react');
6
6
  var lite = require('../../node_modules/clsx/dist/lite.js');
7
7
  var useTab = require('./useTab.js');
8
8
  var RovingTabindexItem = require('../../utilities/RovingTabIndex/RovingTabindexItem.js');
9
+ var Paragraph = require('../Typography/Paragraph/Paragraph.js');
9
10
 
10
11
  const Tab = React.forwardRef((props, ref) => {
11
12
  const { children, className, ...rest } = props;
12
- const { ...useTabRest } = useTab.useTabItem(props);
13
- return (jsxRuntime.jsx(RovingTabindexItem.RovingTabindexItem, { ...rest, asChild: true, children: jsxRuntime.jsx("button", { ...useTabRest, type: 'button', className: lite.clsx('ds-tabs__tab', 'ds-focus', className), ref: ref, children: children }) }));
13
+ const { size, ...useTabRest } = useTab.useTabItem(props);
14
+ return (jsxRuntime.jsx(RovingTabindexItem.RovingTabindexItem, { ...rest, asChild: true, children: jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, variant: 'short', size: size, children: jsxRuntime.jsx("button", { ...useTabRest, type: 'button', className: lite.clsx('ds-tabs__tab', 'ds-focus', className), ref: ref, children: children }) }) }));
14
15
  });
15
16
  Tab.displayName = 'Tab';
16
17
 
package/dist/cjs/components/Tabs/TabContent.js CHANGED
@@ -8,9 +8,9 @@ var Tabs = require('./Tabs.js');
8
8
  var Paragraph = require('../Typography/Paragraph/Paragraph.js');
9
9
 
10
10
  const TabContent = React.forwardRef(({ children, value, className, ...rest }, ref) => {
11
- const { value: tabsValue } = React.useContext(Tabs.TabsContext);
11
+ const { value: tabsValue, size } = React.useContext(Tabs.TabsContext);
12
12
  const active = value == tabsValue;
13
- return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: active && (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, children: jsxRuntime.jsx("div", { className: lite.clsx('ds-tabs__content', className), ref: ref, ...rest, children: children }) })) }));
13
+ return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: active && (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, variant: 'short', size: size, children: jsxRuntime.jsx("div", { className: lite.clsx('ds-tabs__content', className), ref: ref, ...rest, children: children }) })) }));
14
14
  });
15
15
  TabContent.displayName = 'TabContent';
16
16
 
package/dist/cjs/components/Tabs/Tabs.js CHANGED
@@ -21,7 +21,8 @@ const Tabs = React.forwardRef(({ size = 'md', children, value, defaultValue, cla
21
21
  value,
22
22
  defaultValue,
23
23
  onChange: onValueChange,
24
- }, children: jsxRuntime.jsx("div", { className: lite.clsx(`ds-tabs--${size}`, `ds-paragraph-short--${size}`, className), ref: ref, ...rest, children: children }) }));
24
+ size,
25
+ }, children: jsxRuntime.jsx("div", { className: lite.clsx(`ds-tabs--${size}`, className), ref: ref, ...rest, children: children }) }));
25
26
  });
26
27
  Tabs.displayName = 'Tabs';
27
28
 
package/dist/cjs/components/Tabs/useTab.js CHANGED
@@ -14,6 +14,7 @@ const useTabItem = (props) => {
14
14
  id: buttonId,
15
15
  'aria-selected': tabs.value == value,
16
16
  role: 'tab',
17
+ size: tabs.size,
17
18
  onClick: () => {
18
19
  tabs.onChange?.(value);
19
20
  },
package/dist/esm/components/Tabs/Tab.js CHANGED
@@ -4,11 +4,12 @@ import { forwardRef } from 'react';
4
4
  import { clsx } from '../../node_modules/clsx/dist/lite.js';
5
5
  import { useTabItem } from './useTab.js';
6
6
  import { RovingTabindexItem } from '../../utilities/RovingTabIndex/RovingTabindexItem.js';
7
+ import { Paragraph } from '../Typography/Paragraph/Paragraph.js';
7
8
 
8
9
  const Tab = forwardRef((props, ref) => {
9
10
  const { children, className, ...rest } = props;
10
- const { ...useTabRest } = useTabItem(props);
11
- return (jsx(RovingTabindexItem, { ...rest, asChild: true, children: jsx("button", { ...useTabRest, type: 'button', className: clsx('ds-tabs__tab', 'ds-focus', className), ref: ref, children: children }) }));
11
+ const { size, ...useTabRest } = useTabItem(props);
12
+ return (jsx(RovingTabindexItem, { ...rest, asChild: true, children: jsx(Paragraph, { asChild: true, variant: 'short', size: size, children: jsx("button", { ...useTabRest, type: 'button', className: clsx('ds-tabs__tab', 'ds-focus', className), ref: ref, children: children }) }) }));
12
13
  });
13
14
  Tab.displayName = 'Tab';
14
15
 
package/dist/esm/components/Tabs/TabContent.js CHANGED
@@ -6,9 +6,9 @@ import { TabsContext } from './Tabs.js';
6
6
  import { Paragraph } from '../Typography/Paragraph/Paragraph.js';
7
7
 
8
8
  const TabContent = forwardRef(({ children, value, className, ...rest }, ref) => {
9
- const { value: tabsValue } = useContext(TabsContext);
9
+ const { value: tabsValue, size } = useContext(TabsContext);
10
10
  const active = value == tabsValue;
11
- return (jsx(Fragment, { children: active && (jsx(Paragraph, { asChild: true, children: jsx("div", { className: clsx('ds-tabs__content', className), ref: ref, ...rest, children: children }) })) }));
11
+ return (jsx(Fragment, { children: active && (jsx(Paragraph, { asChild: true, variant: 'short', size: size, children: jsx("div", { className: clsx('ds-tabs__content', className), ref: ref, ...rest, children: children }) })) }));
12
12
  });
13
13
  TabContent.displayName = 'TabContent';
14
14
 
package/dist/esm/components/Tabs/Tabs.js CHANGED
@@ -19,7 +19,8 @@ const Tabs = forwardRef(({ size = 'md', children, value, defaultValue, className
19
19
  value,
20
20
  defaultValue,
21
21
  onChange: onValueChange,
22
- }, children: jsx("div", { className: clsx(`ds-tabs--${size}`, `ds-paragraph-short--${size}`, className), ref: ref, ...rest, children: children }) }));
22
+ size,
23
+ }, children: jsx("div", { className: clsx(`ds-tabs--${size}`, className), ref: ref, ...rest, children: children }) }));
23
24
  });
24
25
  Tabs.displayName = 'Tabs';
25
26
 
package/dist/esm/components/Tabs/useTab.js CHANGED
@@ -12,6 +12,7 @@ const useTabItem = (props) => {
12
12
  id: buttonId,
13
13
  'aria-selected': tabs.value == value,
14
14
  role: 'tab',
15
+ size: tabs.size,
15
16
  onClick: () => {
16
17
  tabs.onChange?.(value);
17
18
  },
package/dist/types/components/Tabs/Tab.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Tab.d.ts","sourceRoot":"","sources":["../../../../src/components/Tabs/Tab.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAQ5C,MAAM,MAAM,QAAQ,GAAG;IACrB,qFAAqF;IACrF,KAAK,EAAE,MAAM,CAAC;CACf,GAAG,IAAI,CAAC,cAAc,CAAC,iBAAiB,CAAC,EAAE,OAAO,CAAC,CAAC;AAErD,eAAO,MAAM,GAAG;IAJd,qFAAqF;WAC9E,MAAM;wGAsBb,CAAC"}
1
+ {"version":3,"file":"Tab.d.ts","sourceRoot":"","sources":["../../../../src/components/Tabs/Tab.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAS5C,MAAM,MAAM,QAAQ,GAAG;IACrB,qFAAqF;IACrF,KAAK,EAAE,MAAM,CAAC;CACf,GAAG,IAAI,CAAC,cAAc,CAAC,iBAAiB,CAAC,EAAE,OAAO,CAAC,CAAC;AAErD,eAAO,MAAM,GAAG;IAJd,qFAAqF;WAC9E,MAAM;wGA4Bb,CAAC"}
package/dist/types/components/Tabs/TabContent.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"TabContent.d.ts","sourceRoot":"","sources":["../../../../src/components/Tabs/TabContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAQ5C,MAAM,MAAM,eAAe,GAAG;IAC5B,0FAA0F;IAC1F,KAAK,EAAE,MAAM,CAAC;CACf,GAAG,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC,CAAC;AAElD,eAAO,MAAM,UAAU;IAJrB,0FAA0F;WACnF,MAAM;kGAwBd,CAAC"}
1
+ {"version":3,"file":"TabContent.d.ts","sourceRoot":"","sources":["../../../../src/components/Tabs/TabContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAQ5C,MAAM,MAAM,eAAe,GAAG;IAC5B,0FAA0F;IAC1F,KAAK,EAAE,MAAM,CAAC;CACf,GAAG,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC,CAAC;AAElD,eAAO,MAAM,UAAU;IAJrB,0FAA0F;WACnF,MAAM;kGA4Bd,CAAC"}
package/dist/types/components/Tabs/Tabs.d.ts CHANGED
@@ -31,6 +31,7 @@ export type TabsContextProps = {
31
31
  value?: string;
32
32
  defaultValue?: string;
33
33
  onChange?: (value: string) => void;
34
+ size?: TabsProps['size'];
34
35
  };
35
36
  export declare const TabsContext: import("react").Context<TabsContextProps>;
36
37
  export declare const Tabs: import("react").ForwardRefExoticComponent<{
package/dist/types/components/Tabs/Tabs.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../../src/components/Tabs/Tabs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAI5C,MAAM,MAAM,SAAS,GAAG;IACtB,6CAA6C;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,qBAAqB;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC;;;OAGG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;CAC3B,GAAG,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC,CAAC;AAE/D;;;;;;;;;;;;;;GAcG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC,CAAC;AAEF,eAAO,MAAM,WAAW,2CAAsC,CAAC;AAE/D,eAAO,MAAM,IAAI;IApCf,6CAA6C;;IAE7C,qBAAqB;;IAErB,+CAA+C;wBAC5B,MAAM,KAAK,IAAI;IAClC;;;OAGG;;+GA2EJ,CAAC"}
1
+ {"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../../src/components/Tabs/Tabs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAI5C,MAAM,MAAM,SAAS,GAAG;IACtB,6CAA6C;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,qBAAqB;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC;;;OAGG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;CAC3B,GAAG,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC,CAAC;AAE/D;;;;;;;;;;;;;;GAcG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,IAAI,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,WAAW,2CAAsC,CAAC;AAE/D,eAAO,MAAM,IAAI;IArCf,6CAA6C;;IAE7C,qBAAqB;;IAErB,+CAA+C;wBAC5B,MAAM,KAAK,IAAI;IAClC;;;OAGG;;+GAyEJ,CAAC"}
package/dist/types/components/Tabs/useTab.d.ts CHANGED
@@ -1,6 +1,9 @@
1
1
  import type { HTMLAttributes } from 'react';
2
+ import type { TabsContextProps } from './Tabs';
2
3
  import type { TabProps } from '.';
3
- type UseTab = (props: TabProps) => Pick<HTMLAttributes<HTMLButtonElement>, 'id' | 'aria-selected' | 'role' | 'onClick'>;
4
+ type UseTab = (props: TabProps) => Pick<HTMLAttributes<HTMLButtonElement>, 'id' | 'aria-selected' | 'role' | 'onClick'> & {
5
+ size?: TabsContextProps['size'];
6
+ };
4
7
  /** Handles props for `Tab` in context with `Tabs` */
5
8
  export declare const useTabItem: UseTab;
6
9
  export {};
package/dist/types/components/Tabs/useTab.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"useTab.d.ts","sourceRoot":"","sources":["../../../../src/components/Tabs/useTab.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAK5C,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,GAAG,CAAC;AAElC,KAAK,MAAM,GAAG,CACZ,KAAK,EAAE,QAAQ,KACZ,IAAI,CACP,cAAc,CAAC,iBAAiB,CAAC,EACjC,IAAI,GAAG,eAAe,GAAG,MAAM,GAAG,SAAS,CAC5C,CAAC;AAEF,qDAAqD;AACrD,eAAO,MAAM,UAAU,EAAE,MAcxB,CAAC"}
1
+ {"version":3,"file":"useTab.d.ts","sourceRoot":"","sources":["../../../../src/components/Tabs/useTab.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAG5C,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,QAAQ,CAAC;AAG/C,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,GAAG,CAAC;AAElC,KAAK,MAAM,GAAG,CACZ,KAAK,EAAE,QAAQ,KACZ,IAAI,CACP,cAAc,CAAC,iBAAiB,CAAC,EACjC,IAAI,GAAG,eAAe,GAAG,MAAM,GAAG,SAAS,CAC5C,GAAG;IAAE,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAA;CAAE,CAAC;AAExC,qDAAqD;AACrD,eAAO,MAAM,UAAU,EAAE,MAexB,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@digdir/designsystemet-react",
3
- "version": "1.0.0-rc.8",
3
+ "version": "1.0.0-rc.9",
4
4
  "description": "React components for Designsystemet",
5
5
  "author": "Designsystemet team",
6
6
  "repository": "https://github.com/digdir/designsystemet",
@@ -39,5 +39,5 @@
39
39
  "rollup": "^4.12.1",
40
40
  "typescript": "^5.4.2"
41
41
  },
42
- "gitHead": "87591aa2ce0bbcb4fc451ddcbb2ae9f15cfcfeca"
42
+ "gitHead": "be57fec5efe257a06e072ad68713670c9511a119"
43
43
  }