@anoki/fse-ui 1.0.0-beta1.45.9 → 1.0.0-beta1.46.1

package/dist/index.es24.js

@@ -1,7 +1,7 @@
 import { j as e } from "./index.es241.js";
 import { Root as i, Trigger as c, Portal as m, Content as d, Group as x, Item as u } from "./index.es290.js";
 import { clsx as o } from "./index.es243.js";
-import { createColorClasses as h } from "./index.es273.js";
+import { createColorClasses as h } from "./index.es271.js";
 import './components/ui/Dropdown/Dropdown.css';/* empty css            */
 import { ArrowDown as w } from "./index.es157.js";
 import { Row as p } from "./index.es9.js";

package/dist/index.es245.js

@@ -1,4 +1,4 @@
-import { __require as r } from "./index.es455.js";
+import { __require as r } from "./index.es453.js";
 var a = r();
 export {
   a as l

package/dist/index.es252.js

@@ -1,5 +1,5 @@
-import { getDefaultExportFromCjs as r } from "./index.es456.js";
-import { __require as o } from "./index.es453.js";
+import { getDefaultExportFromCjs as r } from "./index.es454.js";
+import { __require as o } from "./index.es456.js";
 var e = o();
 const a = /* @__PURE__ */ r(e);
 export {

package/dist/index.es259.js

@@ -1,5 +1,5 @@
-import { c as w } from "./index.es477.js";
-import { m as l } from "./index.es478.js";
+import { c as w } from "./index.es465.js";
+import { m as l } from "./index.es464.js";
 function N(x) {
   let {
     swiper: a,

package/dist/index.es260.js

@@ -1,6 +1,6 @@
-import { c as $ } from "./index.es479.js";
-import { c as F } from "./index.es477.js";
-import { m, a as E, f as T, h as S } from "./index.es478.js";
+import { c as $ } from "./index.es466.js";
+import { c as F } from "./index.es465.js";
+import { m, a as E, f as T, h as S } from "./index.es464.js";
 function N(I) {
   let {
     swiper: e,

package/dist/index.es261.js

@@ -1,6 +1,6 @@
-import { g as F } from "./index.es480.js";
-import { c as y } from "./index.es479.js";
-import { c as K, m as n, h as j } from "./index.es478.js";
+import { g as F } from "./index.es463.js";
+import { c as y } from "./index.es466.js";
+import { c as K, m as n, h as j } from "./index.es464.js";
 function Y(P) {
   let {
     swiper: i,

package/dist/index.es271.js

@@ -1,30 +1,5 @@
-const p = [
-  "gap",
-  "m",
-  "mx",
-  "my",
-  "mt",
-  "mr",
-  "mb",
-  "ml",
-  "p",
-  "px",
-  "py",
-  "pt",
-  "pr",
-  "pb",
-  "pl",
-  "br",
-  "br-t",
-  "br-r",
-  "br-b",
-  "br-l",
-  "min-h",
-  "min-w",
-  "max-h",
-  "max-w"
-], a = (m) => p.map((r) => m[r] ? `${r}-${m[r]}` : "").filter(Boolean);
+const t = ["bg", "text", "color", "border"], e = (o) => t.map((r) => o[r] ? r === "color" ? `text-${o[r]}` : `${r}-${o[r]}` : "").filter(Boolean);
 export {
-  a as createSpacingClasses
+  e as createColorClasses
 };
 //# sourceMappingURL=index.es271.js.map

package/dist/index.es271.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es271.js","sources":["../src/theme/spacing.ts"],"sourcesContent":["export type SpacingKey =\n  | \"x4\"\n  | \"x8\"\n  | \"x12\"\n  | \"x16\"\n  | \"x20\"\n  | \"x24\"\n  | \"x28\"\n  | \"x32\"\n  | \"x36\"\n  | \"x40\"\n  | \"x44\"\n  | \"x48\"\n  | \"x52\"\n  | \"x56\"\n  | \"x60\"\n  | \"x64\"\n  | \"x68\"\n  | \"x72\"\n  | \"x76\"\n  | \"x80\"\n  | \"x84\"\n  | \"x88\"\n  | \"x92\"\n  | \"x96\"\n  | \"x100\"\n  | \"x104\";\n\nexport type SpacingProps = {\n  gap?: SpacingKey;\n  m?: SpacingKey; // margin\n  mx?: SpacingKey; // margin x\n  my?: SpacingKey; // margin y\n  mt?: SpacingKey; // margin top\n  mr?: SpacingKey; // margin bottom\n  mb?: SpacingKey; // margin right\n  ml?: SpacingKey; // margin left\n  p?: SpacingKey; // padding\n  px?: SpacingKey; // padding x\n  py?: SpacingKey; // padding y\n  pt?: SpacingKey; // padding top\n  pr?: SpacingKey; // padding bottom\n  pb?: SpacingKey; // padding right\n  pl?: SpacingKey; // padding left\n  br?: SpacingKey; // border-radius\n  \"br-t\"?: SpacingKey; // border-radius top\n  \"br-r\"?: SpacingKey; // border-radius right\n  \"br-b\"?: SpacingKey; // border-radius bottom\n  \"br-l\"?: SpacingKey; // border-radius left\n  \"min-h\"?: SpacingKey; // min-height\n  \"min-w\"?: SpacingKey; // min-width\n  \"max-h\"?: SpacingKey; // max-height\n  \"max-w\"?: SpacingKey; // max-width\n};\n\nexport type SpacingPropsKeys = keyof SpacingProps;\nconst spacingPropsKeys: SpacingPropsKeys[] = [\n  \"gap\",\n  \"m\",\n  \"mx\",\n  \"my\",\n  \"mt\",\n  \"mr\",\n  \"mb\",\n  \"ml\",\n  \"p\",\n  \"px\",\n  \"py\",\n  \"pt\",\n  \"pr\",\n  \"pb\",\n  \"pl\",\n  \"br\",\n  \"br-t\",\n  \"br-r\",\n  \"br-b\",\n  \"br-l\",\n  \"min-h\",\n  \"min-w\",\n  \"max-h\",\n  \"max-w\",\n];\n\nexport const createSpacingClasses = <TProps extends SpacingProps>(\n  props: TProps,\n) => {\n  return spacingPropsKeys\n    .map((key) => (props[key] ? `${key}-${props[key]}` : \"\"))\n    .filter(Boolean);\n};\n"],"names":["spacingPropsKeys","createSpacingClasses","props","key"],"mappings":"AAwDA,MAAMA,IAAuC;AAAA,EAC3C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAEaC,IAAuB,CAClCC,MAEOF,EACJ,IAAI,CAACG,MAASD,EAAMC,CAAG,IAAI,GAAGA,CAAG,IAAID,EAAMC,CAAG,CAAC,KAAK,EAAG,EACvD,OAAO,OAAO;"}
+{"version":3,"file":"index.es271.js","sources":["../src/theme/colors.ts"],"sourcesContent":["export type ColorKeys =\n  | \"primary\"\n  | \"white\"\n  | \"status-success\"\n  | \"warning\"\n  | \"error\"\n  | \"muted\"\n  | \"emphasis\"\n  | \"slate-20\"\n  | \"slate-14\"\n  | \"slate-28\"\n  | \"border-divider\"\n  | \"transparent\"\n  | \"blue-30\"\n  | \"blue-15\"\n  | \"disabled\"\n  | \"lightblue-a01\"\n  | \"lightblue-a02\"\n  | \"lightblue-a03\"\n  | \"secondary\"\n  | \"blue-48\";\n\nexport type ColorProps = {\n  bg?: ColorKeys;\n  text?: ColorKeys;\n  color?: ColorKeys;\n  border?: ColorKeys;\n};\n\nexport type ColorPropsKeys = keyof ColorProps;\nconst colorPropsKeys: ColorPropsKeys[] = [\"bg\", \"text\", \"color\", \"border\"];\n\nexport const createColorClasses = <TProps extends ColorProps>(\n  props: TProps,\n) => {\n  return colorPropsKeys\n    .map((key) => {\n      if (!props[key]) return \"\";\n\n      if (key === \"color\") return `text-${props[key]}`;\n      return `${key}-${props[key]}`;\n    })\n    .filter(Boolean);\n};\n"],"names":["colorPropsKeys","createColorClasses","props","key"],"mappings":"AA8BA,MAAMA,IAAmC,CAAC,MAAM,QAAQ,SAAS,QAAQ,GAE5DC,IAAqB,CAChCC,MAEOF,EACJ,IAAI,CAACG,MACCD,EAAMC,CAAG,IAEVA,MAAQ,UAAgB,QAAQD,EAAMC,CAAG,CAAC,KACvC,GAAGA,CAAG,IAAID,EAAMC,CAAG,CAAC,KAHH,EAIzB,EACA,OAAO,OAAO;"}

package/dist/index.es272.js

@@ -0,0 +1,30 @@
+const p = [
+  "gap",
+  "m",
+  "mx",
+  "my",
+  "mt",
+  "mr",
+  "mb",
+  "ml",
+  "p",
+  "px",
+  "py",
+  "pt",
+  "pr",
+  "pb",
+  "pl",
+  "br",
+  "br-t",
+  "br-r",
+  "br-b",
+  "br-l",
+  "min-h",
+  "min-w",
+  "max-h",
+  "max-w"
+], a = (m) => p.map((r) => m[r] ? `${r}-${m[r]}` : "").filter(Boolean);
+export {
+  a as createSpacingClasses
+};
+//# sourceMappingURL=index.es272.js.map

package/dist/index.es272.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es272.js","sources":["../src/theme/spacing.ts"],"sourcesContent":["export type SpacingKey =\n  | \"x4\"\n  | \"x8\"\n  | \"x12\"\n  | \"x16\"\n  | \"x20\"\n  | \"x24\"\n  | \"x28\"\n  | \"x32\"\n  | \"x36\"\n  | \"x40\"\n  | \"x44\"\n  | \"x48\"\n  | \"x52\"\n  | \"x56\"\n  | \"x60\"\n  | \"x64\"\n  | \"x68\"\n  | \"x72\"\n  | \"x76\"\n  | \"x80\"\n  | \"x84\"\n  | \"x88\"\n  | \"x92\"\n  | \"x96\"\n  | \"x100\"\n  | \"x104\";\n\nexport type SpacingProps = {\n  gap?: SpacingKey;\n  m?: SpacingKey; // margin\n  mx?: SpacingKey; // margin x\n  my?: SpacingKey; // margin y\n  mt?: SpacingKey; // margin top\n  mr?: SpacingKey; // margin bottom\n  mb?: SpacingKey; // margin right\n  ml?: SpacingKey; // margin left\n  p?: SpacingKey; // padding\n  px?: SpacingKey; // padding x\n  py?: SpacingKey; // padding y\n  pt?: SpacingKey; // padding top\n  pr?: SpacingKey; // padding bottom\n  pb?: SpacingKey; // padding right\n  pl?: SpacingKey; // padding left\n  br?: SpacingKey; // border-radius\n  \"br-t\"?: SpacingKey; // border-radius top\n  \"br-r\"?: SpacingKey; // border-radius right\n  \"br-b\"?: SpacingKey; // border-radius bottom\n  \"br-l\"?: SpacingKey; // border-radius left\n  \"min-h\"?: SpacingKey; // min-height\n  \"min-w\"?: SpacingKey; // min-width\n  \"max-h\"?: SpacingKey; // max-height\n  \"max-w\"?: SpacingKey; // max-width\n};\n\nexport type SpacingPropsKeys = keyof SpacingProps;\nconst spacingPropsKeys: SpacingPropsKeys[] = [\n  \"gap\",\n  \"m\",\n  \"mx\",\n  \"my\",\n  \"mt\",\n  \"mr\",\n  \"mb\",\n  \"ml\",\n  \"p\",\n  \"px\",\n  \"py\",\n  \"pt\",\n  \"pr\",\n  \"pb\",\n  \"pl\",\n  \"br\",\n  \"br-t\",\n  \"br-r\",\n  \"br-b\",\n  \"br-l\",\n  \"min-h\",\n  \"min-w\",\n  \"max-h\",\n  \"max-w\",\n];\n\nexport const createSpacingClasses = <TProps extends SpacingProps>(\n  props: TProps,\n) => {\n  return spacingPropsKeys\n    .map((key) => (props[key] ? `${key}-${props[key]}` : \"\"))\n    .filter(Boolean);\n};\n"],"names":["spacingPropsKeys","createSpacingClasses","props","key"],"mappings":"AAwDA,MAAMA,IAAuC;AAAA,EAC3C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAEaC,IAAuB,CAClCC,MAEOF,EACJ,IAAI,CAACG,MAASD,EAAMC,CAAG,IAAI,GAAGA,CAAG,IAAID,EAAMC,CAAG,CAAC,KAAK,EAAG,EACvD,OAAO,OAAO;"}

package/dist/index.es28.js

@@ -1,5 +1,5 @@
 import { j as t } from "./index.es241.js";
-import { createColorClasses as g } from "./index.es273.js";
+import { createColorClasses as g } from "./index.es271.js";
 import { clsx as E } from "./index.es243.js";
 import './components/ui/Button/Button.css';/* empty css            */
 import { Spinner as p } from "./index.es195.js";

package/dist/index.es281.js

@@ -1,6 +1,6 @@
 import { j as s } from "./index.es241.js";
 import { clsx as a } from "./index.es243.js";
-import { createColorClasses as e } from "./index.es273.js";
+import { createColorClasses as e } from "./index.es271.js";
 import './components/ui/Divider/Divider.css';/* empty css            */
 const p = ({
   direction: o = "horizontal",

package/dist/index.es290.js

@@ -1,11 +1,11 @@
 import * as p from "react";
-import { composeEventHandlers as m } from "./index.es465.js";
-import { composeRefs as E } from "./index.es466.js";
-import { createContextScope as S } from "./index.es467.js";
-import { useControllableState as P } from "./index.es468.js";
-import { Primitive as y } from "./index.es469.js";
-import { createMenuScope as D, Root as O, Anchor as T, Portal as j, Content as G, Group as k, Item as L, Label as K, CheckboxItem as U, RadioGroup as B, RadioItem as F, ItemIndicator as H, Separator as W, Arrow as $, SubTrigger as X, SubContent as q } from "./index.es470.js";
-import { useId as g } from "./index.es471.js";
+import { composeEventHandlers as m } from "./index.es470.js";
+import { composeRefs as E } from "./index.es468.js";
+import { createContextScope as S } from "./index.es469.js";
+import { useControllableState as P } from "./index.es471.js";
+import { Primitive as y } from "./index.es475.js";
+import { createMenuScope as D, Root as O, Anchor as T, Portal as j, Content as G, Group as k, Item as L, Label as K, CheckboxItem as U, RadioGroup as B, RadioItem as F, ItemIndicator as H, Separator as W, Arrow as $, SubTrigger as X, SubContent as q } from "./index.es481.js";
+import { useId as g } from "./index.es482.js";
 import { j as a } from "./index.es241.js";
 var f = "DropdownMenu", [z, bo] = S(
   f,

package/dist/index.es293.js

@@ -1,6 +1,6 @@
 import { j as e } from "./index.es241.js";
 import { clsx as t } from "./index.es243.js";
-import { createColorClasses as a } from "./index.es273.js";
+import { createColorClasses as a } from "./index.es271.js";
 const x = ({
   width: r = 56,
   height: s = 10,

package/dist/index.es295.js

@@ -3,7 +3,7 @@ import { Button as m } from "./index.es28.js";
 import { HeaderTopBanner as g } from "./index.es21.js";
 import { useState as y, useRef as w, useCallback as C, useEffect as u } from "react";
 import { clsx as r } from "./index.es243.js";
-import { useFocusTrap as N } from "./index.es462.js";
+import { useFocusTrap as N } from "./index.es478.js";
 import { Container as k } from "./index.es6.js";
 import './components/navigations/HeaderMobile/HeaderMobile.css';/* empty css            */
 import { Col as L } from "./index.es10.js";

package/dist/index.es303.js

@@ -1,12 +1,12 @@
 import * as c from "react";
-import { useComposedRefs as j } from "./index.es466.js";
-import { createContextScope as F } from "./index.es467.js";
-import { composeEventHandlers as S } from "./index.es465.js";
-import { useControllableState as L } from "./index.es468.js";
+import { useComposedRefs as j } from "./index.es468.js";
+import { createContextScope as F } from "./index.es469.js";
+import { composeEventHandlers as S } from "./index.es470.js";
+import { useControllableState as L } from "./index.es471.js";
 import { usePrevious as O } from "./index.es472.js";
 import { useSize as H } from "./index.es473.js";
 import { Presence as z } from "./index.es474.js";
-import { Primitive as E } from "./index.es469.js";
+import { Primitive as E } from "./index.es475.js";
 import { j as u } from "./index.es241.js";
 var R = "Checkbox", [G, ne] = F(R), [K, P] = G(R);
 function U(t) {

package/dist/index.es314.js

@@ -1,4 +1,4 @@
-import { useCopyToClipboard as c } from "./index.es481.js";
+import { useCopyToClipboard as c } from "./index.es494.js";
 import { useState as n } from "react";
 const l = () => {
   const [e, t] = c(), [p, o] = n(!1);

package/dist/index.es319.js

@@ -1,6 +1,6 @@
 import { j as C } from "./index.es241.js";
 import { clsx as i } from "./index.es243.js";
-import { createColorClasses as l } from "./index.es273.js";
+import { createColorClasses as l } from "./index.es271.js";
 const d = ({
   width: s = 24,
   height: t = 24,

package/dist/index.es32.js

@@ -1,5 +1,5 @@
 import { j as e } from "./index.es241.js";
-import './components/ui/CardMapDoctor/CardMapDoctor.css';/* empty css            */
+import './components/ui/CardMapDoctorV2/CardMapDoctorV2.css';/* empty css            */
 import { useState as d, useRef as b } from "react";
 import { Checkbox as C, CheckboxIndicator as k } from "./index.es303.js";
 import { useClickOutside as N } from "./index.es304.js";

package/dist/index.es321.js

@@ -1,18 +1,18 @@
 import * as s from "react";
-import { composeEventHandlers as p } from "./index.es465.js";
-import { useComposedRefs as R } from "./index.es466.js";
-import { createContextScope as B, createContext as H } from "./index.es467.js";
-import { useId as C } from "./index.es471.js";
-import { useControllableState as V } from "./index.es468.js";
+import { composeEventHandlers as p } from "./index.es470.js";
+import { useComposedRefs as R } from "./index.es468.js";
+import { createContextScope as B, createContext as H } from "./index.es469.js";
+import { useId as C } from "./index.es482.js";
+import { useControllableState as V } from "./index.es471.js";
 import { DismissableLayer as q } from "./index.es485.js";
-import { FocusScope as K } from "./index.es486.js";
-import { Portal as U } from "./index.es487.js";
+import { FocusScope as K } from "./index.es487.js";
+import { Portal as U } from "./index.es489.js";
 import { Presence as _ } from "./index.es474.js";
-import { Primitive as m } from "./index.es469.js";
-import { useFocusGuards as Y } from "./index.es488.js";
-import Z from "./index.es489.js";
-import { hideOthers as z } from "./index.es490.js";
-import { createSlot as J } from "./index.es491.js";
+import { Primitive as m } from "./index.es475.js";
+import { useFocusGuards as Y } from "./index.es486.js";
+import Z from "./index.es493.js";
+import { hideOthers as z } from "./index.es492.js";
+import { createSlot as J } from "./index.es477.js";
 import { j as i } from "./index.es241.js";
 var v = "Dialog", [N, he] = B(v), [Q, u] = N(v), P = (e) => {
   const {

package/dist/index.es33.js

@@ -1,5 +1,5 @@
 import { j as s } from "./index.es241.js";
-import './components/ui/CardMapDoctor/CardMapDoctor.css';/* empty css            */
+import './components/ui/CardMapDoctorV2/CardMapDoctorV2.css';/* empty css            */
 import { useRef as w } from "react";
 import { Checkbox as b, CheckboxIndicator as k } from "./index.es303.js";
 import { useClickOutside as g } from "./index.es304.js";

package/dist/index.es350.js

@@ -1,5 +1,5 @@
 import { j as C } from "./index.es241.js";
-import { createColorClasses as f } from "./index.es273.js";
+import { createColorClasses as f } from "./index.es271.js";
 import { clsx as x } from "./index.es243.js";
 const j = ({
   className: t,

package/dist/index.es351.js

@@ -1,6 +1,6 @@
 import { j as a } from "./index.es241.js";
 import './components/ui/Section/Description/description.css';/* empty css            */
-import { createColorClasses as n } from "./index.es273.js";
+import { createColorClasses as n } from "./index.es271.js";
 import { clsx as m } from "./index.es243.js";
 const u = ({
   fs: t = "6",

package/dist/index.es352.js

@@ -1,11 +1,11 @@
 import * as r from "react";
-import { composeEventHandlers as N } from "./index.es465.js";
-import { useComposedRefs as x } from "./index.es466.js";
-import { createContextScope as T } from "./index.es467.js";
-import { useControllableState as I } from "./index.es468.js";
+import { composeEventHandlers as N } from "./index.es470.js";
+import { useComposedRefs as x } from "./index.es468.js";
+import { createContextScope as T } from "./index.es469.js";
+import { useControllableState as I } from "./index.es471.js";
 import { usePrevious as M } from "./index.es472.js";
 import { useSize as H } from "./index.es473.js";
-import { Primitive as P } from "./index.es469.js";
+import { Primitive as P } from "./index.es475.js";
 import { j as u } from "./index.es241.js";
 var h = "Switch", [A, K] = T(h), [U, q] = A(h), R = r.forwardRef(
   (t, a) => {

package/dist/index.es370.js

@@ -1,10 +1,10 @@
 import * as e from "react";
-import c from "./index.es528.js";
-import { extractProps as i } from "./index.es531.js";
-import { requireReactElement as a } from "./index.es536.js";
-import { popoverContentPropDefs as l } from "./index.es537.js";
-import { Theme as f } from "./index.es538.js";
-import { Root as p, Trigger as d, Portal as C, Content as P, Close as h, Anchor as R } from "./index.es539.js";
+import c from "./index.es539.js";
+import { extractProps as i } from "./index.es542.js";
+import { requireReactElement as a } from "./index.es547.js";
+import { popoverContentPropDefs as l } from "./index.es548.js";
+import { Theme as f } from "./index.es549.js";
+import { Root as p, Trigger as d, Portal as C, Content as P, Close as h, Anchor as R } from "./index.es550.js";
 const v = (r) => e.createElement(p, { ...r });
 v.displayName = "Popover.Root";
 const g = e.forwardRef(({ children: r, ...o }, t) => e.createElement(d, { ...o, ref: t, asChild: !0 }, a(r)));

package/dist/index.es371.js

@@ -1,6 +1,6 @@
 import * as t from "react";
-import r from "./index.es528.js";
-import { BaseButton as m } from "./index.es529.js";
+import r from "./index.es539.js";
+import { BaseButton as m } from "./index.es540.js";
 const s = t.forwardRef(({ className: o, ...a }, e) => t.createElement(m, { ...a, ref: e, className: r("rt-Button", o) }));
 s.displayName = "Button";
 export {

package/dist/index.es393.js

@@ -1,9 +1,9 @@
 import * as l from "react";
-import { createContextScope as T } from "./index.es467.js";
-import { useComposedRefs as A } from "./index.es466.js";
+import { createContextScope as T } from "./index.es469.js";
+import { useComposedRefs as A } from "./index.es468.js";
 import { createDialogScope as v, Root as O, Portal as j, Overlay as b, WarningProvider as w, Content as M, Title as I, Description as L, Close as f, Trigger as $ } from "./index.es321.js";
-import { composeEventHandlers as F } from "./index.es465.js";
-import { createSlottable as G } from "./index.es491.js";
+import { composeEventHandlers as F } from "./index.es470.js";
+import { createSlottable as G } from "./index.es477.js";
 import { j as i } from "./index.es241.js";
 var D = "AlertDialog", [W, te] = T(D, [
   v

package/dist/index.es399.js

@@ -1,4 +1,4 @@
-import { __require as r } from "./index.es578.js";
+import { __require as r } from "./index.es577.js";
 var i = r();
 export {
   i as F

package/dist/index.es41.js

@@ -1,12 +1,12 @@
 import { j as e } from "./index.es241.js";
 import { clsx as i } from "./index.es243.js";
 import './components/ui/VideoPlayer/VideoPlayer.css';/* empty css            */
-import { ArrowDown as f } from "./index.es157.js";
-import { useState as l } from "react";
-import { Col as y } from "./index.es10.js";
-import { PlayVideo as j } from "./index.es218.js";
-var w = /* @__PURE__ */ ((t) => (t.SMALL = "small", t.MEDIUM = "medium", t.LARGE = "large", t.EXTRA_LARGE = "extra-large", t.VERTICAL = "vertical", t.FULL_WIDTH = "full-width", t))(w || {});
-const v = {
+import { ArrowDown as w } from "./index.es157.js";
+import { useState as a, useRef as b } from "react";
+import { Col as N } from "./index.es10.js";
+import { PlayVideo as k } from "./index.es218.js";
+var T = /* @__PURE__ */ ((t) => (t.SMALL = "small", t.MEDIUM = "medium", t.LARGE = "large", t.EXTRA_LARGE = "extra-large", t.VERTICAL = "vertical", t.FULL_WIDTH = "full-width", t))(T || {});
+const C = {
   small: {
     width: "311px"
   },
@@ -25,7 +25,7 @@ const v = {
   vertical: {
     width: "360px"
   }
-}, b = {
+}, M = {
   small: {
     heightImg: "170px"
   },
@@ -44,24 +44,34 @@ const v = {
   "full-width": {
     heightImg: "525px"
   }
-}, G = ({
+}, A = ({
   btnText: t = "Trascrizione",
   sizeComp: o = "large",
-  transcription: c,
-  previewImageSrc: x,
+  transcription: l,
+  previewImageSrc: c,
   videoSrc: d
 }) => {
-  const [s, n] = l(!1), [r, m] = l(!1), { width: h } = v[o], { heightImg: p } = b[o], [a, u] = l(!1), g = () => {
-    r ? n(!s) : (m(!0), n(!0));
+  const [x, p] = a(!1), [s, u] = a(!1), { width: g } = C[o], { heightImg: f } = M[o], [n, y] = a(!1), m = b(null), v = async (r) => {
+    r && (r.preventDefault(), r.stopPropagation());
+    const h = m.current;
+    if (!h) {
+      console.error("no video element found");
+      return;
+    }
+    try {
+      s || (u(!0), p(!0), await h.play());
+    } catch (j) {
+      console.error("Error controlling video:", j);
+    }
   };
   return /* @__PURE__ */ e.jsxs(
-    y,
+    N,
     {
       br: "x4",
-      style: { width: h },
+      style: { width: g },
       className: i(
         "shadow",
-        a && "ui-expanded",
+        n && "ui-expanded",
         "video-section-container"
       ),
       children: [
@@ -69,24 +79,25 @@ const v = {
           "div",
           {
             className: "video-player-container",
-            style: { height: p },
-            onClick: g,
+            style: { height: f },
             children: [
               /* @__PURE__ */ e.jsx(
                 "div",
                 {
                   className: i("start-video-container", {
-                    "fade-out": s || r
+                    "fade-out": x || s
                   }),
                   style: {
-                    backgroundImage: s || r ? "none" : `url(${x})`
+                    backgroundImage: c && !s ? `url("${c}")` : "none",
+                    display: s ? "none" : "block"
                   },
+                  onClick: (r) => v(r),
                   children: /* @__PURE__ */ e.jsxs(
                     "div",
                     {
-                      className: i("play-button-container", { hidden: s }),
+                      className: i("play-button-container", { hidden: x }),
                       children: [
-                        /* @__PURE__ */ e.jsx("div", { className: "play-button-icon", children: /* @__PURE__ */ e.jsx(j, {}) }),
+                        /* @__PURE__ */ e.jsx("div", { className: "play-button-icon", children: /* @__PURE__ */ e.jsx(k, {}) }),
                         /* @__PURE__ */ e.jsx("div", { className: "play-button-text", children: "Riproduci" })
                       ]
                     }
@@ -96,16 +107,15 @@ const v = {
               /* @__PURE__ */ e.jsx("div", { className: "video-container", children: /* @__PURE__ */ e.jsx(
                 "video",
                 {
+                  ref: m,
                   controls: !0,
-                  src: d !== "" ? d : void 0,
-                  autoPlay: s,
-                  onEnded: () => n(!1)
+                  src: d !== "" ? d : void 0
                 }
               ) })
             ]
           }
         ),
-        c && /* @__PURE__ */ e.jsxs("div", { className: "transcription-container", children: [
+        l && /* @__PURE__ */ e.jsxs("div", { className: "transcription-container", children: [
           /* @__PURE__ */ e.jsx(
             "div",
             {
@@ -122,7 +132,7 @@ const v = {
                     "base-row justify-content-between align-items-center"
                   ),
                   type: "button",
-                  onClick: () => u(!a),
+                  onClick: () => y(!n),
                   children: [
                     /* @__PURE__ */ e.jsx(
                       "span",
@@ -134,10 +144,10 @@ const v = {
                       }
                     ),
                     /* @__PURE__ */ e.jsx(
-                      f,
+                      w,
                       {
                         color: "primary",
-                        className: i("ui-arrow", { expanded: a })
+                        className: i("ui-arrow", { expanded: n })
                       }
                     )
                   ]
@@ -145,14 +155,14 @@ const v = {
               )
             }
           ),
-          a && /* @__PURE__ */ e.jsx(
+          n && /* @__PURE__ */ e.jsx(
             "div",
             {
               className: i(
                 "transcription-text-container",
                 "pt-x8 px-x24 pb-x40 fs-6 fw-regular text-grey-black"
               ),
-              children: /* @__PURE__ */ e.jsx("p", { children: c })
+              children: /* @__PURE__ */ e.jsx("p", { children: l })
             }
           )
         ] })
@@ -161,7 +171,7 @@ const v = {
   );
 };
 export {
-  w as VIDEO_PLAYER_SIZE,
-  G as VideoPlayer
+  T as VIDEO_PLAYER_SIZE,
+  A as VideoPlayer
 };
 //# sourceMappingURL=index.es41.js.map

package/dist/index.es41.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es41.js","sources":["../src/components/ui/VideoPlayer/index.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport \"./VideoPlayer.scss\";\nimport { ArrowDown } from \"@/icons/ArrowDown\";\nimport { useState } from \"react\";\nimport { Col } from \"@/components\";\nimport { PlayVideo } from \"@/icons\";\n\nexport enum VIDEO_PLAYER_SIZE {\n  SMALL = \"small\",\n  MEDIUM = \"medium\",\n  LARGE = \"large\",\n  EXTRA_LARGE = \"extra-large\",\n  VERTICAL = \"vertical\",\n  FULL_WIDTH = \"full-width\",\n}\n\nconst sizeStyles = {\n  [VIDEO_PLAYER_SIZE.SMALL]: {\n    width: \"311px\",\n  },\n  [VIDEO_PLAYER_SIZE.MEDIUM]: {\n    width: \"388px\",\n  },\n  [VIDEO_PLAYER_SIZE.LARGE]: {\n    width: \"666px\",\n  },\n  [VIDEO_PLAYER_SIZE.EXTRA_LARGE]: {\n    width: \"992px\",\n  },\n  [VIDEO_PLAYER_SIZE.FULL_WIDTH]: {\n    width: \"100%\",\n  },\n  [VIDEO_PLAYER_SIZE.VERTICAL]: {\n    width: \"360px\",\n  },\n};\n\nconst imgSize = {\n  [VIDEO_PLAYER_SIZE.SMALL]: {\n    heightImg: \"170px\",\n  },\n  [VIDEO_PLAYER_SIZE.MEDIUM]: {\n    heightImg: \"183px\",\n  },\n  [VIDEO_PLAYER_SIZE.LARGE]: {\n    heightImg: \"371px\",\n  },\n  [VIDEO_PLAYER_SIZE.EXTRA_LARGE]: {\n    heightImg: \"400px\",\n  },\n  [VIDEO_PLAYER_SIZE.VERTICAL]: {\n    heightImg: \"640px\",\n  },\n  [VIDEO_PLAYER_SIZE.FULL_WIDTH]: {\n    heightImg: \"525px\",\n  },\n};\n\ntype VideoPlayerProps = {\n  btnText: string;\n  sizeComp?: VIDEO_PLAYER_SIZE;\n  previewImageSrc?: string;\n  transcription: string;\n  videoSrc: string;\n};\n\nexport const VideoPlayer = ({\n  btnText = \"Trascrizione\",\n  sizeComp = VIDEO_PLAYER_SIZE.LARGE,\n  transcription,\n  previewImageSrc,\n  videoSrc,\n}: VideoPlayerProps) => {\n  const [isPlaying, setIsPlaying] = useState(false);\n  const [hasPlayedOnce, setHasPlayedOnce] = useState(false);\n  const { width } = sizeStyles[sizeComp];\n  const { heightImg } = imgSize[sizeComp];\n  const [isExpanded, setExpanded] = useState(false);\n\n  const handlePlay = () => {\n    if (!hasPlayedOnce) {\n      setHasPlayedOnce(true);\n      setIsPlaying(true);\n    } else {\n      setIsPlaying(!isPlaying);\n    }\n  };\n\n  return (\n    <Col\n      br={\"x4\"}\n      style={{ width: width }}\n      className={clsx(\n        \"shadow\",\n        isExpanded && \"ui-expanded\",\n        \"video-section-container\",\n      )}\n    >\n      <div\n        className=\"video-player-container\"\n        style={{ height: heightImg }}\n        onClick={handlePlay}\n      >\n        <div\n          className={clsx(\"start-video-container\", {\n            \"fade-out\": isPlaying || hasPlayedOnce,\n          })}\n          style={{\n            backgroundImage: isPlaying || hasPlayedOnce ? \"none\" : `url(${previewImageSrc})`,\n          }}\n        >\n          <div\n            className={clsx(\"play-button-container\", { [\"hidden\"]: isPlaying })}\n          >\n            <div className=\"play-button-icon\">\n              <PlayVideo />\n            </div>\n            <div className=\"play-button-text\">Riproduci</div>\n          </div>\n        </div>\n        <div className=\"video-container\">\n          <video\n            controls\n            src={videoSrc !== \"\" ? videoSrc : undefined}\n            autoPlay={isPlaying}\n            onEnded={() => setIsPlaying(false)}\n          />\n        </div>\n      </div>\n\n      {transcription && (\n        <div className=\"transcription-container\">\n          <div\n            className={clsx(\n              \"expand-button-container\",\n              \"accordion\",\n              \"base-row justify-content-between align-items-center px-x24 w-full flex-1\",\n            )}\n          >\n            <button\n              className={clsx(\n                \"ui-btn-accordion-video\",\n                \"base-row justify-content-between align-items-center\",\n              )}\n              type=\"button\"\n              onClick={() => setExpanded(!isExpanded)}\n            >\n              <span\n                className={clsx(\n                  \"fw-semibold text-primary base-col justify-content-center\",\n                )}\n              >\n                {btnText}\n              </span>\n              <ArrowDown\n                color={\"primary\"}\n                className={clsx(\"ui-arrow\", { [\"expanded\"]: isExpanded })}\n              />\n            </button>\n          </div>\n          {isExpanded && (\n            <div\n              className={clsx(\n                \"transcription-text-container\",\n                \"pt-x8 px-x24 pb-x40 fs-6 fw-regular text-grey-black\",\n              )}\n            >\n              <p>{transcription}</p>\n            </div>\n          )}\n        </div>\n      )}\n    </Col>\n  );\n};\n"],"names":["VIDEO_PLAYER_SIZE","sizeStyles","imgSize","VideoPlayer","btnText","sizeComp","transcription","previewImageSrc","videoSrc","isPlaying","setIsPlaying","useState","hasPlayedOnce","setHasPlayedOnce","width","heightImg","isExpanded","setExpanded","handlePlay","jsxs","Col","clsx","jsx","PlayVideo","ArrowDown"],"mappings":"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"}
+{"version":3,"file":"index.es41.js","sources":["../src/components/ui/VideoPlayer/index.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport \"./VideoPlayer.scss\";\nimport { ArrowDown } from \"@/icons/ArrowDown\";\nimport { useState, useRef } from \"react\";\nimport { Col } from \"@/components\";\nimport { PlayVideo } from \"@/icons\";\n\nexport enum VIDEO_PLAYER_SIZE {\n  SMALL = \"small\",\n  MEDIUM = \"medium\",\n  LARGE = \"large\",\n  EXTRA_LARGE = \"extra-large\",\n  VERTICAL = \"vertical\",\n  FULL_WIDTH = \"full-width\",\n}\n\nconst sizeStyles = {\n  [VIDEO_PLAYER_SIZE.SMALL]: {\n    width: \"311px\",\n  },\n  [VIDEO_PLAYER_SIZE.MEDIUM]: {\n    width: \"388px\",\n  },\n  [VIDEO_PLAYER_SIZE.LARGE]: {\n    width: \"666px\",\n  },\n  [VIDEO_PLAYER_SIZE.EXTRA_LARGE]: {\n    width: \"992px\",\n  },\n  [VIDEO_PLAYER_SIZE.FULL_WIDTH]: {\n    width: \"100%\",\n  },\n  [VIDEO_PLAYER_SIZE.VERTICAL]: {\n    width: \"360px\",\n  },\n};\n\nconst imgSize = {\n  [VIDEO_PLAYER_SIZE.SMALL]: {\n    heightImg: \"170px\",\n  },\n  [VIDEO_PLAYER_SIZE.MEDIUM]: {\n    heightImg: \"183px\",\n  },\n  [VIDEO_PLAYER_SIZE.LARGE]: {\n    heightImg: \"371px\",\n  },\n  [VIDEO_PLAYER_SIZE.EXTRA_LARGE]: {\n    heightImg: \"400px\",\n  },\n  [VIDEO_PLAYER_SIZE.VERTICAL]: {\n    heightImg: \"640px\",\n  },\n  [VIDEO_PLAYER_SIZE.FULL_WIDTH]: {\n    heightImg: \"525px\",\n  },\n};\n\ntype VideoPlayerProps = {\n  btnText: string;\n  sizeComp?: VIDEO_PLAYER_SIZE;\n  previewImageSrc?: string;\n  transcription: string;\n  videoSrc: string;\n};\n\nexport const VideoPlayer = ({\n  btnText = \"Trascrizione\",\n  sizeComp = VIDEO_PLAYER_SIZE.LARGE,\n  transcription,\n  previewImageSrc,\n  videoSrc,\n}: VideoPlayerProps) => {\n  const [isPlaying, setIsPlaying] = useState(false);\n  const [hasPlayedOnce, setHasPlayedOnce] = useState(false);\n  const { width } = sizeStyles[sizeComp];\n  const { heightImg } = imgSize[sizeComp];\n  const [isExpanded, setExpanded] = useState(false);\n  const videoRef = useRef<HTMLVideoElement>(null);\n\n  const handlePlay = async (e?: React.MouseEvent) => {\n    // Prevent event propagation to avoid conflicts with native video controls\n    if (e) {\n      e.preventDefault();\n      e.stopPropagation();\n    }\n    \n    const video = videoRef.current;\n    \n    if (!video) {\n      console.error(\"no video element found\");\n      return;\n    }\n\n    try {\n      if (!hasPlayedOnce) {\n        setHasPlayedOnce(true);\n        setIsPlaying(true);\n        await video.play();\n      }\n    } catch (error) {\n      console.error(\"Error controlling video:\", error);\n    }\n  };\n\n  return (\n    <Col\n      br={\"x4\"}\n      style={{ width: width }}\n      className={clsx(\n        \"shadow\",\n        isExpanded && \"ui-expanded\",\n        \"video-section-container\",\n      )}\n    >\n      <div\n        className=\"video-player-container\"\n        style={{ height: heightImg }}\n      >\n        <div\n          className={clsx(\"start-video-container\", {\n            \"fade-out\": isPlaying || hasPlayedOnce,\n          })}\n          style={{\n            backgroundImage: (previewImageSrc && !hasPlayedOnce) ? `url(\"${previewImageSrc}\")` : \"none\",\n            display: (hasPlayedOnce) ? \"none\" : \"block\",\n          }}\n          onClick={(e) => handlePlay(e)}\n        >\n          <div\n            className={clsx(\"play-button-container\", { [\"hidden\"]: isPlaying })}\n          >\n            <div className=\"play-button-icon\">\n              <PlayVideo />\n            </div>\n            <div className=\"play-button-text\">Riproduci</div>\n          </div>\n        </div>\n        <div className=\"video-container\">\n          <video\n            ref={videoRef}\n            controls\n            src={videoSrc !== \"\" ? videoSrc : undefined}\n          />\n        </div>\n      </div>\n\n      {transcription && (\n        <div className=\"transcription-container\">\n          <div\n            className={clsx(\n              \"expand-button-container\",\n              \"accordion\",\n              \"base-row justify-content-between align-items-center px-x24 w-full flex-1\",\n            )}\n          >\n            <button\n              className={clsx(\n                \"ui-btn-accordion-video\",\n                \"base-row justify-content-between align-items-center\",\n              )}\n              type=\"button\"\n              onClick={() => setExpanded(!isExpanded)}\n            >\n              <span\n                className={clsx(\n                  \"fw-semibold text-primary base-col justify-content-center\",\n                )}\n              >\n                {btnText}\n              </span>\n              <ArrowDown\n                color={\"primary\"}\n                className={clsx(\"ui-arrow\", { [\"expanded\"]: isExpanded })}\n              />\n            </button>\n          </div>\n          {isExpanded && (\n            <div\n              className={clsx(\n                \"transcription-text-container\",\n                \"pt-x8 px-x24 pb-x40 fs-6 fw-regular text-grey-black\",\n              )}\n            >\n              <p>{transcription}</p>\n            </div>\n          )}\n        </div>\n      )}\n    </Col>\n  );\n};\n"],"names":["VIDEO_PLAYER_SIZE","sizeStyles","imgSize","VideoPlayer","btnText","sizeComp","transcription","previewImageSrc","videoSrc","isPlaying","setIsPlaying","useState","hasPlayedOnce","setHasPlayedOnce","width","heightImg","isExpanded","setExpanded","videoRef","useRef","handlePlay","e","video","error","jsxs","Col","clsx","jsx","PlayVideo","ArrowDown"],"mappings":"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"}

package/dist/index.es411.js

@@ -1,12 +1,12 @@
 import * as e from "react";
-import l from "./index.es528.js";
-import { scrollAreaPropDefs as r } from "./index.es540.js";
-import { extractMarginProps as E } from "./index.es541.js";
-import { getMarginStyles as z } from "./index.es542.js";
-import { getResponsiveClassNames as i } from "./index.es543.js";
-import { getSubtree as C } from "./index.es544.js";
-import { mergeStyles as R } from "./index.es545.js";
-import { Root as V, Viewport as $, Scrollbar as m, Thumb as n, Corner as w } from "./index.es546.js";
+import l from "./index.es539.js";
+import { scrollAreaPropDefs as r } from "./index.es551.js";
+import { extractMarginProps as E } from "./index.es552.js";
+import { getMarginStyles as z } from "./index.es553.js";
+import { getResponsiveClassNames as i } from "./index.es554.js";
+import { getSubtree as C } from "./index.es555.js";
+import { mergeStyles as R } from "./index.es556.js";
+import { Root as V, Viewport as $, Scrollbar as m, Thumb as n, Corner as w } from "./index.es557.js";
 const D = e.forwardRef((p, u) => {
   const { rest: d, ...f } = E(p), [S, N] = z(f), { asChild: t, children: A, className: b, style: h, type: s, scrollHideDelay: y = s !== "scroll" ? 0 : void 0, dir: P, size: o = r.size.default, radius: c = r.radius.default, scrollbars: a = r.scrollbars.default, ...v } = d;
   return e.createElement(V, { type: s, scrollHideDelay: y, className: l("rt-ScrollAreaRoot", S, b), style: R(N, h), asChild: t }, C({ asChild: t, children: A }, (g) => e.createElement(e.Fragment, null, e.createElement($, { ...v, ref: u, className: "rt-ScrollAreaViewport" }, g), e.createElement("div", { className: "rt-ScrollAreaViewportFocusRing" }), a !== "vertical" ? e.createElement(m, { "data-radius": c, orientation: "horizontal", className: l("rt-ScrollAreaScrollbar", i({ className: "rt-r-size", value: o, propValues: r.size.values })) }, e.createElement(n, { className: "rt-ScrollAreaThumb" })) : null, a !== "horizontal" ? e.createElement(m, { "data-radius": c, orientation: "vertical", className: l("rt-ScrollAreaScrollbar", i({ className: "rt-r-size", value: o, propValues: r.size.values })) }, e.createElement(n, { className: "rt-ScrollAreaThumb" })) : null, a === "both" ? e.createElement(w, { className: "rt-ScrollAreaCorner" }) : null)));