Socket
Socket
Sign inDemoInstall

@radix-ui/react-tabs

Package Overview
Dependencies
Maintainers
5
Versions
192
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@radix-ui/react-tabs - npm Package Compare versions

Comparing version 0.0.10 to 0.0.11

2

dist/index.js

@@ -1,2 +0,2 @@

var e,a,t,o=require("@radix-ui/react-id").useId,r=require("@radix-ui/react-roving-focus"),n=r.RovingFocusGroup,i=r.useRovingFocus,s=require("@radix-ui/react-primitive").Primitive,l=require("@radix-ui/react-use-controllable-state").useControllableState,u=require("@radix-ui/react-use-callback-ref").useCallbackRef,d=require("@radix-ui/react-context").createContext,c=require("@radix-ui/primitive").composeEventHandlers,b=(e={},a=require("react"),Object.keys(a).forEach((function(t){"default"!==t&&"__esModule"!==t&&Object.defineProperty(e,t,{enumerable:!0,get:function(){return a[t]}})})),e),f=(t=require("@babel/runtime/helpers/extends"))&&t.__esModule?t.default:t;const[p,v]=d("Tabs"),x=b.forwardRef(((e,a)=>{const{value:t,onValueChange:r,defaultValue:n,orientation:i="horizontal",dir:u="ltr",activationMode:d="automatic",...c}=e,v=o(),[x,m]=l({prop:t,onChange:r,defaultProp:n});return b.createElement(p,{baseId:v,value:x,onValueChange:m,orientation:i,dir:u,activationMode:d},b.createElement(s,f({"data-orientation":i},c,{ref:a})))}));exports.Tabs=x,x.displayName="Tabs";const m=b.forwardRef(((e,a)=>{const{loop:t=!0,...o}=e,r=v("TabsList");return b.createElement(n,{orientation:r.orientation,loop:t,dir:r.dir},b.createElement(s,f({role:"tablist","aria-orientation":r.orientation,"data-orientation":r.orientation},o,{ref:a})))}));exports.TabsList=m,m.displayName="TabsList";const T=b.forwardRef(((e,a)=>{const{value:t,disabled:o,...r}=e,n=v("TabsTab"),l=w(n.baseId,t),d=q(n.baseId,t),p=t===n.value,x=i({disabled:o,active:p}),m=u((()=>n.onValueChange(t))),T=c(r.onKeyDown,c(x.onKeyDown,(e=>{o||" "!==e.key&&"Enter"!==e.key||m()}))),y=c(r.onMouseDown,c(x.onMouseDown,(e=>{o||0!==e.button||!1!==e.ctrlKey||m()}))),E=c(r.onFocus,c(x.onFocus,(()=>{const e="manual"!==n.activationMode;p||o||!e||m()})));return b.createElement(s,f({role:"tab","aria-selected":p,"aria-controls":d,"aria-disabled":o||void 0,"data-state":p?"active":"inactive","data-disabled":o?"":void 0,"data-orientation":n.orientation,id:l},r,x,{ref:a,onKeyDown:T,onMouseDown:y,onFocus:E}))}));exports.TabsTab=T,T.displayName="TabsTab";const y=b.forwardRef(((e,a)=>{const{value:t,...o}=e,r=v("TabsPanel"),n=w(r.baseId,t),i=q(r.baseId,t),l=t===r.value;return b.createElement(s,f({"data-state":l?"active":"inactive","data-orientation":r.orientation,role:"tabpanel","aria-labelledby":n,hidden:!l,id:i,tabIndex:0},o,{ref:a}))}));function w(e,a){return`${e}-tab-${a}`}function q(e,a){return`${e}-panel-${a}`}exports.TabsPanel=y,y.displayName="TabsPanel";const E=x;exports.Root=E;const g=m;exports.List=g;const h=T;exports.Tab=h;const M=y;exports.Panel=M;
var e,t,a,o=require("@radix-ui/react-id").useId,r=require("@radix-ui/react-roving-focus"),n=r.RovingFocusGroup,i=r.useRovingFocus,s=require("@radix-ui/react-primitive").Primitive,u=require("@radix-ui/react-use-controllable-state").useControllableState,l=require("@radix-ui/react-use-callback-ref").useCallbackRef,c=require("@radix-ui/react-context").createContext,d=require("@radix-ui/primitive").composeEventHandlers,b=(e={},t=require("react"),Object.keys(t).forEach((function(a){"default"!==a&&"__esModule"!==a&&Object.defineProperty(e,a,{enumerable:!0,get:function(){return t[a]}})})),e),f=(a=require("@babel/runtime/helpers/extends"))&&a.__esModule?a.default:a;const[v,p]=c("Tabs"),x=/*#__PURE__*/b.forwardRef(((e,t)=>{const{value:a,onValueChange:r,defaultValue:n,orientation:i="horizontal",dir:l="ltr",activationMode:c="automatic",...d}=e,p=o(),[x,m]=u({prop:a,onChange:r,defaultProp:n});/*#__PURE__*/return b.createElement(v,{baseId:p,value:x,onValueChange:m,orientation:i,dir:l,activationMode:c},/*#__PURE__*/b.createElement(s,f({"data-orientation":i},d,{ref:t})))}));exports.Tabs=x;const m=/*#__PURE__*/b.forwardRef(((e,t)=>{const{loop:a=!0,...o}=e,r=p("TabsList");/*#__PURE__*/return b.createElement(n,{orientation:r.orientation,loop:a,dir:r.dir},/*#__PURE__*/b.createElement(s,f({role:"tablist","aria-orientation":r.orientation,"data-orientation":r.orientation},o,{ref:t})))}));exports.TabsList=m;const T=/*#__PURE__*/b.forwardRef(((e,t)=>{const{value:a,disabled:o,...r}=e,n=p("TabsTab"),u=q(n.baseId,a),c=y(n.baseId,a),v=a===n.value,x=i({disabled:o,active:v}),m=l((()=>n.onValueChange(a))),T=d(r.onKeyDown,d(x.onKeyDown,(e=>{o||" "!==e.key&&"Enter"!==e.key||m()}))),w=d(r.onMouseDown,d(x.onMouseDown,(e=>{o||0!==e.button||!1!==e.ctrlKey||m()}))),E=d(r.onFocus,d(x.onFocus,(()=>{const e="manual"!==n.activationMode;v||o||!e||m()})));/*#__PURE__*/return b.createElement(s,f({role:"tab","aria-selected":v,"aria-controls":c,"aria-disabled":o||void 0,"data-state":v?"active":"inactive","data-disabled":o?"":void 0,"data-orientation":n.orientation,id:u},r,x,{ref:t,onKeyDown:T,onMouseDown:w,onFocus:E}))}));exports.TabsTab=T;const w=/*#__PURE__*/b.forwardRef(((e,t)=>{const{value:a,...o}=e,r=p("TabsPanel"),n=q(r.baseId,a),i=y(r.baseId,a),u=a===r.value;/*#__PURE__*/return b.createElement(s,f({"data-state":u?"active":"inactive","data-orientation":r.orientation,role:"tabpanel","aria-labelledby":n,hidden:!u,id:i,tabIndex:0},o,{ref:t}))}));function q(e,t){return`${e}-tab-${t}`}function y(e,t){return`${e}-panel-${t}`}exports.TabsPanel=w;const E=x;exports.Root=E;const g=m;exports.List=g;const h=T;exports.Tab=h;const M=w;exports.Panel=M;
//# sourceMappingURL=index.js.map

@@ -1,2 +0,2 @@

import{useId as a}from"@radix-ui/react-id";import{RovingFocusGroup as e,useRovingFocus as t}from"@radix-ui/react-roving-focus";import{Primitive as o}from"@radix-ui/react-primitive";import{useControllableState as r}from"@radix-ui/react-use-controllable-state";import{useCallbackRef as i}from"@radix-ui/react-use-callback-ref";import{createContext as n}from"@radix-ui/react-context";import{composeEventHandlers as s}from"@radix-ui/primitive";import*as l from"react";import d from"@babel/runtime/helpers/esm/extends";const[c,b]=n("Tabs");export const Tabs=l.forwardRef(((e,t)=>{const{value:i,onValueChange:n,defaultValue:s,orientation:b="horizontal",dir:u="ltr",activationMode:m="automatic",...p}=e,f=a(),[T,v]=r({prop:i,onChange:n,defaultProp:s});return l.createElement(c,{baseId:f,value:T,onValueChange:v,orientation:b,dir:u,activationMode:m},l.createElement(o,d({"data-orientation":b},p,{ref:t})))}));Tabs.displayName="Tabs";export const TabsList=l.forwardRef(((a,t)=>{const{loop:r=!0,...i}=a,n=b("TabsList");return l.createElement(e,{orientation:n.orientation,loop:r,dir:n.dir},l.createElement(o,d({role:"tablist","aria-orientation":n.orientation,"data-orientation":n.orientation},i,{ref:t})))}));TabsList.displayName="TabsList";export const TabsTab=l.forwardRef(((a,e)=>{const{value:r,disabled:n,...c}=a,p=b("TabsTab"),f=u(p.baseId,r),T=m(p.baseId,r),v=r===p.value,x=t({disabled:n,active:v}),y=i((()=>p.onValueChange(r))),w=s(c.onKeyDown,s(x.onKeyDown,(a=>{n||" "!==a.key&&"Enter"!==a.key||y()}))),h=s(c.onMouseDown,s(x.onMouseDown,(a=>{n||0!==a.button||!1!==a.ctrlKey||y()}))),E=s(c.onFocus,s(x.onFocus,(()=>{const a="manual"!==p.activationMode;v||n||!a||y()})));return l.createElement(o,d({role:"tab","aria-selected":v,"aria-controls":T,"aria-disabled":n||void 0,"data-state":v?"active":"inactive","data-disabled":n?"":void 0,"data-orientation":p.orientation,id:f},c,x,{ref:e,onKeyDown:w,onMouseDown:h,onFocus:E}))}));TabsTab.displayName="TabsTab";export const TabsPanel=l.forwardRef(((a,e)=>{const{value:t,...r}=a,i=b("TabsPanel"),n=u(i.baseId,t),s=m(i.baseId,t),c=t===i.value;return l.createElement(o,d({"data-state":c?"active":"inactive","data-orientation":i.orientation,role:"tabpanel","aria-labelledby":n,hidden:!c,id:s,tabIndex:0},r,{ref:e}))}));function u(a,e){return`${a}-tab-${e}`}function m(a,e){return`${a}-panel-${e}`}TabsPanel.displayName="TabsPanel";export const Root=Tabs;export const List=TabsList;export const Tab=TabsTab;export const Panel=TabsPanel;
import{useId as e}from"@radix-ui/react-id";import{RovingFocusGroup as a,useRovingFocus as t}from"@radix-ui/react-roving-focus";import{Primitive as o}from"@radix-ui/react-primitive";import{useControllableState as r}from"@radix-ui/react-use-controllable-state";import{useCallbackRef as n}from"@radix-ui/react-use-callback-ref";import{createContext as i}from"@radix-ui/react-context";import{composeEventHandlers as s}from"@radix-ui/primitive";import*as d from"react";import l from"@babel/runtime/helpers/esm/extends";const[c,u]=i("Tabs");export const Tabs=/*#__PURE__*/d.forwardRef(((a,t)=>{const{value:n,onValueChange:i,defaultValue:s,orientation:u="horizontal",dir:b="ltr",activationMode:m="automatic",...f}=a,p=e(),[v,x]=r({prop:n,onChange:i,defaultProp:s});/*#__PURE__*/return d.createElement(c,{baseId:p,value:v,onValueChange:x,orientation:u,dir:b,activationMode:m},/*#__PURE__*/d.createElement(o,l({"data-orientation":u},f,{ref:t})))}));/*#__PURE__*/export const TabsList=/*#__PURE__*/d.forwardRef(((e,t)=>{const{loop:r=!0,...n}=e,i=u("TabsList");/*#__PURE__*/return d.createElement(a,{orientation:i.orientation,loop:r,dir:i.dir},/*#__PURE__*/d.createElement(o,l({role:"tablist","aria-orientation":i.orientation,"data-orientation":i.orientation},n,{ref:t})))}));/*#__PURE__*/export const TabsTab=/*#__PURE__*/d.forwardRef(((e,a)=>{const{value:r,disabled:i,...c}=e,f=u("TabsTab"),p=b(f.baseId,r),v=m(f.baseId,r),x=r===f.value,T=t({disabled:i,active:x}),w=n((()=>f.onValueChange(r))),h=s(c.onKeyDown,s(T.onKeyDown,(e=>{i||" "!==e.key&&"Enter"!==e.key||w()}))),y=s(c.onMouseDown,s(T.onMouseDown,(e=>{i||0!==e.button||!1!==e.ctrlKey||w()}))),E=s(c.onFocus,s(T.onFocus,(()=>{const e="manual"!==f.activationMode;x||i||!e||w()})));/*#__PURE__*/return d.createElement(o,l({role:"tab","aria-selected":x,"aria-controls":v,"aria-disabled":i||void 0,"data-state":x?"active":"inactive","data-disabled":i?"":void 0,"data-orientation":f.orientation,id:p},c,T,{ref:a,onKeyDown:h,onMouseDown:y,onFocus:E}))}));/*#__PURE__*/export const TabsPanel=/*#__PURE__*/d.forwardRef(((e,a)=>{const{value:t,...r}=e,n=u("TabsPanel"),i=b(n.baseId,t),s=m(n.baseId,t),c=t===n.value;/*#__PURE__*/return d.createElement(o,l({"data-state":c?"active":"inactive","data-orientation":n.orientation,role:"tabpanel","aria-labelledby":i,hidden:!c,id:s,tabIndex:0},r,{ref:a}))}));/*#__PURE__*/function b(e,a){return`${e}-tab-${a}`}function m(e,a){return`${e}-panel-${a}`}export const Root=Tabs;export const List=TabsList;export const Tab=TabsTab;export const Panel=TabsPanel;
//# sourceMappingURL=index.module.js.map
{
"name": "@radix-ui/react-tabs",
"version": "0.0.10",
"version": "0.0.11",
"license": "MIT",

@@ -21,10 +21,10 @@ "source": "src/index.ts",

"@babel/runtime": "^7.13.10",
"@radix-ui/primitive": "0.0.4",
"@radix-ui/react-context": "0.0.4",
"@radix-ui/react-id": "0.0.4",
"@radix-ui/react-polymorphic": "0.0.9",
"@radix-ui/react-primitive": "0.0.10",
"@radix-ui/react-roving-focus": "0.0.10",
"@radix-ui/react-use-callback-ref": "0.0.4",
"@radix-ui/react-use-controllable-state": "0.0.5"
"@radix-ui/primitive": "0.0.5",
"@radix-ui/react-context": "0.0.5",
"@radix-ui/react-id": "0.0.5",
"@radix-ui/react-polymorphic": "0.0.10",
"@radix-ui/react-primitive": "0.0.11",
"@radix-ui/react-roving-focus": "0.0.11",
"@radix-ui/react-use-callback-ref": "0.0.5",
"@radix-ui/react-use-controllable-state": "0.0.6"
},

@@ -31,0 +31,0 @@ "peerDependencies": {

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc