@versini/ui-header 5.0.4 → 5.1.1
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/dist/index.d.ts +52 -53
- package/dist/index.js +59 -12
- package/package.json +9 -9
- package/dist/components/Header/Header.js +0 -41
package/dist/index.d.ts
CHANGED
|
@@ -1,53 +1,52 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
declare const
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
export { HEADER_CLASSNAME, Header };
|
|
1
|
+
import { JSX } from 'react/jsx-runtime';
|
|
2
|
+
|
|
3
|
+
export declare const Header: ({ children, className, raw, mode, noColors, sticky, noBorder, noMargin, noPadding, ...otherProps }: HeaderProps) => JSX.Element;
|
|
4
|
+
|
|
5
|
+
export declare const HEADER_CLASSNAME = "av-header";
|
|
6
|
+
|
|
7
|
+
declare type HeaderProps = {
|
|
8
|
+
/**
|
|
9
|
+
* The children to render.
|
|
10
|
+
*/
|
|
11
|
+
children: React.ReactNode;
|
|
12
|
+
/**
|
|
13
|
+
* CSS class(es) to add to the main component wrapper.
|
|
14
|
+
*/
|
|
15
|
+
className?: string;
|
|
16
|
+
/**
|
|
17
|
+
* The mode of Header. This will change the background color.
|
|
18
|
+
*/
|
|
19
|
+
mode?: "dark" | "light" | "system" | "alt-system";
|
|
20
|
+
/**
|
|
21
|
+
* Whether or not to render the Header component with colors.
|
|
22
|
+
* @default false
|
|
23
|
+
*/
|
|
24
|
+
noColors?: boolean;
|
|
25
|
+
/**
|
|
26
|
+
* Whether or not to render the Header component with no styles.
|
|
27
|
+
* @default false
|
|
28
|
+
*/
|
|
29
|
+
raw?: boolean;
|
|
30
|
+
/**
|
|
31
|
+
* Whether or not to render the Header component with sticky behavior.
|
|
32
|
+
* @default false
|
|
33
|
+
*/
|
|
34
|
+
sticky?: boolean;
|
|
35
|
+
/**
|
|
36
|
+
* Whether or not to render the Header component with no border.
|
|
37
|
+
* @default false
|
|
38
|
+
*/
|
|
39
|
+
noBorder?: boolean;
|
|
40
|
+
/**
|
|
41
|
+
* Whether or not to render the Header component with no margin.
|
|
42
|
+
* @default false
|
|
43
|
+
*/
|
|
44
|
+
noMargin?: boolean;
|
|
45
|
+
/**
|
|
46
|
+
* Whether or not to render the Header component with no padding.
|
|
47
|
+
* @default false
|
|
48
|
+
*/
|
|
49
|
+
noPadding?: boolean;
|
|
50
|
+
} & React.HTMLAttributes<HTMLElement> & React.ComponentPropsWithRef<"header">;
|
|
51
|
+
|
|
52
|
+
export { }
|
package/dist/index.js
CHANGED
|
@@ -1,18 +1,65 @@
|
|
|
1
|
-
import { HEADER_CLASSNAME as o, Header as E } from "./components/Header/Header.js";
|
|
2
1
|
/*!
|
|
3
|
-
@versini/ui-header v5.
|
|
2
|
+
@versini/ui-header v5.1.1
|
|
4
3
|
© 2025 gizmette.com
|
|
5
4
|
*/
|
|
6
5
|
try {
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
}
|
|
6
|
+
if (!window.__VERSINI_UI_HEADER__) {
|
|
7
|
+
window.__VERSINI_UI_HEADER__ = {
|
|
8
|
+
version: "5.1.1",
|
|
9
|
+
buildTime: "11/16/2025 05:49 PM EST",
|
|
10
|
+
homepage: "https://github.com/aversini/ui-components",
|
|
11
|
+
license: "MIT",
|
|
12
|
+
};
|
|
13
|
+
}
|
|
14
|
+
} catch (error) {
|
|
15
|
+
// nothing to declare officer
|
|
14
16
|
}
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
17
|
+
|
|
18
|
+
import { jsx } from "react/jsx-runtime";
|
|
19
|
+
import clsx from "clsx";
|
|
20
|
+
|
|
21
|
+
;// CONCATENATED MODULE: ./src/common/constants.ts
|
|
22
|
+
const HEADER_CLASSNAME = "av-header";
|
|
23
|
+
|
|
24
|
+
;// CONCATENATED MODULE: external "react/jsx-runtime"
|
|
25
|
+
|
|
26
|
+
;// CONCATENATED MODULE: external "clsx"
|
|
27
|
+
|
|
28
|
+
;// CONCATENATED MODULE: ./src/components/Header/Header.tsx
|
|
29
|
+
|
|
30
|
+
|
|
31
|
+
|
|
32
|
+
const Header = ({ children, className, raw = false, mode = "system", noColors = false, sticky = false, noBorder = false, noMargin = false, noPadding = false, ...otherProps })=>{
|
|
33
|
+
const headerClass = clsx(HEADER_CLASSNAME, {
|
|
34
|
+
"border-border-accent": mode === "dark" && !raw && !noColors && !noBorder,
|
|
35
|
+
"border-border-medium": mode === "light" && !raw && !noColors && !noBorder,
|
|
36
|
+
"border-border-accent dark:border-border-medium": mode === "alt-system" && !raw && !noColors && !noBorder,
|
|
37
|
+
"border-border-medium dark:border-border-accent": mode === "system" && !raw && !noColors && !noBorder,
|
|
38
|
+
"border-b-4": !raw && !noBorder,
|
|
39
|
+
"border-transparent": !raw && noColors,
|
|
40
|
+
"bg-surface-dark": mode === "dark" && !raw && !noColors,
|
|
41
|
+
"bg-surface-light": mode === "light" && !raw && !noColors,
|
|
42
|
+
"bg-surface-dark dark:bg-surface-light": mode === "alt-system" && !raw && !noColors,
|
|
43
|
+
"bg-surface-light dark:bg-surface-dark": mode === "system" && !raw && !noColors,
|
|
44
|
+
"sticky top-0 z-50": sticky
|
|
45
|
+
}, className);
|
|
46
|
+
const headerInnerClass = clsx({
|
|
47
|
+
"mt-0": !noMargin,
|
|
48
|
+
"p-2": !noPadding,
|
|
49
|
+
"flex flex-col w-full md:mx-auto md:max-w-4xl": !raw
|
|
50
|
+
});
|
|
51
|
+
return /*#__PURE__*/ jsx("header", {
|
|
52
|
+
className: headerClass,
|
|
53
|
+
...otherProps,
|
|
54
|
+
children: /*#__PURE__*/ jsx("div", {
|
|
55
|
+
className: headerInnerClass,
|
|
56
|
+
children: children
|
|
57
|
+
})
|
|
58
|
+
});
|
|
18
59
|
};
|
|
60
|
+
|
|
61
|
+
;// CONCATENATED MODULE: ./src/components/index.ts
|
|
62
|
+
|
|
63
|
+
|
|
64
|
+
|
|
65
|
+
export { HEADER_CLASSNAME, Header };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@versini/ui-header",
|
|
3
|
-
"version": "5.
|
|
3
|
+
"version": "5.1.1",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"author": "Arno Versini",
|
|
6
6
|
"publishConfig": {
|
|
@@ -20,13 +20,13 @@
|
|
|
20
20
|
],
|
|
21
21
|
"scripts": {
|
|
22
22
|
"build:check": "tsc",
|
|
23
|
-
"build:js": "
|
|
24
|
-
"build:types": "
|
|
25
|
-
"build": "npm-run-all --serial clean build:check build:js
|
|
23
|
+
"build:js": "rslib build",
|
|
24
|
+
"build:types": "echo 'Types now built with rslib'",
|
|
25
|
+
"build": "npm-run-all --serial clean build:check build:js",
|
|
26
26
|
"clean": "rimraf dist tmp",
|
|
27
|
-
"dev:js": "
|
|
28
|
-
"dev:types": "
|
|
29
|
-
"dev": "
|
|
27
|
+
"dev:js": "rslib build --watch",
|
|
28
|
+
"dev:types": "echo 'Types now watched with rslib'",
|
|
29
|
+
"dev": "rslib build --watch",
|
|
30
30
|
"lint": "biome lint src",
|
|
31
31
|
"lint:fix": "biome check src --write --no-errors-on-unmatched",
|
|
32
32
|
"prettier": "biome check --write --no-errors-on-unmatched",
|
|
@@ -42,10 +42,10 @@
|
|
|
42
42
|
"dependencies": {
|
|
43
43
|
"@tailwindcss/typography": "0.5.19",
|
|
44
44
|
"clsx": "2.1.1",
|
|
45
|
-
"tailwindcss": "4.1.
|
|
45
|
+
"tailwindcss": "4.1.17"
|
|
46
46
|
},
|
|
47
47
|
"sideEffects": [
|
|
48
48
|
"**/*.css"
|
|
49
49
|
],
|
|
50
|
-
"gitHead": "
|
|
50
|
+
"gitHead": "1d0bedfa3a84ea7f2f41d347a59de518f92e4cea"
|
|
51
51
|
}
|
|
@@ -1,41 +0,0 @@
|
|
|
1
|
-
import { jsx as t } from "react/jsx-runtime";
|
|
2
|
-
import d from "clsx";
|
|
3
|
-
const h = "av-header", p = ({
|
|
4
|
-
children: c,
|
|
5
|
-
className: b,
|
|
6
|
-
raw: e = !1,
|
|
7
|
-
mode: a = "system",
|
|
8
|
-
noColors: r = !1,
|
|
9
|
-
sticky: f = !1,
|
|
10
|
-
noBorder: s = !1,
|
|
11
|
-
noMargin: l = !1,
|
|
12
|
-
noPadding: m = !1,
|
|
13
|
-
...i
|
|
14
|
-
}) => {
|
|
15
|
-
const u = d(
|
|
16
|
-
h,
|
|
17
|
-
{
|
|
18
|
-
"border-border-accent": a === "dark" && !e && !r && !s,
|
|
19
|
-
"border-border-medium": a === "light" && !e && !r && !s,
|
|
20
|
-
"border-border-accent dark:border-border-medium": a === "alt-system" && !e && !r && !s,
|
|
21
|
-
"border-border-medium dark:border-border-accent": a === "system" && !e && !r && !s,
|
|
22
|
-
"border-b-4": !e && !s,
|
|
23
|
-
"border-transparent": !e && r,
|
|
24
|
-
"bg-surface-dark": a === "dark" && !e && !r,
|
|
25
|
-
"bg-surface-light": a === "light" && !e && !r,
|
|
26
|
-
"bg-surface-dark dark:bg-surface-light": a === "alt-system" && !e && !r,
|
|
27
|
-
"bg-surface-light dark:bg-surface-dark": a === "system" && !e && !r,
|
|
28
|
-
"sticky top-0 z-50": f
|
|
29
|
-
},
|
|
30
|
-
b
|
|
31
|
-
), g = d({
|
|
32
|
-
"mt-0": !l,
|
|
33
|
-
"p-2": !m,
|
|
34
|
-
"flex flex-col w-full md:mx-auto md:max-w-4xl": !e
|
|
35
|
-
});
|
|
36
|
-
return /* @__PURE__ */ t("header", { className: u, ...i, children: /* @__PURE__ */ t("div", { className: g, children: c }) });
|
|
37
|
-
};
|
|
38
|
-
export {
|
|
39
|
-
h as HEADER_CLASSNAME,
|
|
40
|
-
p as Header
|
|
41
|
-
};
|