Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@launchpad-ui/tab-list

Package Overview
Dependencies
Maintainers
1
Versions
89
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@launchpad-ui/tab-list - npm Package Compare versions

Comparing version 0.2.2 to 0.3.0

56

dist/index.es.js

@@ -10,2 +10,3 @@ // ../../scripts/react-shim.js

import "./styles/TabList.css";
import { jsx, jsxs } from "react/jsx-runtime";
var TabList = (props) => {

@@ -22,16 +23,19 @@ const { activeTab, className, disabledTabs, onChange, ...rest } = props;

const classes = cx("TabList", className);
return /* @__PURE__ */ React.createElement("div", {
className: classes
}, /* @__PURE__ */ React.createElement("div", {
...tabListProps,
ref,
className: "TabList-list"
}, [...state.collection].map((item) => /* @__PURE__ */ React.createElement(TabItem, {
key: item.key,
item,
state
}))), /* @__PURE__ */ React.createElement(TabItemPanel, {
key: state.selectedItem?.key,
state
}));
return /* @__PURE__ */ jsxs("div", {
className: classes,
children: [
/* @__PURE__ */ jsx("div", {
...tabListProps,
ref,
className: "TabList-list",
children: [...state.collection].map((item) => /* @__PURE__ */ jsx(TabItem, {
item,
state
}, item.key))
}),
/* @__PURE__ */ jsx(TabItemPanel, {
state
}, state.selectedItem?.key)
]
});
};

@@ -42,10 +46,15 @@ var TabItem = ({ className, item: { key, rendered }, state }) => {

const isSelected = state.selectedKey === key;
const classes = cx("TabList-item", {
"is-active": isSelected
}, className);
return /* @__PURE__ */ React.createElement("div", {
const classes = cx(
"TabList-item",
{
"is-active": isSelected
},
className
);
return /* @__PURE__ */ jsx("div", {
...tabProps,
ref,
className: classes
}, rendered);
className: classes,
children: rendered
});
};

@@ -55,7 +64,8 @@ var TabItemPanel = ({ state, ...props }) => {

const { tabPanelProps } = useTabPanel(props, state, ref);
return /* @__PURE__ */ React.createElement("div", {
return /* @__PURE__ */ jsx("div", {
...tabPanelProps,
ref,
className: "TabList-panel"
}, state.selectedItem?.props.children);
className: "TabList-panel",
children: state.selectedItem?.props.children
});
};

@@ -62,0 +72,0 @@ export {

@@ -20,3 +20,6 @@ "use strict";

};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);

@@ -40,2 +43,3 @@

var import_TabList = require("./styles/TabList.css");
var import_jsx_runtime = require("react/jsx-runtime");
var TabList = (props) => {

@@ -52,16 +56,19 @@ const { activeTab, className, disabledTabs, onChange, ...rest } = props;

const classes = (0, import_clsx.default)("TabList", className);
return /* @__PURE__ */ React.createElement("div", {
className: classes
}, /* @__PURE__ */ React.createElement("div", {
...tabListProps,
ref,
className: "TabList-list"
}, [...state.collection].map((item) => /* @__PURE__ */ React.createElement(TabItem, {
key: item.key,
item,
state
}))), /* @__PURE__ */ React.createElement(TabItemPanel, {
key: state.selectedItem?.key,
state
}));
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
className: classes,
children: [
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
...tabListProps,
ref,
className: "TabList-list",
children: [...state.collection].map((item) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TabItem, {
item,
state
}, item.key))
}),
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TabItemPanel, {
state
}, state.selectedItem?.key)
]
});
};

@@ -72,10 +79,15 @@ var TabItem = ({ className, item: { key, rendered }, state }) => {

const isSelected = state.selectedKey === key;
const classes = (0, import_clsx.default)("TabList-item", {
"is-active": isSelected
}, className);
return /* @__PURE__ */ React.createElement("div", {
const classes = (0, import_clsx.default)(
"TabList-item",
{
"is-active": isSelected
},
className
);
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
...tabProps,
ref,
className: classes
}, rendered);
className: classes,
children: rendered
});
};

@@ -85,7 +97,8 @@ var TabItemPanel = ({ state, ...props }) => {

const { tabPanelProps } = (0, import_tabs.useTabPanel)(props, state, ref);
return /* @__PURE__ */ React.createElement("div", {
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
...tabPanelProps,
ref,
className: "TabList-panel"
}, state.selectedItem?.props.children);
className: "TabList-panel",
children: state.selectedItem?.props.children
});
};

@@ -92,0 +105,0 @@ // Annotate the CommonJS export names for ESM import in node:

{
"name": "@launchpad-ui/tab-list",
"version": "0.2.2",
"version": "0.3.0",
"status": "beta",

@@ -38,4 +38,4 @@ "publishConfig": {

"@react-stately/collections": "^3.4.0",
"react": "^16.8.0 || ^17.0.0 || ^18.0.0",
"react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
"react": "^18.0.0",
"react-dom": "^18.0.0"
},

@@ -42,0 +42,0 @@ "devDependencies": {

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