@goil/badge - npm Package Compare versions

Comparing version 1.0.2 to 1.1.0

dist/react.cjs

@@ -1,2 +0,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),n=require("react"),s=require("./index.cjs");function c({variant:t="auto",lang:r="auto"}){const e=n.useRef(null);return n.useEffect(()=>{if(!e.current)return;const{element:u,destroy:o}=s.createGoilBadge({variant:t,lang:r});return e.current.appendChild(u),o},[t,r]),i.jsx("span",{ref:e,style:{display:"inline-block"}})}exports.GoilBadge=c;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react/jsx-runtime"),n=require("react"),d=require("./index.cjs");function a({variant:i="auto",lang:r="auto",position:e="bottom-right",zIndex:o=9999}){const t=n.useRef(null);n.useEffect(()=>{if(!t.current)return;const{element:l,destroy:s}=d.createGoilBadge({variant:i,lang:r});return t.current.appendChild(l),s},[i,r]);const u=e==="inline"?{display:"inline-block",lineHeight:0}:{position:"fixed",zIndex:o,lineHeight:0,...e.startsWith("bottom")?{bottom:16}:{top:16},...e.endsWith("right")?{right:16}:{left:16}};return c.jsx("div",{ref:t,style:u})}exports.GoilBadge=a;
 //# sourceMappingURL=react.cjs.map

dist/react.cjs.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"react.cjs","sources":["../src/react.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react'\nimport { createGoilBadge, type GoilBadgeOptions } from './core'\n\nexport type { GoilBadgeOptions, GoilBadgeVariant, GoilBadgeLang } from './core'\n\nexport function GoilBadge({ variant = 'auto', lang = 'auto' }: GoilBadgeOptions) {\n  const ref = useRef<HTMLSpanElement>(null)\n\n  useEffect(() => {\n    if (!ref.current) return\n    const { element, destroy } = createGoilBadge({ variant, lang })\n    ref.current.appendChild(element)\n    return destroy\n  }, [variant, lang])\n\n  return <span ref={ref} style={{ display: 'inline-block' }} />\n}\n"],"names":["GoilBadge","variant","lang","ref","useRef","useEffect","element","destroy","createGoilBadge"],"mappings":"iKAKO,SAASA,EAAU,CAAE,QAAAC,EAAU,OAAQ,KAAAC,EAAO,QAA4B,CAC/E,MAAMC,EAAMC,EAAAA,OAAwB,IAAI,EAExCC,OAAAA,EAAAA,UAAU,IAAM,CACd,GAAI,CAACF,EAAI,QAAS,OAClB,KAAM,CAAE,QAAAG,EAAS,QAAAC,CAAA,EAAYC,EAAAA,gBAAgB,CAAE,QAAAP,EAAS,KAAAC,EAAM,EAC9D,OAAAC,EAAI,QAAQ,YAAYG,CAAO,EACxBC,CACT,EAAG,CAACN,EAASC,CAAI,CAAC,QAEV,OAAA,CAAK,IAAAC,EAAU,MAAO,CAAE,QAAS,gBAAkB,CAC7D"}
+{"version":3,"file":"react.cjs","sources":["../src/react.tsx"],"sourcesContent":["'use client'\n\nimport { useEffect, useRef, type CSSProperties } from 'react'\nimport { createGoilBadge, type GoilBadgeOptions } from './core'\n\nexport type { GoilBadgeOptions, GoilBadgeVariant, GoilBadgeLang } from './core'\n\nexport type GoilBadgePosition =\n  | 'bottom-right'\n  | 'bottom-left'\n  | 'top-right'\n  | 'top-left'\n  | 'inline'\n\nexport interface GoilBadgeProps extends GoilBadgeOptions {\n  position?: GoilBadgePosition\n  zIndex?: number\n}\n\nexport function GoilBadge({\n  variant = 'auto',\n  lang = 'auto',\n  position = 'bottom-right',\n  zIndex = 9999,\n}: GoilBadgeProps) {\n  const ref = useRef<HTMLDivElement>(null)\n\n  useEffect(() => {\n    if (!ref.current) return\n    const { element, destroy } = createGoilBadge({ variant, lang })\n    ref.current.appendChild(element)\n    return destroy\n  }, [variant, lang])\n\n  const style: CSSProperties =\n    position === 'inline'\n      ? { display: 'inline-block', lineHeight: 0 }\n      : {\n          position: 'fixed',\n          zIndex,\n          lineHeight: 0,\n          ...(position.startsWith('bottom') ? { bottom: 16 } : { top: 16 }),\n          ...(position.endsWith('right') ? { right: 16 } : { left: 16 }),\n        }\n\n  return <div ref={ref} style={style} />\n}\n"],"names":["GoilBadge","variant","lang","position","zIndex","ref","useRef","useEffect","element","destroy","createGoilBadge","style","jsx"],"mappings":"8KAmBO,SAASA,EAAU,CACxB,QAAAC,EAAU,OACV,KAAAC,EAAO,OACP,SAAAC,EAAW,eACX,OAAAC,EAAS,IACX,EAAmB,CACjB,MAAMC,EAAMC,EAAAA,OAAuB,IAAI,EAEvCC,EAAAA,UAAU,IAAM,CACd,GAAI,CAACF,EAAI,QAAS,OAClB,KAAM,CAAE,QAAAG,EAAS,QAAAC,CAAA,EAAYC,EAAAA,gBAAgB,CAAE,QAAAT,EAAS,KAAAC,EAAM,EAC9D,OAAAG,EAAI,QAAQ,YAAYG,CAAO,EACxBC,CACT,EAAG,CAACR,EAASC,CAAI,CAAC,EAElB,MAAMS,EACJR,IAAa,SACT,CAAE,QAAS,eAAgB,WAAY,GACvC,CACE,SAAU,QACV,OAAAC,EACA,WAAY,EACZ,GAAID,EAAS,WAAW,QAAQ,EAAI,CAAE,OAAQ,EAAA,EAAO,CAAE,IAAK,EAAA,EAC5D,GAAIA,EAAS,SAAS,OAAO,EAAI,CAAE,MAAO,EAAA,EAAO,CAAE,KAAM,EAAA,CAAG,EAGpE,OAAOS,EAAAA,IAAC,MAAA,CAAI,IAAAP,EAAU,MAAAM,CAAA,CAAc,CACtC"}

dist/react.d.ts

 import { JSX } from 'react/jsx-runtime';
 
-export declare function GoilBadge({ variant, lang }: GoilBadgeOptions): JSX.Element;
+export declare function GoilBadge({ variant, lang, position, zIndex, }: GoilBadgeProps): JSX.Element;
 
@@ -12,4 +12,11 @@ export declare type GoilBadgeLang = 'en' | 'es' | 'ca' | 'auto';
 
+export declare type GoilBadgePosition = 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left' | 'inline';
+
+export declare interface GoilBadgeProps extends GoilBadgeOptions {
+    position?: GoilBadgePosition;
+    zIndex?: number;
+}
+
 export declare type GoilBadgeVariant = 'dark' | 'light' | 'auto';
 
 export { }

dist/react.js

@@ -0,15 +1,29 @@
+"use client";
 import { jsx as u } from "react/jsx-runtime";
-import { useRef as i, useEffect as f } from "react";
-import { createGoilBadge as l } from "./index.js";
-function m({ variant: r = "auto", lang: t = "auto" }) {
-  const e = i(null);
-  return f(() => {
+import { useRef as f, useEffect as c } from "react";
+import { createGoilBadge as m } from "./index.js";
+function g({
+  variant: r = "auto",
+  lang: i = "auto",
+  position: t = "bottom-right",
+  zIndex: o = 9999
+}) {
+  const e = f(null);
+  c(() => {
     if (!e.current) return;
-    const { element: o, destroy: n } = l({ variant: r, lang: t });
-    return e.current.appendChild(o), n;
-  }, [r, t]), /* @__PURE__ */ u("span", { ref: e, style: { display: "inline-block" } });
+    const { element: l, destroy: s } = m({ variant: r, lang: i });
+    return e.current.appendChild(l), s;
+  }, [r, i]);
+  const n = t === "inline" ? { display: "inline-block", lineHeight: 0 } : {
+    position: "fixed",
+    zIndex: o,
+    lineHeight: 0,
+    ...t.startsWith("bottom") ? { bottom: 16 } : { top: 16 },
+    ...t.endsWith("right") ? { right: 16 } : { left: 16 }
+  };
+  return /* @__PURE__ */ u("div", { ref: e, style: n });
 }
 export {
-  m as GoilBadge
+  g as GoilBadge
 };
 //# sourceMappingURL=react.js.map

dist/react.js.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"react.js","sources":["../src/react.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react'\nimport { createGoilBadge, type GoilBadgeOptions } from './core'\n\nexport type { GoilBadgeOptions, GoilBadgeVariant, GoilBadgeLang } from './core'\n\nexport function GoilBadge({ variant = 'auto', lang = 'auto' }: GoilBadgeOptions) {\n  const ref = useRef<HTMLSpanElement>(null)\n\n  useEffect(() => {\n    if (!ref.current) return\n    const { element, destroy } = createGoilBadge({ variant, lang })\n    ref.current.appendChild(element)\n    return destroy\n  }, [variant, lang])\n\n  return <span ref={ref} style={{ display: 'inline-block' }} />\n}\n"],"names":["GoilBadge","variant","lang","ref","useRef","useEffect","element","destroy","createGoilBadge"],"mappings":";;;AAKO,SAASA,EAAU,EAAE,SAAAC,IAAU,QAAQ,MAAAC,IAAO,UAA4B;AAC/E,QAAMC,IAAMC,EAAwB,IAAI;AAExC,SAAAC,EAAU,MAAM;AACd,QAAI,CAACF,EAAI,QAAS;AAClB,UAAM,EAAE,SAAAG,GAAS,SAAAC,EAAA,IAAYC,EAAgB,EAAE,SAAAP,GAAS,MAAAC,GAAM;AAC9D,WAAAC,EAAI,QAAQ,YAAYG,CAAO,GACxBC;AAAA,EACT,GAAG,CAACN,GAASC,CAAI,CAAC,qBAEV,QAAA,EAAK,KAAAC,GAAU,OAAO,EAAE,SAAS,kBAAkB;AAC7D;"}
+{"version":3,"file":"react.js","sources":["../src/react.tsx"],"sourcesContent":["'use client'\n\nimport { useEffect, useRef, type CSSProperties } from 'react'\nimport { createGoilBadge, type GoilBadgeOptions } from './core'\n\nexport type { GoilBadgeOptions, GoilBadgeVariant, GoilBadgeLang } from './core'\n\nexport type GoilBadgePosition =\n  | 'bottom-right'\n  | 'bottom-left'\n  | 'top-right'\n  | 'top-left'\n  | 'inline'\n\nexport interface GoilBadgeProps extends GoilBadgeOptions {\n  position?: GoilBadgePosition\n  zIndex?: number\n}\n\nexport function GoilBadge({\n  variant = 'auto',\n  lang = 'auto',\n  position = 'bottom-right',\n  zIndex = 9999,\n}: GoilBadgeProps) {\n  const ref = useRef<HTMLDivElement>(null)\n\n  useEffect(() => {\n    if (!ref.current) return\n    const { element, destroy } = createGoilBadge({ variant, lang })\n    ref.current.appendChild(element)\n    return destroy\n  }, [variant, lang])\n\n  const style: CSSProperties =\n    position === 'inline'\n      ? { display: 'inline-block', lineHeight: 0 }\n      : {\n          position: 'fixed',\n          zIndex,\n          lineHeight: 0,\n          ...(position.startsWith('bottom') ? { bottom: 16 } : { top: 16 }),\n          ...(position.endsWith('right') ? { right: 16 } : { left: 16 }),\n        }\n\n  return <div ref={ref} style={style} />\n}\n"],"names":["GoilBadge","variant","lang","position","zIndex","ref","useRef","useEffect","element","destroy","createGoilBadge","style","jsx"],"mappings":";;;;AAmBO,SAASA,EAAU;AAAA,EACxB,SAAAC,IAAU;AAAA,EACV,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,QAAAC,IAAS;AACX,GAAmB;AACjB,QAAMC,IAAMC,EAAuB,IAAI;AAEvC,EAAAC,EAAU,MAAM;AACd,QAAI,CAACF,EAAI,QAAS;AAClB,UAAM,EAAE,SAAAG,GAAS,SAAAC,EAAA,IAAYC,EAAgB,EAAE,SAAAT,GAAS,MAAAC,GAAM;AAC9D,WAAAG,EAAI,QAAQ,YAAYG,CAAO,GACxBC;AAAA,EACT,GAAG,CAACR,GAASC,CAAI,CAAC;AAElB,QAAMS,IACJR,MAAa,WACT,EAAE,SAAS,gBAAgB,YAAY,MACvC;AAAA,IACE,UAAU;AAAA,IACV,QAAAC;AAAA,IACA,YAAY;AAAA,IACZ,GAAID,EAAS,WAAW,QAAQ,IAAI,EAAE,QAAQ,GAAA,IAAO,EAAE,KAAK,GAAA;AAAA,IAC5D,GAAIA,EAAS,SAAS,OAAO,IAAI,EAAE,OAAO,GAAA,IAAO,EAAE,MAAM,GAAA;AAAA,EAAG;AAGpE,SAAO,gBAAAS,EAAC,OAAA,EAAI,KAAAP,GAAU,OAAAM,EAAA,CAAc;AACtC;"}

package.json

 {
   "name": "@goil/badge",
-  "version": "1.0.2",
+  "version": "1.1.0",
   "description": "Lightweight 'Made with Goil' badge for static sites, React and Next.js",
@@ -5,0 +5,0 @@ "type": "module",

README.md

@@ -19,6 +19,8 @@ # @goil/badge
 export default function Layout() {
-  return <GoilBadge variant="auto" lang="auto" />
+  return <GoilBadge />
 }
 ```
 
+Defaults to fixed bottom-right (z-index 9999). Marked `'use client'`, so it works directly inside a Next.js server layout.
+
 **HTML / static site:**
@@ -33,5 +35,8 @@
 ```ts
-interface GoilBadgeOptions {
+interface GoilBadgeProps {
   variant?: 'dark' | 'light' | 'auto' // default: 'auto' — follows prefers-color-scheme
   lang?: 'en' | 'es' | 'ca' | 'auto'   // default: 'auto' — reads navigator.language
+  position?:                            // default: 'bottom-right' (fixed). Use 'inline' to render in flow.
+    | 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left' | 'inline'
+  zIndex?: number                       // default: 9999
 }
@@ -38,0 +43,0 @@ ```

New alerts

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Fixed alerts

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Improved metrics

Total package byte prevSize

39854

8.47%

Lines of code

235

9.3%

Number of lines in readme file

48

11.63%

No dependency changes