@logora/debate 0.3.3 → 0.3.6

package/dist/components/auth/oauth2_button/OAuth2Button.js

@@ -1,33 +1,33 @@
 import { jsx as e } from "react/jsx-runtime";
-import O from "classnames";
+import b from "classnames";
 import "react";
-import b from "react-oauth-popup";
+import p from "react-oauth-popup";
 import { useLocation as x } from "react-router-dom";
-import p from "./OAuth2Button.module.scss.js";
-const j = ({
-  provider: c,
-  authDialogUrl: d,
-  clientId: m,
-  redirectUri: h,
+import c from "./OAuth2Button.module.scss.js";
+const U = p?.default ?? p, A = ({
+  provider: d,
+  authDialogUrl: m,
+  clientId: h,
+  redirectUri: u,
   scope: f,
-  responseType: r,
-  accessType: o = "",
-  forceAuth: u = !1,
-  onCode: l,
+  responseType: o,
+  accessType: r = "",
+  forceAuth: l = !1,
+  onCode: P,
   onClose: t,
   popup: w = !0,
   children: n,
-  className: P,
+  className: _,
   state: s = ""
 }) => {
   x();
-  const C = (a, U) => {
-    l(a, c);
-  }, _ = () => {
+  const C = (a, g) => {
+    P(a, d);
+  }, O = () => {
     t && t();
   }, i = () => {
-    const a = new URL(d);
-    return a.searchParams.append("client_id", m), a.searchParams.append("redirect_uri", h), a.searchParams.append("scope", f), u && a.searchParams.append("force_authentication", "1"), r && a.searchParams.append("response_type", r), o && a.searchParams.append("access_type", o), typeof window < "u" && a.searchParams.append(
+    const a = new URL(m);
+    return a.searchParams.append("client_id", h), a.searchParams.append("redirect_uri", u), a.searchParams.append("scope", f), l && a.searchParams.append("force_authentication", "1"), o && a.searchParams.append("response_type", o), r && a.searchParams.append("access_type", r), typeof window < "u" && a.searchParams.append(
       "state",
       s ? window.btoa(s) : window.btoa(window.location.href)
     ), a.href;
@@ -36,19 +36,19 @@ const j = ({
     "div",
     {
       "data-testid": "container",
-      className: O(p.oauthButtonContainer, P),
+      className: b(c.oauthButtonContainer, _),
       children: w ? /* @__PURE__ */ e(
-        b,
+        U,
         {
           url: i(),
           onCode: C,
-          onClose: _,
-          children: /* @__PURE__ */ e("div", { className: p.oauthPopupContainer, children: n })
+          onClose: O,
+          children: /* @__PURE__ */ e("div", { className: c.oauthPopupContainer, children: n })
         }
       ) : /* @__PURE__ */ e("a", { href: i(), children: n })
     }
   );
 };
 export {
-  j as OAuth2Button
+  A as OAuth2Button
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@logora/debate",
-  "version": "0.3.3",
+  "version": "0.3.6",
   "type": "module",
   "license": "AGPL-3.0",
   "description": "Design system of @Logora made with React",
@@ -76,7 +76,7 @@
     "webfontloader": "^1.6.28"
   },
   "devDependencies": {
-    "@biomejs/biome": "^1.9.4",
+    "@biomejs/biome": "^2.4.11",
     "@faker-js/faker": "^10.4.0",
     "@storybook/addon-a11y": "^10.3.5",
     "@storybook/addon-docs": "^10.3.5",
@@ -87,13 +87,13 @@
     "@testing-library/react": "^16.3.2",
     "@testing-library/user-event": "^14.5.2",
     "@vitejs/plugin-react": "^4.7.0",
-    "@vitest/coverage-v8": "^4.1.3",
+    "@vitest/coverage-v8": "^4.1.4",
     "jsdom": "^29.0.2",
     "sass": "^1.85.0",
     "storybook": "^10.3.5",
     "vite": "^7.3.2",
     "vite-plugin-lib-inject-css": "^2.2.2",
-    "vitest": "^4.1.3"
+    "vitest": "^4.1.4"
   },
   "peerDependencies": {
     "react": "^17.0.0 || ^18.0.0",

package/src/components/styles/tabs/Tabs.stories.jsx

@@ -0,0 +1,66 @@
+import React, { useState } from "react";
+import cx from "classnames";
+import styles from "./tabs.stories.module.scss";
+
+const TabsDemo = ({ tabs }) => {
+	const [activeTab, setActiveTab] = useState(0);
+
+	return (
+		<div>
+			<nav>
+				<ul className={styles.navTabs}>
+					{tabs.map((tab, index) => (
+						<li key={tab} className={styles.navItem}>
+							<div
+								className={cx(styles.navLink, {
+									[styles.active]: activeTab === index,
+								})}
+								onClick={() => setActiveTab(index)}
+								onKeyUp={(e) => {
+									if (e.key === "Enter" || e.key === " ") setActiveTab(index);
+								}}
+								role="tab"
+								tabIndex={0}
+								aria-selected={activeTab === index}
+							>
+								{tab}
+							</div>
+						</li>
+					))}
+				</ul>
+			</nav>
+			<div className={styles.tabContent}>
+				{tabs.map((tab, index) => (
+					<div
+						key={tab}
+						className={cx(styles.tabPane, { [styles.active]: activeTab === index })}
+					>
+						Contenu de l'onglet : <strong>{tab}</strong>
+					</div>
+				))}
+			</div>
+		</div>
+	);
+};
+
+const meta = {
+	title: "Styles/Tabs",
+	component: TabsDemo,
+	args: {
+		tabs: ["Onglet 1", "Onglet 2", "Onglet 3"],
+	},
+	argTypes: {
+		tabs: { control: "object" },
+	},
+	render: (args) => <TabsDemo {...args} />,
+};
+
+export default meta;
+
+export const DefaultTabs = {};
+
+export const TwoTabs = {
+	args: {
+		tabs: ["En cours", "Sélectionnés"],
+	},
+};

package/src/components/styles/tabs/_tabs.scss

@@ -25,10 +25,6 @@
         display: none;
     }
 
-    .navItem {
-        margin-bottom: -1px;
-    }
-
     .navLink {
         border: 1px solid transparent;
         border-top-left-radius: theme.$box-border-radius;
@@ -56,7 +52,7 @@
 
 .navLink {
     display: block;
-    padding-bottom: spacing.$spacer-xs;
+    padding-bottom: spacing.$spacer-sm;
 
     &:hover,
     &:focus {
@@ -99,22 +95,28 @@
     outline: 0;
 }
 
-.navLink.active,
-.navLink:hover {
+.navLink.active {
     border: none !important;
     color: theme.$text-primary !important;
     background: transparent;
     font-weight: theme.$font-weight-bold;
 }
 
+.navLink:hover {
+    border: none !important;
+    color: theme.$text-primary !important;
+    background: transparent;
+}
+
 .navLink::after {
     content: "";
     background-color: theme.$text-primary;
-    height: 4px;
+    height: 2px;
     position: absolute;
     width: 100%;
     left: 0;
     bottom: -1px;
+    z-index: 1;
     transition: all 250ms ease 0s;
     transform: scale(0);
 }

package/src/components/styles/tabs/tabs.stories.module.scss

@@ -0,0 +1 @@
+@use './tabs';