foldkit 0.25.0 → 0.26.0

package/dist/ui/switch/index.js

@@ -0,0 +1,66 @@
+import { Match as M, Option, Schema as S } from 'effect';
+import { html } from '../../html';
+import { m } from '../../message';
+import { evo } from '../../struct';
+// MODEL
+/** Schema for the switch component's state, tracking the toggle's checked status. */
+export const Model = S.Struct({
+    id: S.String,
+    isChecked: S.Boolean,
+});
+// MESSAGE
+/** Sent when the user toggles the switch via click or Space key. */
+export const Toggled = m('Toggled');
+/** Placeholder message used when no action is needed. */
+export const NoOp = m('NoOp');
+/** Union of all messages the switch component can produce. */
+export const Message = S.Union(Toggled, NoOp);
+/** Creates an initial switch model from a config. Defaults to unchecked. */
+export const init = (config) => ({
+    id: config.id,
+    isChecked: config.isChecked ?? false,
+});
+// UPDATE
+/** Processes a switch message and returns the next model and commands. */
+export const update = (model, message) => M.value(message).pipe(M.withReturnType(), M.tagsExhaustive({
+    Toggled: () => [evo(model, { isChecked: isChecked => !isChecked }), []],
+    NoOp: () => [model, []],
+}));
+const labelId = (id) => `${id}-label`;
+const descriptionId = (id) => `${id}-description`;
+/** Renders an accessible switch toggle by building ARIA attribute groups and delegating layout to the consumer's `toView` callback. */
+export const view = (config) => {
+    const { AriaChecked, AriaDescribedBy, AriaDisabled, AriaLabelledBy, DataAttribute, Id, Name, OnClick, OnKeyUpPreventDefault, Role, Tabindex, Type, Value, } = html();
+    const { model: { id, isChecked }, toMessage, isDisabled = false, name, value: formValue = 'on', } = config;
+    const handleKeyUp = (key) => M.value(key).pipe(M.when(' ', () => Option.some(toMessage(Toggled()))), M.orElse(() => Option.none()));
+    const checkedAttributes = isChecked ? [DataAttribute('checked', '')] : [];
+    const disabledAttributes = isDisabled
+        ? [AriaDisabled(true), DataAttribute('disabled', '')]
+        : [];
+    const buttonAttributes = [
+        Role('switch'),
+        AriaChecked(isChecked),
+        AriaLabelledBy(labelId(id)),
+        AriaDescribedBy(descriptionId(id)),
+        Tabindex(0),
+        ...checkedAttributes,
+        ...disabledAttributes,
+        ...(isDisabled
+            ? []
+            : [OnClick(toMessage(Toggled())), OnKeyUpPreventDefault(handleKeyUp)]),
+    ];
+    const labelAttributes = [
+        Id(labelId(id)),
+        ...(isDisabled ? [] : [OnClick(toMessage(Toggled()))]),
+    ];
+    const descriptionAttributes = [Id(descriptionId(id))];
+    const hiddenInputAttributes = name
+        ? [Type('hidden'), Name(name), Value(isChecked ? formValue : '')]
+        : [];
+    return config.toView({
+        button: buttonAttributes,
+        label: labelAttributes,
+        description: descriptionAttributes,
+        hiddenInput: hiddenInputAttributes,
+    });
+};

package/dist/ui/switch/public.d.ts

@@ -0,0 +1,3 @@
+export { init, update, view, Model, Message } from './index';
+export type { Toggled, NoOp, InitConfig, ViewConfig, SwitchAttributes, } from './index';
+//# sourceMappingURL=public.d.ts.map

package/dist/ui/switch/public.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"public.d.ts","sourceRoot":"","sources":["../../../src/ui/switch/public.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,SAAS,CAAA;AAE5D,YAAY,EACV,OAAO,EACP,IAAI,EACJ,UAAU,EACV,UAAU,EACV,gBAAgB,GACjB,MAAM,SAAS,CAAA"}

package/dist/ui/switch/public.js

@@ -0,0 +1 @@
+export { init, update, view, Model, Message } from './index';

package/dist/ui/transition.d.ts

@@ -0,0 +1,5 @@
+import { Schema as S } from 'effect';
+/** Schema for the transition animation state, tracking enter/leave phases for CSS transition coordination. */
+export declare const TransitionState: S.Literal<["Idle", "EnterStart", "EnterAnimating", "LeaveStart", "LeaveAnimating"]>;
+export type TransitionState = typeof TransitionState.Type;
+//# sourceMappingURL=transition.d.ts.map

package/dist/ui/transition.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"transition.d.ts","sourceRoot":"","sources":["../../src/ui/transition.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,CAAC,EAAE,MAAM,QAAQ,CAAA;AAEpC,8GAA8G;AAC9G,eAAO,MAAM,eAAe,qFAM3B,CAAA;AACD,MAAM,MAAM,eAAe,GAAG,OAAO,eAAe,CAAC,IAAI,CAAA"}

package/dist/ui/transition.js

@@ -0,0 +1,3 @@
+import { Schema as S } from 'effect';
+/** Schema for the transition animation state, tracking enter/leave phases for CSS transition coordination. */
+export const TransitionState = S.Literal('Idle', 'EnterStart', 'EnterAnimating', 'LeaveStart', 'LeaveAnimating');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "foldkit",
-  "version": "0.25.0",
+  "version": "0.26.0",
   "description": "Elm-inspired UI framework powered by Effect",
   "type": "module",
   "main": "./dist/index.js",
@@ -79,6 +79,14 @@
       "types": "./dist/ui/menu/public.d.ts",
       "import": "./dist/ui/menu/public.js"
     },
+    "./ui/popover": {
+      "types": "./dist/ui/popover/public.d.ts",
+      "import": "./dist/ui/popover/public.js"
+    },
+    "./ui/switch": {
+      "types": "./dist/ui/switch/public.d.ts",
+      "import": "./dist/ui/switch/public.js"
+    },
     "./ui/tabs": {
       "types": "./dist/ui/tabs/public.d.ts",
       "import": "./dist/ui/tabs/public.js"

package/dist/ui/menu/anchor.d.ts

@@ -1,18 +0,0 @@
-import type { Placement } from '@floating-ui/dom';
-/** Static configuration for anchor-based positioning of menu items relative to the button. */
-export type AnchorConfig = Readonly<{
-    placement?: Placement;
-    gap?: number;
-    offset?: number;
-    padding?: number;
-    portal?: boolean;
-}>;
-/** Returns insert/destroy hook callbacks that position the menu items container relative to its button using Floating UI. */
-export declare const anchorHooks: (config: {
-    buttonId: string;
-    anchor: AnchorConfig;
-}) => Readonly<{
-    onInsert: (items: Element) => void;
-    onDestroy: (items: Element) => void;
-}>;
-//# sourceMappingURL=anchor.d.ts.map

package/dist/ui/menu/anchor.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"anchor.d.ts","sourceRoot":"","sources":["../../../src/ui/menu/anchor.ts"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAA;AAEjD,8FAA8F;AAC9F,MAAM,MAAM,YAAY,GAAG,QAAQ,CAAC;IAClC,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,CAAC,CAAA;AAmBF,6HAA6H;AAC7H,eAAO,MAAM,WAAW,GAAI,QAAQ;IAClC,QAAQ,EAAE,MAAM,CAAA;IAChB,MAAM,EAAE,YAAY,CAAA;CACrB,KAAG,QAAQ,CAAC;IACX,QAAQ,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAA;IAClC,SAAS,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAA;CACpC,CAsEC,CAAA"}