@sikka/hawa 0.10.27-next → 0.11.0-next

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.
Files changed (6) hide show
  1. package/dist/index.css +8 -0
  2. package/dist/index.d.mts +1 -0
  3. package/dist/index.d.ts +1 -0
  4. package/dist/index.js +13 -6
  5. package/dist/index.mjs +26 -12
  6. package/package.json +12 -11
package/dist/index.css CHANGED
@@ -2665,6 +2665,10 @@ input[type="number"]::-webkit-inner-spin-button,
2665
2665
  .hawa-repeat-infinite {
2666
2666
  animation-iteration-count: infinite;
2667
2667
  }
2668
+ .shadow-color-primary {
2669
+ --tw-shadow: 0.25rem 0.25rem hsl(var(--primary));
2670
+ box-shadow: var(--tw-shadow);
2671
+ }
2668
2672
  body {
2669
2673
  font-family: "IBM Plex Sans Arabic", sans-serif;
2670
2674
  }
@@ -2949,6 +2953,10 @@ body {
2949
2953
  --tw-translate-y: 0.125rem;
2950
2954
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
2951
2955
  }
2956
+ .active\:shadow-color-primary-active:active {
2957
+ --tw-shadow: 0.125rem 0.125rem hsl(var(--primary));
2958
+ box-shadow: var(--tw-shadow);
2959
+ }
2952
2960
  .disabled\:hawa-pointer-events-none:disabled {
2953
2961
  pointer-events: none;
2954
2962
  }
package/dist/index.d.mts CHANGED
@@ -171,6 +171,7 @@ declare const DialogFooter: {
171
171
 
172
172
  interface CardProps extends React$1.HTMLAttributes<HTMLDivElement> {
173
173
  clickable?: boolean;
174
+ variant?: "default" | "neoBrutalism";
174
175
  }
175
176
  declare const Card: React$1.ForwardRefExoticComponent<CardProps & React$1.RefAttributes<HTMLDivElement>>;
176
177
  declare const CardHeader: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLDivElement> & React$1.RefAttributes<HTMLDivElement>>;
package/dist/index.d.ts CHANGED
@@ -171,6 +171,7 @@ declare const DialogFooter: {
171
171
 
172
172
  interface CardProps extends React$1.HTMLAttributes<HTMLDivElement> {
173
173
  clickable?: boolean;
174
+ variant?: "default" | "neoBrutalism";
174
175
  }
175
176
  declare const Card: React$1.ForwardRefExoticComponent<CardProps & React$1.RefAttributes<HTMLDivElement>>;
176
177
  declare const CardHeader: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLDivElement> & React$1.RefAttributes<HTMLDivElement>>;
package/dist/index.js CHANGED
@@ -956,7 +956,7 @@ var buttonVariants = (0, import_class_variance_authority.cva)("hawa-inline-flex
956
956
  ghost: "hover:hawa-bg-accent hover:hawa-text-accent-foreground",
957
957
  link: "hawa-text-primary hawa-underline-offset-4 hover:hawa-underline",
958
958
  combobox: "hawa-bg-background hawa-border",
959
- neoBrutalism: "hawa-cursor-pointer hawa-transition-all hawa-uppercase hawa-font-mono dark:hawa-bg-black hawa-font-bold hawa-py-2 hawa-px-4 hawa-rounded hawa-border-2 hawa-border-primary hawa-shadow-color-primary hawa-transition-[hawa-transform_50ms, hawa-box-shadow_50ms] active:hawa-translate-x-0.5 active:hawa-translate-y-0.5 active:hawa-shadow-color-primary-active"
959
+ neoBrutalism: "hawa-cursor-pointer hawa-transition-all hawa-uppercase hawa-font-mono dark:hawa-bg-black hawa-font-bold hawa-py-2 hawa-px-4 hawa-rounded hawa-border-2 hawa-border-primary hawa-shadow-color-primary hawa-transition-[hawa-transform_50ms, hawa-box-shadow_50ms] active:hawa-translate-x-0.5 active:hawa-translate-y-0.5 active:hawa-shadow-color-primary-active shadow-color-primary active:shadow-color-primary-active "
960
960
  },
961
961
  size: {
962
962
  default: "hawa-h-10 hawa-px-4 hawa-py-2",
@@ -1002,14 +1002,19 @@ var Button = React4.forwardRef(function(_param, ref) {
1002
1002
  Button.displayName = "Button";
1003
1003
  // components/elements/Card.tsx
1004
1004
  var React5 = __toESM(require("react"));
1005
- var Card = React5.forwardRef(function(_param, ref) /* @__PURE__ */ {
1006
- var className = _param.className, _param_clickable = _param.clickable, clickable = _param_clickable === void 0 ? false : _param_clickable, props = _object_without_properties(_param, [
1005
+ var Card = React5.forwardRef(function(_param, ref) {
1006
+ var className = _param.className, _param_variant = _param.variant, variant = _param_variant === void 0 ? "default" : _param_variant, _param_clickable = _param.clickable, clickable = _param_clickable === void 0 ? false : _param_clickable, props = _object_without_properties(_param, [
1007
1007
  "className",
1008
+ "variant",
1008
1009
  "clickable"
1009
1010
  ]);
1010
- return React5.createElement("div", _object_spread({
1011
+ var variantStyles = {
1012
+ default: cn("hawa-rounded-lg hawa-border hawa-bg-card hawa-text-card-foreground hawa-shadow-sm", clickable && "hawa-cursor-pointer hawa-transition-all hover:hawa-drop-shadow-md dark:hover:dark-shadow"),
1013
+ neoBrutalism: cn("hawa-transition-all hawa-uppercase hawa-font-mono dark:hawa-bg-black hawa-font-bold hawa-py-2 hawa-px-4 hawa-rounded hawa-border-2 hawa-border-primary hawa-shadow-color-primary hawa-transition-[hawa-transform_50ms, hawa-box-shadow_50ms] transition-all uppercase font-mono dark:bg-black font-bold py-2 px-4 rounded border-2 border-primary shadow-color-primary transition-[transform_50ms, box-shadow_50ms]", clickable && "hawa-cursor-pointer active:hawa-translate-x-0.5 active:hawa-translate-y-0.5 active:hawa-shadow-color-primary-active active:translate-x-0.5 active:translate-y-0.5 active:shadow-color-primary-active")
1014
+ };
1015
+ return /* @__PURE__ */ React5.createElement("div", _object_spread({
1011
1016
  ref: ref,
1012
- className: cn("hawa-rounded-lg hawa-border hawa-bg-card hawa-text-card-foreground hawa-shadow-sm", clickable && "hawa-cursor-pointer hawa-transition-all hover:hawa-drop-shadow-md dark:hover:dark-shadow", className)
1017
+ className: cn(className, variantStyles[variant])
1013
1018
  }, props));
1014
1019
  });
1015
1020
  Card.displayName = "Card";
@@ -2435,7 +2440,9 @@ var Alert = function(_param) {
2435
2440
  className: "hawa-flex hawa-flex-col"
2436
2441
  }, /* @__PURE__ */ import_react16.default.createElement("span", {
2437
2442
  className: (0, import_clsx7.default)("font-medium", direction === "rtl" ? "hawa-ml-8" : "hawa-mr-8")
2438
- }, props.title), /* @__PURE__ */ import_react16.default.createElement("span", null, props.text), props.actions && /* @__PURE__ */ import_react16.default.createElement("div", {
2443
+ }, props.title), /* @__PURE__ */ import_react16.default.createElement("span", {
2444
+ className: (0, import_clsx7.default)(direction === "rtl" ? "hawa-ml-8" : "hawa-mr-8")
2445
+ }, props.text), props.actions && /* @__PURE__ */ import_react16.default.createElement("div", {
2439
2446
  className: "hawa-mt-2 hawa-flex hawa-flex-row hawa-gap-2"
2440
2447
  }, props.actions.map(function(act, index) {
2441
2448
  return /* @__PURE__ */ import_react16.default.createElement(Button, {
package/dist/index.mjs CHANGED
@@ -217,7 +217,7 @@ var buttonVariants = cva(
217
217
  ghost: "hover:hawa-bg-accent hover:hawa-text-accent-foreground",
218
218
  link: "hawa-text-primary hawa-underline-offset-4 hover:hawa-underline",
219
219
  combobox: "hawa-bg-background hawa-border",
220
- neoBrutalism: "hawa-cursor-pointer hawa-transition-all hawa-uppercase hawa-font-mono dark:hawa-bg-black hawa-font-bold hawa-py-2 hawa-px-4 hawa-rounded hawa-border-2 hawa-border-primary hawa-shadow-color-primary hawa-transition-[hawa-transform_50ms, hawa-box-shadow_50ms] active:hawa-translate-x-0.5 active:hawa-translate-y-0.5 active:hawa-shadow-color-primary-active"
220
+ neoBrutalism: "hawa-cursor-pointer hawa-transition-all hawa-uppercase hawa-font-mono dark:hawa-bg-black hawa-font-bold hawa-py-2 hawa-px-4 hawa-rounded hawa-border-2 hawa-border-primary hawa-shadow-color-primary hawa-transition-[hawa-transform_50ms, hawa-box-shadow_50ms] active:hawa-translate-x-0.5 active:hawa-translate-y-0.5 active:hawa-shadow-color-primary-active shadow-color-primary active:shadow-color-primary-active "
221
221
  },
222
222
  size: {
223
223
  default: "hawa-h-10 hawa-px-4 hawa-py-2",
@@ -275,18 +275,26 @@ Button.displayName = "Button";
275
275
  // components/elements/Card.tsx
276
276
  import * as React5 from "react";
277
277
  var Card = React5.forwardRef(
278
- ({ className, clickable = false, ...props }, ref) => /* @__PURE__ */ React5.createElement(
279
- "div",
280
- {
281
- ref,
282
- className: cn(
278
+ ({ className, variant = "default", clickable = false, ...props }, ref) => {
279
+ let variantStyles = {
280
+ default: cn(
283
281
  "hawa-rounded-lg hawa-border hawa-bg-card hawa-text-card-foreground hawa-shadow-sm",
284
- clickable && "hawa-cursor-pointer hawa-transition-all hover:hawa-drop-shadow-md dark:hover:dark-shadow",
285
- className
282
+ clickable && "hawa-cursor-pointer hawa-transition-all hover:hawa-drop-shadow-md dark:hover:dark-shadow"
286
283
  ),
287
- ...props
288
- }
289
- )
284
+ neoBrutalism: cn(
285
+ "hawa-transition-all hawa-uppercase hawa-font-mono dark:hawa-bg-black hawa-font-bold hawa-py-2 hawa-px-4 hawa-rounded hawa-border-2 hawa-border-primary hawa-shadow-color-primary hawa-transition-[hawa-transform_50ms, hawa-box-shadow_50ms] transition-all uppercase font-mono dark:bg-black font-bold py-2 px-4 rounded border-2 border-primary shadow-color-primary transition-[transform_50ms, box-shadow_50ms]",
286
+ clickable && "hawa-cursor-pointer active:hawa-translate-x-0.5 active:hawa-translate-y-0.5 active:hawa-shadow-color-primary-active active:translate-x-0.5 active:translate-y-0.5 active:shadow-color-primary-active"
287
+ )
288
+ };
289
+ return /* @__PURE__ */ React5.createElement(
290
+ "div",
291
+ {
292
+ ref,
293
+ className: cn(className, variantStyles[variant]),
294
+ ...props
295
+ }
296
+ );
297
+ }
290
298
  );
291
299
  Card.displayName = "Card";
292
300
  var CardHeader = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React5.createElement(
@@ -1960,7 +1968,13 @@ var Alert = ({
1960
1968
  )
1961
1969
  },
1962
1970
  props.title
1963
- ), /* @__PURE__ */ React24.createElement("span", null, props.text), props.actions && /* @__PURE__ */ React24.createElement("div", { className: "hawa-mt-2 hawa-flex hawa-flex-row hawa-gap-2" }, props.actions.map((act, index) => /* @__PURE__ */ React24.createElement(
1971
+ ), /* @__PURE__ */ React24.createElement(
1972
+ "span",
1973
+ {
1974
+ className: clsx7(direction === "rtl" ? "hawa-ml-8" : "hawa-mr-8")
1975
+ },
1976
+ props.text
1977
+ ), props.actions && /* @__PURE__ */ React24.createElement("div", { className: "hawa-mt-2 hawa-flex hawa-flex-row hawa-gap-2" }, props.actions.map((act, index) => /* @__PURE__ */ React24.createElement(
1964
1978
  Button,
1965
1979
  {
1966
1980
  key: index,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sikka/hawa",
3
- "version": "0.10.27-next",
3
+ "version": "0.11.0-next",
4
4
  "main": "./dist/index.js",
5
5
  "types": "./dist/index.d.ts",
6
6
  "exports": {
@@ -64,22 +64,23 @@
64
64
  "zod": "^3.22.3"
65
65
  },
66
66
  "devDependencies": {
67
- "@storybook/addon-essentials": "^7.4.5",
68
- "@storybook/addon-interactions": "^7.4.5",
69
- "@storybook/addon-links": "^7.4.5",
67
+ "@storybook/addon-essentials": "^7.5.1",
68
+ "@storybook/addon-interactions": "^7.5.1",
69
+ "@storybook/addon-links": "^7.5.1",
70
+ "@storybook/addon-mdx-gfm": "^7.5.1",
70
71
  "@storybook/addon-onboarding": "^1.0.8",
71
- "@storybook/blocks": "^7.4.5",
72
- "@storybook/manager-api": "^7.4.5",
73
- "@storybook/nextjs": "^7.4.5",
74
- "@storybook/react": "^7.4.5",
75
- "@storybook/testing-library": "^0.2.1",
72
+ "@storybook/blocks": "^7.5.1",
73
+ "@storybook/manager-api": "^7.5.1",
74
+ "@storybook/nextjs": "^7.5.1",
75
+ "@storybook/react": "^7.5.1",
76
+ "@storybook/testing-library": "^0.2.2",
76
77
  "autoprefixer": "^10.4.16",
77
- "eslint-plugin-storybook": "^0.6.14",
78
+ "eslint-plugin-storybook": "^0.6.15",
78
79
  "lucide-react": "^0.279.0",
79
80
  "postcss": "^8.4.31",
80
81
  "postcss-cli": "^10.1.0",
81
82
  "postcss-import": "^15.1.0",
82
- "storybook": "^7.4.5",
83
+ "storybook": "^7.5.1",
83
84
  "storybook-dark-mode": "^3.0.1",
84
85
  "tailwindcss": "^3.3.3",
85
86
  "tailwindcss-animate": "^1.0.7",