@bailaya/react 1.0.15 → 1.0.16

package/dist/components/StudioTypesGrid.d.ts

@@ -0,0 +1,52 @@
+import React from "react";
+import type { StudioType, StudioProfile } from "@bailaya/core";
+export interface StudioTypesGridProps {
+    /** Optional studio ID to override the default configured ID */
+    overrideId?: string;
+    /** Locale code (e.g., "en", "es") for localized descriptions (if shown) */
+    locale?: string;
+    /** Root grid wrapper */
+    className?: string;
+    /** Each card wrapper */
+    itemClassName?: string;
+    /** Wrapper around the image */
+    imageWrapperClassName?: string;
+    /** The `<img>` element itself */
+    imageClassName?: string;
+    /** Container for title (+ optional description) + CTA */
+    bodyClassName?: string;
+    /** Dance name heading */
+    titleClassName?: string;
+    /** Optional description paragraph (if you enable it) */
+    descriptionClassName?: string;
+    /** CTA button/link class */
+    buttonClassName?: string;
+    /** Text for the CTA (i18n-friendly). Default: "See Classes" */
+    seeClassesText?: string;
+    /** Prefix for the href. Default: "/classes/" */
+    hrefPrefix?: string;
+    /** Hide the CTA entirely. Default: false */
+    hideButton?: boolean;
+    /**
+     * Optional link renderer to use custom component.
+     * If not provided, a plain <a> will be rendered.
+     */
+    renderLink?: (opts: {
+        href: string;
+        className?: string;
+        children: React.ReactNode;
+    }) => React.ReactNode;
+    /** Optional custom render for each studio type; bypasses the default card layout entirely. */
+    renderItem?: (type: StudioType, profile: StudioProfile) => React.ReactNode;
+    /** Show localized description text under the title. Default: false */
+    showDescription?: boolean;
+    /** Optional filter/sort hook before render */
+    transformTypes?: (types: StudioType[]) => StudioType[];
+    /** Optional custom href builder; defaults to hrefPrefix + slug(name) */
+    hrefBuilder?: (type: StudioType) => string;
+}
+/**
+ * Grid of studio dance types (Salsa, Bachata, etc.) with optional CTA button.
+ */
+export declare const StudioTypesGrid: React.FC<StudioTypesGridProps>;
+//# sourceMappingURL=StudioTypesGrid.d.ts.map

package/dist/components/StudioTypesGrid.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StudioTypesGrid.d.ts","sourceRoot":"","sources":["../../src/components/StudioTypesGrid.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAyB/D,MAAM,WAAW,oBAAoB;IACjC,+DAA+D;IAC/D,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,2EAA2E;IAC3E,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,wBAAwB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,wBAAwB;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB,+BAA+B;IAC/B,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAE/B,iCAAiC;IACjC,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,yDAAyD;IACzD,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB,yBAAyB;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,wDAAwD;IACxD,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAE9B,4BAA4B;IAC5B,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,+DAA+D;IAC/D,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,gDAAgD;IAChD,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,4CAA4C;IAC5C,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;OAGG;IACH,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,SAAS,CAAC,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;KAAE,KAAK,KAAK,CAAC,SAAS,CAAC;IAExG,8FAA8F;IAC9F,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,OAAO,EAAE,aAAa,KAAK,KAAK,CAAC,SAAS,CAAC;IAE3E,sEAAsE;IACtE,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B,8CAA8C;IAC9C,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,EAAE,KAAK,UAAU,EAAE,CAAC;IAEvD,wEAAwE;IACxE,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,UAAU,KAAK,MAAM,CAAC;CAC9C;AAED;;GAEG;AACH,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CA+E1D,CAAC"}

package/dist/components/StudioTypesGrid.js

@@ -0,0 +1,72 @@
+"use strict";
+"use client";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StudioTypesGrid = void 0;
+const react_1 = __importDefault(require("react"));
+const lucide_react_1 = require("lucide-react");
+const useStudioProfile_1 = require("../hooks/useStudioProfile");
+const LoadingIcon_1 = require("./ui/LoadingIcon");
+/** Picks localized text with fallback to first available. */
+function pickLocalizedText(map, locale) {
+    const obj = map !== null && map !== void 0 ? map : {};
+    if (locale && obj[locale])
+        return obj[locale];
+    const keys = Object.keys(obj);
+    return keys.length ? obj[keys[0]] : "";
+}
+/** Slugify dance names: lower, spaces→hyphens, strip accents & non-alphanum. */
+function slugifyName(name) {
+    return name
+        .normalize("NFD")
+        .replace(/[\u0300-\u036f]/g, "") // strip accents
+        .toLowerCase()
+        .replace(/[^a-z0-9\s-]/g, "") // remove special chars
+        .trim()
+        .replace(/\s+/g, "-");
+}
+/**
+ * Grid of studio dance types (Salsa, Bachata, etc.) with optional CTA button.
+ */
+const StudioTypesGrid = ({ overrideId, locale, className = "my-3 md:my-6 grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8", itemClassName = "flex flex-col rounded-lg border border-[#DCDCDC] shadow-lg overflow-hidden", imageWrapperClassName = "w-full aspect-square p-2", imageClassName = "w-full h-full object-cover", bodyClassName = "p-3 flex flex-col flex-1", titleClassName = "text-3xl md:text-5xl font-geologica font-semibold text-[#2A2343] pb-4 text-start", descriptionClassName = "text-sm md:text-base text-[#464646] pb-3", buttonClassName = "mt-auto inline-flex items-center gap-2 px-6 py-3 rounded-md font-medium border border-transparent shadow-sm bg-[#2A2343] text-white hover:opacity-90 transition", seeClassesText = "See Classes", hrefPrefix = "/classes/", hideButton = false, renderLink, renderItem, showDescription = false, transformTypes, hrefBuilder, }) => {
+    var _a;
+    const { data: profile, loading, error } = (0, useStudioProfile_1.useStudioProfile)(overrideId);
+    if (loading)
+        return react_1.default.createElement("div", { className: className },
+            react_1.default.createElement(LoadingIcon_1.LoadingIcon, null));
+    if (error)
+        return react_1.default.createElement("div", { className: className }, error.message);
+    if (!profile || !((_a = profile.studioTypes) === null || _a === void 0 ? void 0 : _a.length))
+        return react_1.default.createElement("div", { className: className });
+    const types = transformTypes ? transformTypes(profile.studioTypes) : profile.studioTypes;
+    return (react_1.default.createElement("div", { className: className }, types.map((type) => {
+        if (renderItem) {
+            return react_1.default.createElement(react_1.default.Fragment, { key: type.name }, renderItem(type, profile));
+        }
+        const href = hrefBuilder
+            ? hrefBuilder(type)
+            : `${hrefPrefix}${slugifyName(type.name)}`;
+        return (react_1.default.createElement("div", { key: type.name, className: itemClassName },
+            type.image && (react_1.default.createElement("div", { className: imageWrapperClassName },
+                react_1.default.createElement("img", { src: type.image, alt: type.name, className: imageClassName }))),
+            react_1.default.createElement("div", { className: bodyClassName },
+                react_1.default.createElement("h3", { className: titleClassName }, type.name),
+                showDescription && type.description && (react_1.default.createElement("p", { className: descriptionClassName }, pickLocalizedText(type.description, locale))),
+                !hideButton && (renderLink
+                    ? renderLink({
+                        href,
+                        className: buttonClassName,
+                        children: (react_1.default.createElement(react_1.default.Fragment, null,
+                            seeClassesText,
+                            " ",
+                            react_1.default.createElement(lucide_react_1.ArrowRight, null))),
+                    })
+                    : (react_1.default.createElement("a", { href: href, className: buttonClassName },
+                        seeClassesText,
+                        " ",
+                        react_1.default.createElement(lucide_react_1.ArrowRight, null)))))));
+    })));
+};
+exports.StudioTypesGrid = StudioTypesGrid;

package/dist/index.d.ts

@@ -21,6 +21,7 @@ export { ClassSchedule, ClassScheduleProps } from './components/ClassSchedule';
 export { ClassScheduleByType, ClassScheduleByTypeProps } from './components/ClassScheduleByType';
 export { InstructorList, InstructorListProps } from './components/InstructorList';
 export { StudioProfileCard, StudioProfileCardProps } from './components/StudioProfileCard';
+export { StudioTypesGrid, StudioTypesGridProps } from './components/StudioTypesGrid';
 export { UserProfileCard, UserProfileCardProps } from './components/UserProfileCard';
 export { StudioDescription } from './components/StudioDescription';
 /**

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH;;GAEG;AACH,OAAO,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAE9E;;GAEG;AACH,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAC5D,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACxD,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAChD,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAE5D;;GAEG;AACH,OAAO,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAC/E,OAAO,EAAE,mBAAmB,EAAE,wBAAwB,EAAE,MAAM,kCAAkC,CAAC;AACjG,OAAO,EAAE,cAAc,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;AAClF,OAAO,EAAE,iBAAiB,EAAE,sBAAsB,EAAE,MAAM,gCAAgC,CAAC;AAC3F,OAAO,EAAE,eAAe,EAAE,oBAAoB,EAAE,MAAM,8BAA8B,CAAC;AACrF,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AAEnE;;GAEG;AACH,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH;;GAEG;AACH,OAAO,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAE9E;;GAEG;AACH,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAC5D,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACxD,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAChD,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAE5D;;GAEG;AACH,OAAO,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAC/E,OAAO,EAAE,mBAAmB,EAAE,wBAAwB,EAAE,MAAM,kCAAkC,CAAC;AACjG,OAAO,EAAE,cAAc,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;AAClF,OAAO,EAAE,iBAAiB,EAAE,sBAAsB,EAAE,MAAM,gCAAgC,CAAC;AAC3F,OAAO,EAAE,eAAe,EAAE,oBAAoB,EAAE,MAAM,8BAA8B,CAAC;AACrF,OAAO,EAAE,eAAe,EAAE,oBAAoB,EAAE,MAAM,8BAA8B,CAAC;AACrF,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AAEnE;;GAEG;AACH,cAAc,SAAS,CAAC"}

package/dist/index.js

@@ -19,7 +19,7 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.StudioDescription = exports.UserProfileCard = exports.StudioProfileCard = exports.InstructorList = exports.ClassScheduleByType = exports.ClassSchedule = exports.useClassesByType = exports.useClasses = exports.useInstructors = exports.useStudioProfile = exports.useBailayaClient = exports.BailayaProvider = void 0;
+exports.StudioDescription = exports.UserProfileCard = exports.StudioTypesGrid = exports.StudioProfileCard = exports.InstructorList = exports.ClassScheduleByType = exports.ClassSchedule = exports.useClassesByType = exports.useClasses = exports.useInstructors = exports.useStudioProfile = exports.useBailayaClient = exports.BailayaProvider = void 0;
 /**
  * Re-exported context and hooks for easy import
  */
@@ -48,6 +48,8 @@ var InstructorList_1 = require("./components/InstructorList");
 Object.defineProperty(exports, "InstructorList", { enumerable: true, get: function () { return InstructorList_1.InstructorList; } });
 var StudioProfileCard_1 = require("./components/StudioProfileCard");
 Object.defineProperty(exports, "StudioProfileCard", { enumerable: true, get: function () { return StudioProfileCard_1.StudioProfileCard; } });
+var StudioTypesGrid_1 = require("./components/StudioTypesGrid");
+Object.defineProperty(exports, "StudioTypesGrid", { enumerable: true, get: function () { return StudioTypesGrid_1.StudioTypesGrid; } });
 var UserProfileCard_1 = require("./components/UserProfileCard");
 Object.defineProperty(exports, "UserProfileCard", { enumerable: true, get: function () { return UserProfileCard_1.UserProfileCard; } });
 var StudioDescription_1 = require("./components/StudioDescription");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bailaya/react",
-  "version": "1.0.15",
+  "version": "1.0.16",
   "description": "A React component library for the BailaYa public API",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",