@sikt/sds-tabs 3.3.0 → 3.4.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/CHANGELOG.md +7 -0
- package/dist/index.d.mts +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +1 -1
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,13 @@
|
|
|
2
2
|
|
|
3
3
|
All notable changes to this project will be documented in this file. See [commit-and-tag-version](https://github.com/absolute-version/commit-and-tag-version) for commit guidelines.
|
|
4
4
|
|
|
5
|
+
## [3.4.0](https://gitlab.sikt.no/designsystem/sds-komponentbibliotek/compare/@sikt/sds-tabs@3.3.0...@sikt/sds-tabs@3.4.0) (2025-10-06)
|
|
6
|
+
|
|
7
|
+
### Features
|
|
8
|
+
|
|
9
|
+
- **badge:** make children optional for icon only badge ([b62e639](https://gitlab.sikt.no/designsystem/sds-komponentbibliotek/commit/b62e6395459f3c600a85eb7681d068f2005f285a))
|
|
10
|
+
- **tab-link:** add asChild prop for Next.js 16 next/link support ([1994e2a](https://gitlab.sikt.no/designsystem/sds-komponentbibliotek/commit/1994e2a691d2f1503397698fc87f899e26c376d5))
|
|
11
|
+
|
|
5
12
|
## [3.3.0](https://gitlab.sikt.no/designsystem/sds-komponentbibliotek/compare/@sikt/sds-tabs@3.2.1...@sikt/sds-tabs@3.3.0) (2025-07-08)
|
|
6
13
|
|
|
7
14
|
### Features
|
package/dist/index.d.mts
CHANGED
|
@@ -38,6 +38,7 @@ interface TabLinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
|
|
|
38
38
|
icon?: ReactNode;
|
|
39
39
|
badge?: ReactNode;
|
|
40
40
|
isSelected?: boolean;
|
|
41
|
+
asChild?: boolean;
|
|
41
42
|
}
|
|
42
43
|
declare const TabLink: react.ForwardRefExoticComponent<TabLinkProps & react.RefAttributes<HTMLAnchorElement>>;
|
|
43
44
|
|
package/dist/index.d.ts
CHANGED
|
@@ -38,6 +38,7 @@ interface TabLinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
|
|
|
38
38
|
icon?: ReactNode;
|
|
39
39
|
badge?: ReactNode;
|
|
40
40
|
isSelected?: boolean;
|
|
41
|
+
asChild?: boolean;
|
|
41
42
|
}
|
|
42
43
|
declare const TabLink: react.ForwardRefExoticComponent<TabLinkProps & react.RefAttributes<HTMLAnchorElement>>;
|
|
43
44
|
|
package/dist/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var e=require("clsx/lite"),
|
|
1
|
+
"use strict";var e=require("clsx/lite"),n=require("react"),t=require("react/jsx-runtime");function r(e){if(e&&e.__esModule)return e;var n=Object.create(null);return e&&Object.keys(e).forEach(function(t){if("default"!==t){var r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,r.get?r:{enumerable:!0,get:function(){return e[t]}})}}),n.default=e,Object.freeze(n)}var s=r(n),l=Object.defineProperty,a=Object.defineProperties,i=Object.getOwnPropertyDescriptors,c=Object.getOwnPropertySymbols,o=Object.prototype.hasOwnProperty,d=Object.prototype.propertyIsEnumerable,u=(e,n,t)=>n in e?l(e,n,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[n]=t,f=(e,n)=>{for(var t in n||(n={}))o.call(n,t)&&u(e,t,n[t]);if(c)for(var t of c(n))d.call(n,t)&&u(e,t,n[t]);return e},b=(e,n)=>a(e,i(n)),p=(e,n)=>{var t={};for(var r in e)o.call(e,r)&&n.indexOf(r)<0&&(t[r]=e[r]);if(null!=e&&c)for(var r of c(e))n.indexOf(r)<0&&d.call(e,r)&&(t[r]=e[r]);return t},m=n.createContext(null);function h(e,n){if("function"==typeof e)return e(n);null!=e&&(e.current=n)}function x(e){const n=v(e),r=s.forwardRef((e,r)=>{const l=e,{children:a}=l,i=p(l,["children"]),c=s.Children.toArray(a),o=c.find(C);if(o){const e=o.props.children,l=c.map(n=>n===o?s.Children.count(e)>1?s.Children.only(null):s.isValidElement(e)?e.props.children:null:n);return t.jsx(n,b(f({},i),{ref:r,children:s.isValidElement(e)?s.cloneElement(e,void 0,l):null}))}return t.jsx(n,b(f({},i),{ref:r,children:a}))});return r.displayName="".concat(e,".Slot"),r}var y=x("Slot");function v(e){const n=s.forwardRef((e,n)=>{const t=e,{children:r}=t,l=p(t,["children"]);if(s.isValidElement(r)){const e=function(e){var n,t;let r=null==(n=Object.getOwnPropertyDescriptor(e.props,"ref"))?void 0:n.get,s=r&&"isReactWarning"in r&&r.isReactWarning;if(s)return e.ref;if(r=null==(t=Object.getOwnPropertyDescriptor(e,"ref"))?void 0:t.get,s=r&&"isReactWarning"in r&&r.isReactWarning,s)return e.props.ref;return e.props.ref||e.ref}(r),t=function(e,n){const t=f({},n);for(const r in n){const s=e[r],l=n[r];/^on[A-Z]/.test(r)?s&&l?t[r]=(...e)=>{const n=l(...e);return s(...e),n}:s&&(t[r]=s):"style"===r?t[r]=f(f({},s),l):"className"===r&&(t[r]=[s,l].filter(Boolean).join(" "))}return f(f({},e),t)}(l,r.props);return r.type!==s.Fragment&&(t.ref=n?function(...e){return n=>{let t=!1;const r=e.map(e=>{const r=h(e,n);return t||"function"!=typeof r||(t=!0),r});if(t)return()=>{for(let n=0;n<r.length;n++){const t=r[n];"function"==typeof t?t():h(e[n],null)}}}}(n,e):e),s.cloneElement(r,t)}return s.Children.count(r)>1?s.Children.only(null):null});return n.displayName="".concat(e,".SlotClone"),n}var g=Symbol("radix.slottable");function j(e){const n=({children:e})=>t.jsx(t.Fragment,{children:e});return n.displayName="".concat(e,".Slottable"),n.__radixId=g,n}var O=j("Slottable");function C(e){return s.isValidElement(e)&&"function"==typeof e.type&&"__radixId"in e.type&&e.type.__radixId===g}var N=n.forwardRef((r,s)=>{var l=r,{children:a,className:i,icon:c,badge:o,href:d,isSelected:u,asChild:m=!1}=l,h=p(l,["children","className","icon","badge","href","isSelected","asChild"]);const x=m?y:"a";return t.jsxs(x,b(f({className:e.clsx("sds-tabs__tab","sds-tab-link",u&&"sds-tab-link--selected",i),href:d,ref:s},h),{children:[c&&t.jsx("div",{className:"sds-tabs__tab-icon",children:c}),t.jsx(O,{children:a}),o&&t.jsx("div",{className:"sds-tabs__tab-badge",children:u?n.isValidElement(o)&&n.cloneElement(o,{visibility:"strong"}):o})]}))});N.displayName="TabLink",exports.Tab=r=>{var s=r,{children:l,className:a,icon:i,badge:c}=s,o=p(s,["children","className","icon","badge"]);const{index:d}=o,u=n.useContext(m);if(!u)return console.warn("TabContext missing. Component needs to be used inside <Tabs>"),null;const{id:h,count:x,isSelectOnFocus:y,selectedIndex:v,setSelectedIndex:g,setPreviousIndex:j}=u,O=d===v,C=e=>{y&&(j(v),g(e))};return t.jsxs("button",b(f({className:e.clsx("sds-tabs__tab",a),role:"tab","aria-selected":O,"aria-controls":"panel-".concat(h,"-").concat(d),id:"tab-".concat(h,"-").concat(d),tabIndex:O?0:-1,onClick:()=>{j(v),g(d)},onKeyDown:e=>{var n,t;const r=x-1,s=e.currentTarget,l=null==(n=s.parentElement)?void 0:n.firstChild,a=null==(t=s.parentElement)?void 0:t.lastChild;if("ArrowLeft"===e.key){const e=s.previousSibling;d>0?e.focus():a.focus(),C(v>0?v-1:r)}else if("ArrowRight"===e.key){const e=s.nextSibling;d<r?e.focus():l.focus(),C(v<r?v+1:0)}else"Home"===e.key?(l.focus(),C(0)):"End"===e.key?(a.focus(),C(r)):"Enter"!==e.key&&"Space"!==e.code||g(d)}},o),{children:[i&&t.jsx("span",{className:"sds-tabs__tab-icon",children:i}),l,c&&t.jsx("span",{className:"sds-tabs__tab-badge",children:n.isValidElement(c)&&n.cloneElement(c,{visibility:"strong"})})]}))},exports.TabLink=N,exports.TabList=r=>{var s=r,{children:l,"aria-label":a,className:i}=s,c=p(s,["children","aria-label","className"]);const o=n.Children.toArray(l);return t.jsx("div",b(f({className:e.clsx("sds-tabs__tab-list",i),role:"tablist","aria-label":a},c),{children:n.Children.map(o,(e,t)=>n.isValidElement(e)&&n.cloneElement(e,{index:t}))}))},exports.TabPanel=r=>{var s=r,{children:l,className:a}=s,i=p(s,["children","className"]);const{index:c}=i,o=n.useContext(m);if(!o)return console.warn("TabContext missing. Component needs to be used inside <Tabs>"),null;const{id:d,selectedIndex:u}=o,h=c===u;return t.jsx("div",b(f({className:e.clsx("sds-tabs__tab-panel",a),id:"panel-".concat(d,"-").concat(c),role:"tabpanel",tabIndex:h?void 0:-1,"aria-labelledby":"tab-".concat(d,"-").concat(c),hidden:!h},i),{children:l}))},exports.Tabs=r=>{var s=r,{defaultIndex:l=0,onChange:a,isSelectOnFocus:i=!1,children:c,className:o}=s,d=p(s,["defaultIndex","onChange","isSelectOnFocus","children","className"]);const[u,h]=n.useState(l),[x,y]=n.useState(l),v=n.useId();n.useEffect(()=>{a&&x!==u&&a(u)},[a,x,u]);const g=n.Children.toArray(c),j=g.length-1;return t.jsx(m.Provider,{value:{id:v,count:j,isSelectOnFocus:i,selectedIndex:u,setSelectedIndex:h,setPreviousIndex:y},children:t.jsx("div",b(f({className:e.clsx("sds-tabs",o)},d),{children:n.Children.map(g,(e,r)=>n.isValidElement(e)&&r>0?t.jsx(t.Fragment,{children:n.cloneElement(e,{index:r-1})}):e)}))})};//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/Tabs.tsx","../src/TabList.tsx","../src/Tab.tsx","../src/TabPanel.tsx","../src/TabLink.tsx"],"names":["createContext","useState","useId","useEffect","Children","jsx","clsx","isValidElement","Fragment","cloneElement","useContext","index","_a","_b","jsxs","forwardRef"],"mappings":"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","file":"index.js","sourcesContent":["import { clsx } from \"clsx/lite\";\nimport {\n Children,\n HTMLAttributes,\n ReactElement,\n ReactNode,\n cloneElement,\n createContext,\n isValidElement,\n useEffect,\n useId,\n useState,\n} from \"react\";\nimport \"./tabs.pcss\";\nimport { TabPanelProps } from \"./TabPanel\";\n\nexport interface TabsContextType {\n id: string;\n count: number;\n isSelectOnFocus: boolean;\n selectedIndex: number;\n setSelectedIndex: (index: number) => void;\n setPreviousIndex: (index: number) => void;\n}\n\nexport const TabsContext = createContext<TabsContextType | null>(null);\n\nexport interface TabsProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n defaultIndex?: number;\n isSelectOnFocus?: boolean;\n onChange?: (index: number) => void;\n children: ReactNode;\n className?: string;\n}\n\nexport const Tabs = ({\n defaultIndex = 0,\n onChange,\n isSelectOnFocus = false,\n children,\n className,\n ...rest\n}: TabsProps) => {\n const [selectedIndex, setSelectedIndex] = useState(defaultIndex);\n const [previousIndex, setPreviousIndex] = useState(defaultIndex);\n const id = useId();\n\n useEffect(() => {\n if (onChange && previousIndex !== selectedIndex) {\n onChange(selectedIndex);\n }\n }, [onChange, previousIndex, selectedIndex]);\n\n const arrayChildren = Children.toArray(children);\n const count = arrayChildren.length - 1;\n\n return (\n <TabsContext.Provider\n value={{\n id,\n count,\n isSelectOnFocus,\n selectedIndex,\n setSelectedIndex,\n setPreviousIndex,\n }}\n >\n <div className={clsx(\"sds-tabs\", className)} {...rest}>\n {Children.map(arrayChildren, (child, index) => {\n if (isValidElement(child) && index > 0) {\n return (\n <>\n {cloneElement(\n child as ReactElement<TabPanelProps & { index: number }>,\n {\n index: index - 1,\n },\n )}\n </>\n );\n } else {\n return child;\n }\n })}\n </div>\n </TabsContext.Provider>\n );\n};\n","import { clsx } from \"clsx/lite\";\nimport {\n Children,\n HTMLAttributes,\n ReactElement,\n ReactNode,\n cloneElement,\n isValidElement,\n} from \"react\";\nimport { TabProps } from \"./Tab\";\n\nexport interface TabListProps extends HTMLAttributes<HTMLDivElement> {\n children: ReactNode;\n \"aria-label\": NonNullable<string>;\n className?: string;\n}\n\nexport const TabList = ({\n children,\n \"aria-label\": ariaLabel,\n className,\n ...rest\n}: TabListProps) => {\n const arrayChildren = Children.toArray(children);\n\n return (\n <div\n className={clsx(\"sds-tabs__tab-list\", className)}\n role=\"tablist\"\n aria-label={ariaLabel}\n {...rest}\n >\n {Children.map(arrayChildren, (child, index) => {\n if (isValidElement(child)) {\n return (\n <>\n {cloneElement(\n child as ReactElement<TabProps & { index: number }>,\n {\n index,\n },\n )}\n </>\n );\n }\n })}\n </div>\n );\n};\n","import { type BadgeProps } from \"@sikt/sds-badge\";\nimport { clsx } from \"clsx/lite\";\nimport {\n HTMLAttributes,\n KeyboardEvent,\n ReactElement,\n ReactNode,\n cloneElement,\n isValidElement,\n useContext,\n PropsWithChildren,\n} from \"react\";\nimport { TabsContext } from \"./Tabs\";\n\nexport interface TabProps extends HTMLAttributes<HTMLButtonElement> {\n children: ReactNode;\n className?: string;\n icon?: ReactNode;\n badge?: ReactNode;\n}\n\nexport const Tab = ({\n children,\n className,\n icon,\n badge,\n ...rest\n}: TabProps) => {\n const { index } = rest as { index: number };\n const context = useContext(TabsContext);\n\n if (!context) {\n console.warn(\n \"TabContext missing. Component needs to be used inside <Tabs>\",\n );\n return null;\n }\n\n const {\n id,\n count,\n isSelectOnFocus,\n selectedIndex,\n setSelectedIndex,\n setPreviousIndex,\n } = context;\n\n const isSelected = index === selectedIndex;\n const handleSelect = (index: number) => {\n if (isSelectOnFocus) {\n setPreviousIndex(selectedIndex);\n setSelectedIndex(index);\n }\n };\n const handleKeyPress = (event: KeyboardEvent<HTMLButtonElement>) => {\n const firstIndex = 0;\n const lastIndex = count - 1;\n const currentTarget = event.currentTarget;\n const firstChild = currentTarget.parentElement?.firstChild as HTMLElement;\n const lastChild = currentTarget.parentElement?.lastChild as HTMLElement;\n\n if (event.key === \"ArrowLeft\") {\n const previousSibling = currentTarget.previousSibling as HTMLElement;\n if (index > firstIndex) {\n previousSibling.focus();\n } else {\n lastChild.focus();\n }\n\n handleSelect(selectedIndex > firstIndex ? selectedIndex - 1 : lastIndex);\n } else if (event.key === \"ArrowRight\") {\n const nextSibling = currentTarget.nextSibling as HTMLElement;\n if (index < lastIndex) {\n nextSibling.focus();\n } else {\n firstChild.focus();\n }\n\n handleSelect(selectedIndex < lastIndex ? selectedIndex + 1 : firstIndex);\n } else if (event.key === \"Home\") {\n firstChild.focus();\n handleSelect(firstIndex);\n } else if (event.key === \"End\") {\n lastChild.focus();\n handleSelect(lastIndex);\n } else if (event.key === \"Enter\" || event.code === \"Space\") {\n setSelectedIndex(index);\n }\n };\n\n return (\n <button\n className={clsx(\"sds-tabs__tab\", className)}\n role=\"tab\"\n aria-selected={isSelected}\n aria-controls={`panel-${id}-${index}`}\n id={`tab-${id}-${index}`}\n tabIndex={isSelected ? 0 : -1}\n onClick={() => {\n setPreviousIndex(selectedIndex);\n setSelectedIndex(index);\n }}\n onKeyDown={handleKeyPress}\n {...rest}\n >\n {icon && <span className=\"sds-tabs__tab-icon\">{icon}</span>}\n {children}\n {badge && (\n <span className=\"sds-tabs__tab-badge\">\n {isValidElement(badge) &&\n cloneElement(badge as ReactElement<PropsWithChildren<BadgeProps>>, {\n visibility: \"strong\",\n })}\n </span>\n )}\n </button>\n );\n};\n","import { clsx } from \"clsx/lite\";\nimport { ReactNode, useContext } from \"react\";\nimport { TabsContext } from \"./Tabs\";\n\nexport interface TabPanelProps {\n children: ReactNode;\n className?: string;\n}\n\nexport const TabPanel = ({ children, className, ...rest }: TabPanelProps) => {\n const { index } = rest as { index: number };\n const context = useContext(TabsContext);\n\n if (!context) {\n console.warn(\n \"TabContext missing. Component needs to be used inside <Tabs>\",\n );\n return null;\n }\n\n const { id, selectedIndex } = context;\n\n const isSelected = index === selectedIndex;\n return (\n <div\n className={clsx(\"sds-tabs__tab-panel\", className)}\n id={`panel-${id}-${index}`}\n role=\"tabpanel\"\n tabIndex={isSelected ? undefined : -1}\n aria-labelledby={`tab-${id}-${index}`}\n hidden={!isSelected}\n {...rest}\n >\n {children}\n </div>\n );\n};\n","import { type BadgeProps } from \"@sikt/sds-badge\";\nimport { clsx } from \"clsx/lite\";\nimport {\n AnchorHTMLAttributes,\n ReactElement,\n ReactNode,\n cloneElement,\n forwardRef,\n isValidElement,\n PropsWithChildren,\n} from \"react\";\nimport \"./tab-link.pcss\";\n\nexport interface TabLinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {\n children: ReactNode;\n className?: string;\n icon?: ReactNode;\n badge?: ReactNode;\n isSelected?: boolean;\n}\n\nexport const TabLink = forwardRef<HTMLAnchorElement, TabLinkProps>(\n (\n {\n children,\n className,\n icon,\n badge,\n href,\n isSelected,\n ...rest\n }: TabLinkProps,\n ref,\n ) => {\n return (\n <a\n className={clsx(\n \"sds-tabs__tab\",\n \"sds-tab-link\",\n isSelected && \"sds-tab-link--selected\",\n className,\n )}\n href={href}\n ref={ref}\n {...rest}\n >\n {icon && <div className=\"sds-tabs__tab-icon\">{icon}</div>}\n {children}\n {badge && (\n <div className=\"sds-tabs__tab-badge\">\n {isSelected\n ? isValidElement(badge) &&\n cloneElement(\n badge as ReactElement<PropsWithChildren<BadgeProps>>,\n { visibility: \"strong\" },\n )\n : badge}\n </div>\n )}\n </a>\n );\n },\n);\n\nTabLink.displayName = \"TabLink\";\n"]}
|
|
1
|
+
{"version":3,"sources":["../src/Tabs.tsx","../src/TabList.tsx","../src/Tab.tsx","../src/TabPanel.tsx","../../../node_modules/@radix-ui/react-compose-refs/src/compose-refs.tsx","../../../node_modules/@radix-ui/react-slot/src/slot.tsx","../src/TabLink.tsx"],"names":["createContext","useState","useId","useEffect","Children","jsx","clsx","isValidElement","Fragment","cloneElement","useContext","index","_a","_b","jsxs","Slot","React2","props","Slottable","forwardRef"],"mappings":"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","file":"index.js","sourcesContent":["import { clsx } from \"clsx/lite\";\nimport {\n Children,\n HTMLAttributes,\n ReactElement,\n ReactNode,\n cloneElement,\n createContext,\n isValidElement,\n useEffect,\n useId,\n useState,\n} from \"react\";\nimport \"./tabs.pcss\";\nimport { TabPanelProps } from \"./TabPanel\";\n\nexport interface TabsContextType {\n id: string;\n count: number;\n isSelectOnFocus: boolean;\n selectedIndex: number;\n setSelectedIndex: (index: number) => void;\n setPreviousIndex: (index: number) => void;\n}\n\nexport const TabsContext = createContext<TabsContextType | null>(null);\n\nexport interface TabsProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n defaultIndex?: number;\n isSelectOnFocus?: boolean;\n onChange?: (index: number) => void;\n children: ReactNode;\n className?: string;\n}\n\nexport const Tabs = ({\n defaultIndex = 0,\n onChange,\n isSelectOnFocus = false,\n children,\n className,\n ...rest\n}: TabsProps) => {\n const [selectedIndex, setSelectedIndex] = useState(defaultIndex);\n const [previousIndex, setPreviousIndex] = useState(defaultIndex);\n const id = useId();\n\n useEffect(() => {\n if (onChange && previousIndex !== selectedIndex) {\n onChange(selectedIndex);\n }\n }, [onChange, previousIndex, selectedIndex]);\n\n const arrayChildren = Children.toArray(children);\n const count = arrayChildren.length - 1;\n\n return (\n <TabsContext.Provider\n value={{\n id,\n count,\n isSelectOnFocus,\n selectedIndex,\n setSelectedIndex,\n setPreviousIndex,\n }}\n >\n <div className={clsx(\"sds-tabs\", className)} {...rest}>\n {Children.map(arrayChildren, (child, index) => {\n if (isValidElement(child) && index > 0) {\n return (\n <>\n {cloneElement(\n child as ReactElement<TabPanelProps & { index: number }>,\n {\n index: index - 1,\n },\n )}\n </>\n );\n } else {\n return child;\n }\n })}\n </div>\n </TabsContext.Provider>\n );\n};\n","import { clsx } from \"clsx/lite\";\nimport {\n Children,\n HTMLAttributes,\n ReactElement,\n ReactNode,\n cloneElement,\n isValidElement,\n} from \"react\";\nimport { TabProps } from \"./Tab\";\n\nexport interface TabListProps extends HTMLAttributes<HTMLDivElement> {\n children: ReactNode;\n \"aria-label\": NonNullable<string>;\n className?: string;\n}\n\nexport const TabList = ({\n children,\n \"aria-label\": ariaLabel,\n className,\n ...rest\n}: TabListProps) => {\n const arrayChildren = Children.toArray(children);\n\n return (\n <div\n className={clsx(\"sds-tabs__tab-list\", className)}\n role=\"tablist\"\n aria-label={ariaLabel}\n {...rest}\n >\n {Children.map(\n arrayChildren,\n (child, index) =>\n isValidElement(child) &&\n cloneElement(child as ReactElement<TabProps & { index: number }>, {\n index,\n }),\n )}\n </div>\n );\n};\n","import { type BadgeProps } from \"@sikt/sds-badge\";\nimport { clsx } from \"clsx/lite\";\nimport {\n HTMLAttributes,\n KeyboardEvent,\n ReactElement,\n ReactNode,\n cloneElement,\n isValidElement,\n useContext,\n PropsWithChildren,\n} from \"react\";\nimport { TabsContext } from \"./Tabs\";\n\nexport interface TabProps extends HTMLAttributes<HTMLButtonElement> {\n children: ReactNode;\n className?: string;\n icon?: ReactNode;\n badge?: ReactNode;\n}\n\nexport const Tab = ({\n children,\n className,\n icon,\n badge,\n ...rest\n}: TabProps) => {\n const { index } = rest as { index: number };\n const context = useContext(TabsContext);\n\n if (!context) {\n console.warn(\n \"TabContext missing. Component needs to be used inside <Tabs>\",\n );\n return null;\n }\n\n const {\n id,\n count,\n isSelectOnFocus,\n selectedIndex,\n setSelectedIndex,\n setPreviousIndex,\n } = context;\n\n const isSelected = index === selectedIndex;\n const handleSelect = (index: number) => {\n if (isSelectOnFocus) {\n setPreviousIndex(selectedIndex);\n setSelectedIndex(index);\n }\n };\n const handleKeyPress = (event: KeyboardEvent<HTMLButtonElement>) => {\n const firstIndex = 0;\n const lastIndex = count - 1;\n const currentTarget = event.currentTarget;\n const firstChild = currentTarget.parentElement?.firstChild as HTMLElement;\n const lastChild = currentTarget.parentElement?.lastChild as HTMLElement;\n\n if (event.key === \"ArrowLeft\") {\n const previousSibling = currentTarget.previousSibling as HTMLElement;\n if (index > firstIndex) {\n previousSibling.focus();\n } else {\n lastChild.focus();\n }\n\n handleSelect(selectedIndex > firstIndex ? selectedIndex - 1 : lastIndex);\n } else if (event.key === \"ArrowRight\") {\n const nextSibling = currentTarget.nextSibling as HTMLElement;\n if (index < lastIndex) {\n nextSibling.focus();\n } else {\n firstChild.focus();\n }\n\n handleSelect(selectedIndex < lastIndex ? selectedIndex + 1 : firstIndex);\n } else if (event.key === \"Home\") {\n firstChild.focus();\n handleSelect(firstIndex);\n } else if (event.key === \"End\") {\n lastChild.focus();\n handleSelect(lastIndex);\n } else if (event.key === \"Enter\" || event.code === \"Space\") {\n setSelectedIndex(index);\n }\n };\n\n return (\n <button\n className={clsx(\"sds-tabs__tab\", className)}\n role=\"tab\"\n aria-selected={isSelected}\n aria-controls={`panel-${id}-${index}`}\n id={`tab-${id}-${index}`}\n tabIndex={isSelected ? 0 : -1}\n onClick={() => {\n setPreviousIndex(selectedIndex);\n setSelectedIndex(index);\n }}\n onKeyDown={handleKeyPress}\n {...rest}\n >\n {icon && <span className=\"sds-tabs__tab-icon\">{icon}</span>}\n {children}\n {badge && (\n <span className=\"sds-tabs__tab-badge\">\n {isValidElement(badge) &&\n cloneElement(badge as ReactElement<PropsWithChildren<BadgeProps>>, {\n visibility: \"strong\",\n })}\n </span>\n )}\n </button>\n );\n};\n","import { clsx } from \"clsx/lite\";\nimport { ReactNode, useContext } from \"react\";\nimport { TabsContext } from \"./Tabs\";\n\nexport interface TabPanelProps {\n children: ReactNode;\n className?: string;\n}\n\nexport const TabPanel = ({ children, className, ...rest }: TabPanelProps) => {\n const { index } = rest as { index: number };\n const context = useContext(TabsContext);\n\n if (!context) {\n console.warn(\n \"TabContext missing. Component needs to be used inside <Tabs>\",\n );\n return null;\n }\n\n const { id, selectedIndex } = context;\n\n const isSelected = index === selectedIndex;\n return (\n <div\n className={clsx(\"sds-tabs__tab-panel\", className)}\n id={`panel-${id}-${index}`}\n role=\"tabpanel\"\n tabIndex={isSelected ? undefined : -1}\n aria-labelledby={`tab-${id}-${index}`}\n hidden={!isSelected}\n {...rest}\n >\n {children}\n </div>\n );\n};\n","import * as React from 'react';\n\ntype PossibleRef<T> = React.Ref<T> | undefined;\n\n/**\n * Set a given ref to a given value\n * This utility takes care of different types of refs: callback refs and RefObject(s)\n */\nfunction setRef<T>(ref: PossibleRef<T>, value: T) {\n if (typeof ref === 'function') {\n return ref(value);\n } else if (ref !== null && ref !== undefined) {\n ref.current = value;\n }\n}\n\n/**\n * A utility to compose multiple refs together\n * Accepts callback refs and RefObject(s)\n */\nfunction composeRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T> {\n return (node) => {\n let hasCleanup = false;\n const cleanups = refs.map((ref) => {\n const cleanup = setRef(ref, node);\n if (!hasCleanup && typeof cleanup == 'function') {\n hasCleanup = true;\n }\n return cleanup;\n });\n\n // React <19 will log an error to the console if a callback ref returns a\n // value. We don't use ref cleanups internally so this will only happen if a\n // user's ref callback returns a value, which we only expect if they are\n // using the cleanup functionality added in React 19.\n if (hasCleanup) {\n return () => {\n for (let i = 0; i < cleanups.length; i++) {\n const cleanup = cleanups[i];\n if (typeof cleanup == 'function') {\n cleanup();\n } else {\n setRef(refs[i], null);\n }\n }\n };\n }\n };\n}\n\n/**\n * A custom hook that composes multiple refs\n * Accepts callback refs and RefObject(s)\n */\nfunction useComposedRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T> {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n return React.useCallback(composeRefs(...refs), refs);\n}\n\nexport { composeRefs, useComposedRefs };\n","import * as React from 'react';\nimport { composeRefs } from '@radix-ui/react-compose-refs';\n\n/* -------------------------------------------------------------------------------------------------\n * Slot\n * -----------------------------------------------------------------------------------------------*/\n\ninterface SlotProps extends React.HTMLAttributes<HTMLElement> {\n children?: React.ReactNode;\n}\n\n/* @__NO_SIDE_EFFECTS__ */ export function createSlot(ownerName: string) {\n const SlotClone = createSlotClone(ownerName);\n const Slot = React.forwardRef<HTMLElement, SlotProps>((props, forwardedRef) => {\n const { children, ...slotProps } = props;\n const childrenArray = React.Children.toArray(children);\n const slottable = childrenArray.find(isSlottable);\n\n if (slottable) {\n // the new element to render is the one passed as a child of `Slottable`\n const newElement = slottable.props.children;\n\n const newChildren = childrenArray.map((child) => {\n if (child === slottable) {\n // because the new element will be the one rendered, we are only interested\n // in grabbing its children (`newElement.props.children`)\n if (React.Children.count(newElement) > 1) return React.Children.only(null);\n return React.isValidElement(newElement)\n ? (newElement.props as { children: React.ReactNode }).children\n : null;\n } else {\n return child;\n }\n });\n\n return (\n <SlotClone {...slotProps} ref={forwardedRef}>\n {React.isValidElement(newElement)\n ? React.cloneElement(newElement, undefined, newChildren)\n : null}\n </SlotClone>\n );\n }\n\n return (\n <SlotClone {...slotProps} ref={forwardedRef}>\n {children}\n </SlotClone>\n );\n });\n\n Slot.displayName = `${ownerName}.Slot`;\n return Slot;\n}\n\nconst Slot = createSlot('Slot');\n\n/* -------------------------------------------------------------------------------------------------\n * SlotClone\n * -----------------------------------------------------------------------------------------------*/\n\ninterface SlotCloneProps {\n children: React.ReactNode;\n}\n\n/* @__NO_SIDE_EFFECTS__ */ function createSlotClone(ownerName: string) {\n const SlotClone = React.forwardRef<any, SlotCloneProps>((props, forwardedRef) => {\n const { children, ...slotProps } = props;\n\n if (React.isValidElement(children)) {\n const childrenRef = getElementRef(children);\n const props = mergeProps(slotProps, children.props as AnyProps);\n // do not pass ref to React.Fragment for React 19 compatibility\n if (children.type !== React.Fragment) {\n props.ref = forwardedRef ? composeRefs(forwardedRef, childrenRef) : childrenRef;\n }\n return React.cloneElement(children, props);\n }\n\n return React.Children.count(children) > 1 ? React.Children.only(null) : null;\n });\n\n SlotClone.displayName = `${ownerName}.SlotClone`;\n return SlotClone;\n}\n\n/* -------------------------------------------------------------------------------------------------\n * Slottable\n * -----------------------------------------------------------------------------------------------*/\n\nconst SLOTTABLE_IDENTIFIER = Symbol('radix.slottable');\n\ninterface SlottableProps {\n children: React.ReactNode;\n}\n\ninterface SlottableComponent extends React.FC<SlottableProps> {\n __radixId: symbol;\n}\n\n/* @__NO_SIDE_EFFECTS__ */ export function createSlottable(ownerName: string) {\n const Slottable: SlottableComponent = ({ children }) => {\n return <>{children}</>;\n };\n Slottable.displayName = `${ownerName}.Slottable`;\n Slottable.__radixId = SLOTTABLE_IDENTIFIER;\n return Slottable;\n}\n\nconst Slottable = createSlottable('Slottable');\n\n/* ---------------------------------------------------------------------------------------------- */\n\ntype AnyProps = Record<string, any>;\n\nfunction isSlottable(\n child: React.ReactNode\n): child is React.ReactElement<SlottableProps, typeof Slottable> {\n return (\n React.isValidElement(child) &&\n typeof child.type === 'function' &&\n '__radixId' in child.type &&\n child.type.__radixId === SLOTTABLE_IDENTIFIER\n );\n}\n\nfunction mergeProps(slotProps: AnyProps, childProps: AnyProps) {\n // all child props should override\n const overrideProps = { ...childProps };\n\n for (const propName in childProps) {\n const slotPropValue = slotProps[propName];\n const childPropValue = childProps[propName];\n\n const isHandler = /^on[A-Z]/.test(propName);\n if (isHandler) {\n // if the handler exists on both, we compose them\n if (slotPropValue && childPropValue) {\n overrideProps[propName] = (...args: unknown[]) => {\n const result = childPropValue(...args);\n slotPropValue(...args);\n return result;\n };\n }\n // but if it exists only on the slot, we use only this one\n else if (slotPropValue) {\n overrideProps[propName] = slotPropValue;\n }\n }\n // if it's `style`, we merge them\n else if (propName === 'style') {\n overrideProps[propName] = { ...slotPropValue, ...childPropValue };\n } else if (propName === 'className') {\n overrideProps[propName] = [slotPropValue, childPropValue].filter(Boolean).join(' ');\n }\n }\n\n return { ...slotProps, ...overrideProps };\n}\n\n// Before React 19 accessing `element.props.ref` will throw a warning and suggest using `element.ref`\n// After React 19 accessing `element.ref` does the opposite.\n// https://github.com/facebook/react/pull/28348\n//\n// Access the ref using the method that doesn't yield a warning.\nfunction getElementRef(element: React.ReactElement) {\n // React <=18 in DEV\n let getter = Object.getOwnPropertyDescriptor(element.props, 'ref')?.get;\n let mayWarn = getter && 'isReactWarning' in getter && getter.isReactWarning;\n if (mayWarn) {\n return (element as any).ref;\n }\n\n // React 19 in DEV\n getter = Object.getOwnPropertyDescriptor(element, 'ref')?.get;\n mayWarn = getter && 'isReactWarning' in getter && getter.isReactWarning;\n if (mayWarn) {\n return (element.props as { ref?: React.Ref<unknown> }).ref;\n }\n\n // Not DEV\n return (element.props as { ref?: React.Ref<unknown> }).ref || (element as any).ref;\n}\n\nexport {\n Slot,\n Slottable,\n //\n Slot as Root,\n};\nexport type { SlotProps };\n","import { Slot, Slottable } from \"@radix-ui/react-slot\";\nimport { type BadgeProps } from \"@sikt/sds-badge\";\nimport { clsx } from \"clsx/lite\";\nimport {\n AnchorHTMLAttributes,\n ReactElement,\n ReactNode,\n cloneElement,\n forwardRef,\n isValidElement,\n PropsWithChildren,\n} from \"react\";\nimport \"./tab-link.pcss\";\n\nexport interface TabLinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {\n children: ReactNode;\n className?: string;\n icon?: ReactNode;\n badge?: ReactNode;\n isSelected?: boolean;\n asChild?: boolean;\n}\n\nexport const TabLink = forwardRef<HTMLAnchorElement, TabLinkProps>(\n (\n {\n children,\n className,\n icon,\n badge,\n href,\n isSelected,\n asChild = false,\n ...rest\n }: TabLinkProps,\n ref,\n ) => {\n const Comp = asChild ? Slot : \"a\";\n\n return (\n <Comp\n className={clsx(\n \"sds-tabs__tab\",\n \"sds-tab-link\",\n isSelected && \"sds-tab-link--selected\",\n className,\n )}\n href={href}\n ref={ref}\n {...rest}\n >\n {icon && <div className=\"sds-tabs__tab-icon\">{icon}</div>}\n <Slottable>{children}</Slottable>\n {badge && (\n <div className=\"sds-tabs__tab-badge\">\n {isSelected\n ? isValidElement(badge) &&\n cloneElement(\n badge as ReactElement<PropsWithChildren<BadgeProps>>,\n { visibility: \"strong\" },\n )\n : badge}\n </div>\n )}\n </Comp>\n );\n },\n);\n\nTabLink.displayName = \"TabLink\";\n"]}
|
package/dist/index.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{clsx as e}from"clsx/lite";import{createContext as
|
|
1
|
+
import{clsx as e}from"clsx/lite";import*as n from"react";import{createContext as t,forwardRef as r,isValidElement as a,cloneElement as l,useState as i,useId as s,useEffect as c,Children as o,useContext as d}from"react";import{jsxs as u,jsx as f,Fragment as b}from"react/jsx-runtime";var p=Object.defineProperty,m=Object.defineProperties,h=Object.getOwnPropertyDescriptors,y=Object.getOwnPropertySymbols,v=Object.prototype.hasOwnProperty,g=Object.prototype.propertyIsEnumerable,x=(e,n,t)=>n in e?p(e,n,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[n]=t,N=(e,n)=>{for(var t in n||(n={}))v.call(n,t)&&x(e,t,n[t]);if(y)for(var t of y(n))g.call(n,t)&&x(e,t,n[t]);return e},_=(e,n)=>m(e,h(n)),O=(e,n)=>{var t={};for(var r in e)v.call(e,r)&&n.indexOf(r)<0&&(t[r]=e[r]);if(null!=e&&y)for(var r of y(e))n.indexOf(r)<0&&g.call(e,r)&&(t[r]=e[r]);return t},S=t(null),C=n=>{var t=n,{defaultIndex:r=0,onChange:d,isSelectOnFocus:u=!1,children:p,className:m}=t,h=O(t,["defaultIndex","onChange","isSelectOnFocus","children","className"]);const[y,v]=i(r),[g,x]=i(r),C=s();c(()=>{d&&g!==y&&d(y)},[d,g,y]);const I=o.toArray(p),w=I.length-1;return f(S.Provider,{value:{id:C,count:w,isSelectOnFocus:u,selectedIndex:y,setSelectedIndex:v,setPreviousIndex:x},children:f("div",_(N({className:e("sds-tabs",m)},h),{children:o.map(I,(e,n)=>a(e)&&n>0?f(b,{children:l(e,{index:n-1})}):e)}))})},I=n=>{var t=n,{children:r,"aria-label":i,className:s}=t,c=O(t,["children","aria-label","className"]);const d=o.toArray(r);return f("div",_(N({className:e("sds-tabs__tab-list",s),role:"tablist","aria-label":i},c),{children:o.map(d,(e,n)=>a(e)&&l(e,{index:n}))}))},w=n=>{var t=n,{children:r,className:i,icon:s,badge:c}=t,o=O(t,["children","className","icon","badge"]);const{index:b}=o,p=d(S);if(!p)return console.warn("TabContext missing. Component needs to be used inside <Tabs>"),null;const{id:m,count:h,isSelectOnFocus:y,selectedIndex:v,setSelectedIndex:g,setPreviousIndex:x}=p,C=b===v,I=e=>{y&&(x(v),g(e))};return u("button",_(N({className:e("sds-tabs__tab",i),role:"tab","aria-selected":C,"aria-controls":"panel-".concat(m,"-").concat(b),id:"tab-".concat(m,"-").concat(b),tabIndex:C?0:-1,onClick:()=>{x(v),g(b)},onKeyDown:e=>{var n,t;const r=h-1,a=e.currentTarget,l=null==(n=a.parentElement)?void 0:n.firstChild,i=null==(t=a.parentElement)?void 0:t.lastChild;if("ArrowLeft"===e.key){const e=a.previousSibling;b>0?e.focus():i.focus(),I(v>0?v-1:r)}else if("ArrowRight"===e.key){const e=a.nextSibling;b<r?e.focus():l.focus(),I(v<r?v+1:0)}else"Home"===e.key?(l.focus(),I(0)):"End"===e.key?(i.focus(),I(r)):"Enter"!==e.key&&"Space"!==e.code||g(b)}},o),{children:[s&&f("span",{className:"sds-tabs__tab-icon",children:s}),r,c&&f("span",{className:"sds-tabs__tab-badge",children:a(c)&&l(c,{visibility:"strong"})})]}))},E=n=>{var t=n,{children:r,className:a}=t,l=O(t,["children","className"]);const{index:i}=l,s=d(S);if(!s)return console.warn("TabContext missing. Component needs to be used inside <Tabs>"),null;const{id:c,selectedIndex:o}=s,u=i===o;return f("div",_(N({className:e("sds-tabs__tab-panel",a),id:"panel-".concat(c,"-").concat(i),role:"tabpanel",tabIndex:u?void 0:-1,"aria-labelledby":"tab-".concat(c,"-").concat(i),hidden:!u},l),{children:r}))};function j(e,n){if("function"==typeof e)return e(n);null!=e&&(e.current=n)}function P(e){const t=R(e),r=n.forwardRef((e,r)=>{const a=e,{children:l}=a,i=O(a,["children"]),s=n.Children.toArray(l),c=s.find(D);if(c){const e=c.props.children,a=s.map(t=>t===c?n.Children.count(e)>1?n.Children.only(null):n.isValidElement(e)?e.props.children:null:t);return f(t,_(N({},i),{ref:r,children:n.isValidElement(e)?n.cloneElement(e,void 0,a):null}))}return f(t,_(N({},i),{ref:r,children:l}))});return r.displayName="".concat(e,".Slot"),r}var k=P("Slot");function R(e){const t=n.forwardRef((e,t)=>{const r=e,{children:a}=r,l=O(r,["children"]);if(n.isValidElement(a)){const e=function(e){var n,t;let r=null==(n=Object.getOwnPropertyDescriptor(e.props,"ref"))?void 0:n.get,a=r&&"isReactWarning"in r&&r.isReactWarning;if(a)return e.ref;if(r=null==(t=Object.getOwnPropertyDescriptor(e,"ref"))?void 0:t.get,a=r&&"isReactWarning"in r&&r.isReactWarning,a)return e.props.ref;return e.props.ref||e.ref}(a),r=function(e,n){const t=N({},n);for(const r in n){const a=e[r],l=n[r];/^on[A-Z]/.test(r)?a&&l?t[r]=(...e)=>{const n=l(...e);return a(...e),n}:a&&(t[r]=a):"style"===r?t[r]=N(N({},a),l):"className"===r&&(t[r]=[a,l].filter(Boolean).join(" "))}return N(N({},e),t)}(l,a.props);return a.type!==n.Fragment&&(r.ref=t?function(...e){return n=>{let t=!1;const r=e.map(e=>{const r=j(e,n);return t||"function"!=typeof r||(t=!0),r});if(t)return()=>{for(let n=0;n<r.length;n++){const t=r[n];"function"==typeof t?t():j(e[n],null)}}}}(t,e):e),n.cloneElement(a,r)}return n.Children.count(a)>1?n.Children.only(null):null});return t.displayName="".concat(e,".SlotClone"),t}var A=Symbol("radix.slottable");function T(e){const n=({children:e})=>f(b,{children:e});return n.displayName="".concat(e,".Slottable"),n.__radixId=A,n}var F=T("Slottable");function D(e){return n.isValidElement(e)&&"function"==typeof e.type&&"__radixId"in e.type&&e.type.__radixId===A}var V=r((n,t)=>{var r=n,{children:i,className:s,icon:c,badge:o,href:d,isSelected:b,asChild:p=!1}=r,m=O(r,["children","className","icon","badge","href","isSelected","asChild"]);return u(p?k:"a",_(N({className:e("sds-tabs__tab","sds-tab-link",b&&"sds-tab-link--selected",s),href:d,ref:t},m),{children:[c&&f("div",{className:"sds-tabs__tab-icon",children:c}),f(F,{children:i}),o&&f("div",{className:"sds-tabs__tab-badge",children:b?a(o)&&l(o,{visibility:"strong"}):o})]}))});V.displayName="TabLink";export{w as Tab,V as TabLink,I as TabList,E as TabPanel,C as Tabs};//# sourceMappingURL=index.mjs.map
|
package/dist/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/Tabs.tsx","../src/TabList.tsx","../src/Tab.tsx","../src/TabPanel.tsx","../src/TabLink.tsx"],"names":["Children","jsx","clsx","isValidElement","Fragment","cloneElement","index","_a","_b","useContext","jsxs"],"mappings":"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","file":"index.mjs","sourcesContent":["import { clsx } from \"clsx/lite\";\nimport {\n Children,\n HTMLAttributes,\n ReactElement,\n ReactNode,\n cloneElement,\n createContext,\n isValidElement,\n useEffect,\n useId,\n useState,\n} from \"react\";\nimport \"./tabs.pcss\";\nimport { TabPanelProps } from \"./TabPanel\";\n\nexport interface TabsContextType {\n id: string;\n count: number;\n isSelectOnFocus: boolean;\n selectedIndex: number;\n setSelectedIndex: (index: number) => void;\n setPreviousIndex: (index: number) => void;\n}\n\nexport const TabsContext = createContext<TabsContextType | null>(null);\n\nexport interface TabsProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n defaultIndex?: number;\n isSelectOnFocus?: boolean;\n onChange?: (index: number) => void;\n children: ReactNode;\n className?: string;\n}\n\nexport const Tabs = ({\n defaultIndex = 0,\n onChange,\n isSelectOnFocus = false,\n children,\n className,\n ...rest\n}: TabsProps) => {\n const [selectedIndex, setSelectedIndex] = useState(defaultIndex);\n const [previousIndex, setPreviousIndex] = useState(defaultIndex);\n const id = useId();\n\n useEffect(() => {\n if (onChange && previousIndex !== selectedIndex) {\n onChange(selectedIndex);\n }\n }, [onChange, previousIndex, selectedIndex]);\n\n const arrayChildren = Children.toArray(children);\n const count = arrayChildren.length - 1;\n\n return (\n <TabsContext.Provider\n value={{\n id,\n count,\n isSelectOnFocus,\n selectedIndex,\n setSelectedIndex,\n setPreviousIndex,\n }}\n >\n <div className={clsx(\"sds-tabs\", className)} {...rest}>\n {Children.map(arrayChildren, (child, index) => {\n if (isValidElement(child) && index > 0) {\n return (\n <>\n {cloneElement(\n child as ReactElement<TabPanelProps & { index: number }>,\n {\n index: index - 1,\n },\n )}\n </>\n );\n } else {\n return child;\n }\n })}\n </div>\n </TabsContext.Provider>\n );\n};\n","import { clsx } from \"clsx/lite\";\nimport {\n Children,\n HTMLAttributes,\n ReactElement,\n ReactNode,\n cloneElement,\n isValidElement,\n} from \"react\";\nimport { TabProps } from \"./Tab\";\n\nexport interface TabListProps extends HTMLAttributes<HTMLDivElement> {\n children: ReactNode;\n \"aria-label\": NonNullable<string>;\n className?: string;\n}\n\nexport const TabList = ({\n children,\n \"aria-label\": ariaLabel,\n className,\n ...rest\n}: TabListProps) => {\n const arrayChildren = Children.toArray(children);\n\n return (\n <div\n className={clsx(\"sds-tabs__tab-list\", className)}\n role=\"tablist\"\n aria-label={ariaLabel}\n {...rest}\n >\n {Children.map(arrayChildren, (child, index) => {\n if (isValidElement(child)) {\n return (\n <>\n {cloneElement(\n child as ReactElement<TabProps & { index: number }>,\n {\n index,\n },\n )}\n </>\n );\n }\n })}\n </div>\n );\n};\n","import { type BadgeProps } from \"@sikt/sds-badge\";\nimport { clsx } from \"clsx/lite\";\nimport {\n HTMLAttributes,\n KeyboardEvent,\n ReactElement,\n ReactNode,\n cloneElement,\n isValidElement,\n useContext,\n PropsWithChildren,\n} from \"react\";\nimport { TabsContext } from \"./Tabs\";\n\nexport interface TabProps extends HTMLAttributes<HTMLButtonElement> {\n children: ReactNode;\n className?: string;\n icon?: ReactNode;\n badge?: ReactNode;\n}\n\nexport const Tab = ({\n children,\n className,\n icon,\n badge,\n ...rest\n}: TabProps) => {\n const { index } = rest as { index: number };\n const context = useContext(TabsContext);\n\n if (!context) {\n console.warn(\n \"TabContext missing. Component needs to be used inside <Tabs>\",\n );\n return null;\n }\n\n const {\n id,\n count,\n isSelectOnFocus,\n selectedIndex,\n setSelectedIndex,\n setPreviousIndex,\n } = context;\n\n const isSelected = index === selectedIndex;\n const handleSelect = (index: number) => {\n if (isSelectOnFocus) {\n setPreviousIndex(selectedIndex);\n setSelectedIndex(index);\n }\n };\n const handleKeyPress = (event: KeyboardEvent<HTMLButtonElement>) => {\n const firstIndex = 0;\n const lastIndex = count - 1;\n const currentTarget = event.currentTarget;\n const firstChild = currentTarget.parentElement?.firstChild as HTMLElement;\n const lastChild = currentTarget.parentElement?.lastChild as HTMLElement;\n\n if (event.key === \"ArrowLeft\") {\n const previousSibling = currentTarget.previousSibling as HTMLElement;\n if (index > firstIndex) {\n previousSibling.focus();\n } else {\n lastChild.focus();\n }\n\n handleSelect(selectedIndex > firstIndex ? selectedIndex - 1 : lastIndex);\n } else if (event.key === \"ArrowRight\") {\n const nextSibling = currentTarget.nextSibling as HTMLElement;\n if (index < lastIndex) {\n nextSibling.focus();\n } else {\n firstChild.focus();\n }\n\n handleSelect(selectedIndex < lastIndex ? selectedIndex + 1 : firstIndex);\n } else if (event.key === \"Home\") {\n firstChild.focus();\n handleSelect(firstIndex);\n } else if (event.key === \"End\") {\n lastChild.focus();\n handleSelect(lastIndex);\n } else if (event.key === \"Enter\" || event.code === \"Space\") {\n setSelectedIndex(index);\n }\n };\n\n return (\n <button\n className={clsx(\"sds-tabs__tab\", className)}\n role=\"tab\"\n aria-selected={isSelected}\n aria-controls={`panel-${id}-${index}`}\n id={`tab-${id}-${index}`}\n tabIndex={isSelected ? 0 : -1}\n onClick={() => {\n setPreviousIndex(selectedIndex);\n setSelectedIndex(index);\n }}\n onKeyDown={handleKeyPress}\n {...rest}\n >\n {icon && <span className=\"sds-tabs__tab-icon\">{icon}</span>}\n {children}\n {badge && (\n <span className=\"sds-tabs__tab-badge\">\n {isValidElement(badge) &&\n cloneElement(badge as ReactElement<PropsWithChildren<BadgeProps>>, {\n visibility: \"strong\",\n })}\n </span>\n )}\n </button>\n );\n};\n","import { clsx } from \"clsx/lite\";\nimport { ReactNode, useContext } from \"react\";\nimport { TabsContext } from \"./Tabs\";\n\nexport interface TabPanelProps {\n children: ReactNode;\n className?: string;\n}\n\nexport const TabPanel = ({ children, className, ...rest }: TabPanelProps) => {\n const { index } = rest as { index: number };\n const context = useContext(TabsContext);\n\n if (!context) {\n console.warn(\n \"TabContext missing. Component needs to be used inside <Tabs>\",\n );\n return null;\n }\n\n const { id, selectedIndex } = context;\n\n const isSelected = index === selectedIndex;\n return (\n <div\n className={clsx(\"sds-tabs__tab-panel\", className)}\n id={`panel-${id}-${index}`}\n role=\"tabpanel\"\n tabIndex={isSelected ? undefined : -1}\n aria-labelledby={`tab-${id}-${index}`}\n hidden={!isSelected}\n {...rest}\n >\n {children}\n </div>\n );\n};\n","import { type BadgeProps } from \"@sikt/sds-badge\";\nimport { clsx } from \"clsx/lite\";\nimport {\n AnchorHTMLAttributes,\n ReactElement,\n ReactNode,\n cloneElement,\n forwardRef,\n isValidElement,\n PropsWithChildren,\n} from \"react\";\nimport \"./tab-link.pcss\";\n\nexport interface TabLinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {\n children: ReactNode;\n className?: string;\n icon?: ReactNode;\n badge?: ReactNode;\n isSelected?: boolean;\n}\n\nexport const TabLink = forwardRef<HTMLAnchorElement, TabLinkProps>(\n (\n {\n children,\n className,\n icon,\n badge,\n href,\n isSelected,\n ...rest\n }: TabLinkProps,\n ref,\n ) => {\n return (\n <a\n className={clsx(\n \"sds-tabs__tab\",\n \"sds-tab-link\",\n isSelected && \"sds-tab-link--selected\",\n className,\n )}\n href={href}\n ref={ref}\n {...rest}\n >\n {icon && <div className=\"sds-tabs__tab-icon\">{icon}</div>}\n {children}\n {badge && (\n <div className=\"sds-tabs__tab-badge\">\n {isSelected\n ? isValidElement(badge) &&\n cloneElement(\n badge as ReactElement<PropsWithChildren<BadgeProps>>,\n { visibility: \"strong\" },\n )\n : badge}\n </div>\n )}\n </a>\n );\n },\n);\n\nTabLink.displayName = \"TabLink\";\n"]}
|
|
1
|
+
{"version":3,"sources":["../src/Tabs.tsx","../src/TabList.tsx","../src/Tab.tsx","../src/TabPanel.tsx","../../../node_modules/@radix-ui/react-compose-refs/src/compose-refs.tsx","../../../node_modules/@radix-ui/react-slot/src/slot.tsx","../src/TabLink.tsx"],"names":["Children","jsx","clsx","isValidElement","cloneElement","index","_a","_b","useContext","Slot","props","Slottable","Fragment","forwardRef","jsxs"],"mappings":"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","file":"index.mjs","sourcesContent":["import { clsx } from \"clsx/lite\";\nimport {\n Children,\n HTMLAttributes,\n ReactElement,\n ReactNode,\n cloneElement,\n createContext,\n isValidElement,\n useEffect,\n useId,\n useState,\n} from \"react\";\nimport \"./tabs.pcss\";\nimport { TabPanelProps } from \"./TabPanel\";\n\nexport interface TabsContextType {\n id: string;\n count: number;\n isSelectOnFocus: boolean;\n selectedIndex: number;\n setSelectedIndex: (index: number) => void;\n setPreviousIndex: (index: number) => void;\n}\n\nexport const TabsContext = createContext<TabsContextType | null>(null);\n\nexport interface TabsProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n defaultIndex?: number;\n isSelectOnFocus?: boolean;\n onChange?: (index: number) => void;\n children: ReactNode;\n className?: string;\n}\n\nexport const Tabs = ({\n defaultIndex = 0,\n onChange,\n isSelectOnFocus = false,\n children,\n className,\n ...rest\n}: TabsProps) => {\n const [selectedIndex, setSelectedIndex] = useState(defaultIndex);\n const [previousIndex, setPreviousIndex] = useState(defaultIndex);\n const id = useId();\n\n useEffect(() => {\n if (onChange && previousIndex !== selectedIndex) {\n onChange(selectedIndex);\n }\n }, [onChange, previousIndex, selectedIndex]);\n\n const arrayChildren = Children.toArray(children);\n const count = arrayChildren.length - 1;\n\n return (\n <TabsContext.Provider\n value={{\n id,\n count,\n isSelectOnFocus,\n selectedIndex,\n setSelectedIndex,\n setPreviousIndex,\n }}\n >\n <div className={clsx(\"sds-tabs\", className)} {...rest}>\n {Children.map(arrayChildren, (child, index) => {\n if (isValidElement(child) && index > 0) {\n return (\n <>\n {cloneElement(\n child as ReactElement<TabPanelProps & { index: number }>,\n {\n index: index - 1,\n },\n )}\n </>\n );\n } else {\n return child;\n }\n })}\n </div>\n </TabsContext.Provider>\n );\n};\n","import { clsx } from \"clsx/lite\";\nimport {\n Children,\n HTMLAttributes,\n ReactElement,\n ReactNode,\n cloneElement,\n isValidElement,\n} from \"react\";\nimport { TabProps } from \"./Tab\";\n\nexport interface TabListProps extends HTMLAttributes<HTMLDivElement> {\n children: ReactNode;\n \"aria-label\": NonNullable<string>;\n className?: string;\n}\n\nexport const TabList = ({\n children,\n \"aria-label\": ariaLabel,\n className,\n ...rest\n}: TabListProps) => {\n const arrayChildren = Children.toArray(children);\n\n return (\n <div\n className={clsx(\"sds-tabs__tab-list\", className)}\n role=\"tablist\"\n aria-label={ariaLabel}\n {...rest}\n >\n {Children.map(\n arrayChildren,\n (child, index) =>\n isValidElement(child) &&\n cloneElement(child as ReactElement<TabProps & { index: number }>, {\n index,\n }),\n )}\n </div>\n );\n};\n","import { type BadgeProps } from \"@sikt/sds-badge\";\nimport { clsx } from \"clsx/lite\";\nimport {\n HTMLAttributes,\n KeyboardEvent,\n ReactElement,\n ReactNode,\n cloneElement,\n isValidElement,\n useContext,\n PropsWithChildren,\n} from \"react\";\nimport { TabsContext } from \"./Tabs\";\n\nexport interface TabProps extends HTMLAttributes<HTMLButtonElement> {\n children: ReactNode;\n className?: string;\n icon?: ReactNode;\n badge?: ReactNode;\n}\n\nexport const Tab = ({\n children,\n className,\n icon,\n badge,\n ...rest\n}: TabProps) => {\n const { index } = rest as { index: number };\n const context = useContext(TabsContext);\n\n if (!context) {\n console.warn(\n \"TabContext missing. Component needs to be used inside <Tabs>\",\n );\n return null;\n }\n\n const {\n id,\n count,\n isSelectOnFocus,\n selectedIndex,\n setSelectedIndex,\n setPreviousIndex,\n } = context;\n\n const isSelected = index === selectedIndex;\n const handleSelect = (index: number) => {\n if (isSelectOnFocus) {\n setPreviousIndex(selectedIndex);\n setSelectedIndex(index);\n }\n };\n const handleKeyPress = (event: KeyboardEvent<HTMLButtonElement>) => {\n const firstIndex = 0;\n const lastIndex = count - 1;\n const currentTarget = event.currentTarget;\n const firstChild = currentTarget.parentElement?.firstChild as HTMLElement;\n const lastChild = currentTarget.parentElement?.lastChild as HTMLElement;\n\n if (event.key === \"ArrowLeft\") {\n const previousSibling = currentTarget.previousSibling as HTMLElement;\n if (index > firstIndex) {\n previousSibling.focus();\n } else {\n lastChild.focus();\n }\n\n handleSelect(selectedIndex > firstIndex ? selectedIndex - 1 : lastIndex);\n } else if (event.key === \"ArrowRight\") {\n const nextSibling = currentTarget.nextSibling as HTMLElement;\n if (index < lastIndex) {\n nextSibling.focus();\n } else {\n firstChild.focus();\n }\n\n handleSelect(selectedIndex < lastIndex ? selectedIndex + 1 : firstIndex);\n } else if (event.key === \"Home\") {\n firstChild.focus();\n handleSelect(firstIndex);\n } else if (event.key === \"End\") {\n lastChild.focus();\n handleSelect(lastIndex);\n } else if (event.key === \"Enter\" || event.code === \"Space\") {\n setSelectedIndex(index);\n }\n };\n\n return (\n <button\n className={clsx(\"sds-tabs__tab\", className)}\n role=\"tab\"\n aria-selected={isSelected}\n aria-controls={`panel-${id}-${index}`}\n id={`tab-${id}-${index}`}\n tabIndex={isSelected ? 0 : -1}\n onClick={() => {\n setPreviousIndex(selectedIndex);\n setSelectedIndex(index);\n }}\n onKeyDown={handleKeyPress}\n {...rest}\n >\n {icon && <span className=\"sds-tabs__tab-icon\">{icon}</span>}\n {children}\n {badge && (\n <span className=\"sds-tabs__tab-badge\">\n {isValidElement(badge) &&\n cloneElement(badge as ReactElement<PropsWithChildren<BadgeProps>>, {\n visibility: \"strong\",\n })}\n </span>\n )}\n </button>\n );\n};\n","import { clsx } from \"clsx/lite\";\nimport { ReactNode, useContext } from \"react\";\nimport { TabsContext } from \"./Tabs\";\n\nexport interface TabPanelProps {\n children: ReactNode;\n className?: string;\n}\n\nexport const TabPanel = ({ children, className, ...rest }: TabPanelProps) => {\n const { index } = rest as { index: number };\n const context = useContext(TabsContext);\n\n if (!context) {\n console.warn(\n \"TabContext missing. Component needs to be used inside <Tabs>\",\n );\n return null;\n }\n\n const { id, selectedIndex } = context;\n\n const isSelected = index === selectedIndex;\n return (\n <div\n className={clsx(\"sds-tabs__tab-panel\", className)}\n id={`panel-${id}-${index}`}\n role=\"tabpanel\"\n tabIndex={isSelected ? undefined : -1}\n aria-labelledby={`tab-${id}-${index}`}\n hidden={!isSelected}\n {...rest}\n >\n {children}\n </div>\n );\n};\n","import * as React from 'react';\n\ntype PossibleRef<T> = React.Ref<T> | undefined;\n\n/**\n * Set a given ref to a given value\n * This utility takes care of different types of refs: callback refs and RefObject(s)\n */\nfunction setRef<T>(ref: PossibleRef<T>, value: T) {\n if (typeof ref === 'function') {\n return ref(value);\n } else if (ref !== null && ref !== undefined) {\n ref.current = value;\n }\n}\n\n/**\n * A utility to compose multiple refs together\n * Accepts callback refs and RefObject(s)\n */\nfunction composeRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T> {\n return (node) => {\n let hasCleanup = false;\n const cleanups = refs.map((ref) => {\n const cleanup = setRef(ref, node);\n if (!hasCleanup && typeof cleanup == 'function') {\n hasCleanup = true;\n }\n return cleanup;\n });\n\n // React <19 will log an error to the console if a callback ref returns a\n // value. We don't use ref cleanups internally so this will only happen if a\n // user's ref callback returns a value, which we only expect if they are\n // using the cleanup functionality added in React 19.\n if (hasCleanup) {\n return () => {\n for (let i = 0; i < cleanups.length; i++) {\n const cleanup = cleanups[i];\n if (typeof cleanup == 'function') {\n cleanup();\n } else {\n setRef(refs[i], null);\n }\n }\n };\n }\n };\n}\n\n/**\n * A custom hook that composes multiple refs\n * Accepts callback refs and RefObject(s)\n */\nfunction useComposedRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T> {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n return React.useCallback(composeRefs(...refs), refs);\n}\n\nexport { composeRefs, useComposedRefs };\n","import * as React from 'react';\nimport { composeRefs } from '@radix-ui/react-compose-refs';\n\n/* -------------------------------------------------------------------------------------------------\n * Slot\n * -----------------------------------------------------------------------------------------------*/\n\ninterface SlotProps extends React.HTMLAttributes<HTMLElement> {\n children?: React.ReactNode;\n}\n\n/* @__NO_SIDE_EFFECTS__ */ export function createSlot(ownerName: string) {\n const SlotClone = createSlotClone(ownerName);\n const Slot = React.forwardRef<HTMLElement, SlotProps>((props, forwardedRef) => {\n const { children, ...slotProps } = props;\n const childrenArray = React.Children.toArray(children);\n const slottable = childrenArray.find(isSlottable);\n\n if (slottable) {\n // the new element to render is the one passed as a child of `Slottable`\n const newElement = slottable.props.children;\n\n const newChildren = childrenArray.map((child) => {\n if (child === slottable) {\n // because the new element will be the one rendered, we are only interested\n // in grabbing its children (`newElement.props.children`)\n if (React.Children.count(newElement) > 1) return React.Children.only(null);\n return React.isValidElement(newElement)\n ? (newElement.props as { children: React.ReactNode }).children\n : null;\n } else {\n return child;\n }\n });\n\n return (\n <SlotClone {...slotProps} ref={forwardedRef}>\n {React.isValidElement(newElement)\n ? React.cloneElement(newElement, undefined, newChildren)\n : null}\n </SlotClone>\n );\n }\n\n return (\n <SlotClone {...slotProps} ref={forwardedRef}>\n {children}\n </SlotClone>\n );\n });\n\n Slot.displayName = `${ownerName}.Slot`;\n return Slot;\n}\n\nconst Slot = createSlot('Slot');\n\n/* -------------------------------------------------------------------------------------------------\n * SlotClone\n * -----------------------------------------------------------------------------------------------*/\n\ninterface SlotCloneProps {\n children: React.ReactNode;\n}\n\n/* @__NO_SIDE_EFFECTS__ */ function createSlotClone(ownerName: string) {\n const SlotClone = React.forwardRef<any, SlotCloneProps>((props, forwardedRef) => {\n const { children, ...slotProps } = props;\n\n if (React.isValidElement(children)) {\n const childrenRef = getElementRef(children);\n const props = mergeProps(slotProps, children.props as AnyProps);\n // do not pass ref to React.Fragment for React 19 compatibility\n if (children.type !== React.Fragment) {\n props.ref = forwardedRef ? composeRefs(forwardedRef, childrenRef) : childrenRef;\n }\n return React.cloneElement(children, props);\n }\n\n return React.Children.count(children) > 1 ? React.Children.only(null) : null;\n });\n\n SlotClone.displayName = `${ownerName}.SlotClone`;\n return SlotClone;\n}\n\n/* -------------------------------------------------------------------------------------------------\n * Slottable\n * -----------------------------------------------------------------------------------------------*/\n\nconst SLOTTABLE_IDENTIFIER = Symbol('radix.slottable');\n\ninterface SlottableProps {\n children: React.ReactNode;\n}\n\ninterface SlottableComponent extends React.FC<SlottableProps> {\n __radixId: symbol;\n}\n\n/* @__NO_SIDE_EFFECTS__ */ export function createSlottable(ownerName: string) {\n const Slottable: SlottableComponent = ({ children }) => {\n return <>{children}</>;\n };\n Slottable.displayName = `${ownerName}.Slottable`;\n Slottable.__radixId = SLOTTABLE_IDENTIFIER;\n return Slottable;\n}\n\nconst Slottable = createSlottable('Slottable');\n\n/* ---------------------------------------------------------------------------------------------- */\n\ntype AnyProps = Record<string, any>;\n\nfunction isSlottable(\n child: React.ReactNode\n): child is React.ReactElement<SlottableProps, typeof Slottable> {\n return (\n React.isValidElement(child) &&\n typeof child.type === 'function' &&\n '__radixId' in child.type &&\n child.type.__radixId === SLOTTABLE_IDENTIFIER\n );\n}\n\nfunction mergeProps(slotProps: AnyProps, childProps: AnyProps) {\n // all child props should override\n const overrideProps = { ...childProps };\n\n for (const propName in childProps) {\n const slotPropValue = slotProps[propName];\n const childPropValue = childProps[propName];\n\n const isHandler = /^on[A-Z]/.test(propName);\n if (isHandler) {\n // if the handler exists on both, we compose them\n if (slotPropValue && childPropValue) {\n overrideProps[propName] = (...args: unknown[]) => {\n const result = childPropValue(...args);\n slotPropValue(...args);\n return result;\n };\n }\n // but if it exists only on the slot, we use only this one\n else if (slotPropValue) {\n overrideProps[propName] = slotPropValue;\n }\n }\n // if it's `style`, we merge them\n else if (propName === 'style') {\n overrideProps[propName] = { ...slotPropValue, ...childPropValue };\n } else if (propName === 'className') {\n overrideProps[propName] = [slotPropValue, childPropValue].filter(Boolean).join(' ');\n }\n }\n\n return { ...slotProps, ...overrideProps };\n}\n\n// Before React 19 accessing `element.props.ref` will throw a warning and suggest using `element.ref`\n// After React 19 accessing `element.ref` does the opposite.\n// https://github.com/facebook/react/pull/28348\n//\n// Access the ref using the method that doesn't yield a warning.\nfunction getElementRef(element: React.ReactElement) {\n // React <=18 in DEV\n let getter = Object.getOwnPropertyDescriptor(element.props, 'ref')?.get;\n let mayWarn = getter && 'isReactWarning' in getter && getter.isReactWarning;\n if (mayWarn) {\n return (element as any).ref;\n }\n\n // React 19 in DEV\n getter = Object.getOwnPropertyDescriptor(element, 'ref')?.get;\n mayWarn = getter && 'isReactWarning' in getter && getter.isReactWarning;\n if (mayWarn) {\n return (element.props as { ref?: React.Ref<unknown> }).ref;\n }\n\n // Not DEV\n return (element.props as { ref?: React.Ref<unknown> }).ref || (element as any).ref;\n}\n\nexport {\n Slot,\n Slottable,\n //\n Slot as Root,\n};\nexport type { SlotProps };\n","import { Slot, Slottable } from \"@radix-ui/react-slot\";\nimport { type BadgeProps } from \"@sikt/sds-badge\";\nimport { clsx } from \"clsx/lite\";\nimport {\n AnchorHTMLAttributes,\n ReactElement,\n ReactNode,\n cloneElement,\n forwardRef,\n isValidElement,\n PropsWithChildren,\n} from \"react\";\nimport \"./tab-link.pcss\";\n\nexport interface TabLinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {\n children: ReactNode;\n className?: string;\n icon?: ReactNode;\n badge?: ReactNode;\n isSelected?: boolean;\n asChild?: boolean;\n}\n\nexport const TabLink = forwardRef<HTMLAnchorElement, TabLinkProps>(\n (\n {\n children,\n className,\n icon,\n badge,\n href,\n isSelected,\n asChild = false,\n ...rest\n }: TabLinkProps,\n ref,\n ) => {\n const Comp = asChild ? Slot : \"a\";\n\n return (\n <Comp\n className={clsx(\n \"sds-tabs__tab\",\n \"sds-tab-link\",\n isSelected && \"sds-tab-link--selected\",\n className,\n )}\n href={href}\n ref={ref}\n {...rest}\n >\n {icon && <div className=\"sds-tabs__tab-icon\">{icon}</div>}\n <Slottable>{children}</Slottable>\n {badge && (\n <div className=\"sds-tabs__tab-badge\">\n {isSelected\n ? isValidElement(badge) &&\n cloneElement(\n badge as ReactElement<PropsWithChildren<BadgeProps>>,\n { visibility: \"strong\" },\n )\n : badge}\n </div>\n )}\n </Comp>\n );\n },\n);\n\nTabLink.displayName = \"TabLink\";\n"]}
|