@entry-ui/qwik 0.1.0 → 0.2.0

package/lib/_internal/components/index.d.ts

@@ -0,0 +1 @@
+export * from './primitive';

package/lib/_internal/components/primitive/index.d.ts

@@ -0,0 +1,2 @@
+export type { PrimitiveProps } from './primitive.types';
+export { createPrimitive, Primitive } from './primitive';

package/lib/_internal/components/primitive/primitive.d.ts

@@ -0,0 +1,25 @@
+import type { PrimitiveProps } from './primitive.types';
+import type { Component } from '@qwik.dev/core';
+/**
+ * List of HTML elements that can be created as primitive components.
+ * Each node in this array will have a corresponding component in the `Primitive` object.
+ */
+declare const NODES: readonly ["div", "span"];
+/**
+ * A factory function that creates a polymorphic Qwik component for a specific HTML tag.
+ */
+export declare const createPrimitive: <Node extends (typeof NODES)[number]>(node: Node) => Component<PrimitiveProps<Node>>;
+/**
+ * A collection of polymorphic primitive components.
+ *
+ * Each property represents a pre-built component for a specific HTML element
+ * that supports the `as` prop for component composition.
+ *
+ * @remarks
+ * Self-closing tags (`<area>`, `<img>`, `<input>`) are automatically handled without slot content.
+ */
+export declare const Primitive: {
+    div: Component<PrimitiveProps<"div">>;
+    span: Component<PrimitiveProps<"span">>;
+};
+export {};

package/lib/_internal/components/primitive/primitive.qwik.mjs

@@ -0,0 +1,48 @@
+import { jsx } from "@qwik.dev/core/jsx-runtime";
+import { component$, Slot } from "@qwik.dev/core";
+const NODES = [
+  "div",
+  "span"
+];
+const SELF_CLOSING_TAGS = [
+  "area",
+  "base",
+  "br",
+  "col",
+  "embed",
+  "hr",
+  "img",
+  "input",
+  "link",
+  "meta",
+  "source",
+  "track",
+  "wbr"
+];
+const createPrimitive = (node) => {
+  return component$((props) => {
+    const { as, ...others } = props;
+    const element = as ?? node;
+    const Comp = element;
+    if (typeof element === "string" && SELF_CLOSING_TAGS.includes(element)) {
+      return /* @__PURE__ */ jsx(Comp, {
+        ...others
+      });
+    }
+    return /* @__PURE__ */ jsx(Comp, {
+      ...others,
+      children: /* @__PURE__ */ jsx(Slot, {})
+    });
+  });
+};
+const Primitive = NODES.reduce((primitive, node) => {
+  const Node = createPrimitive(node);
+  return {
+    ...primitive,
+    [node]: Node
+  };
+}, {});
+export {
+  Primitive,
+  createPrimitive
+};

package/lib/_internal/components/primitive/primitive.types.d.ts

@@ -0,0 +1,9 @@
+import type { Component, PropsOf } from '@qwik.dev/core';
+export type PrimitiveProps<Node> = {
+    /**
+     * The element or component this component should render as.
+     *
+     * @see {@link https://github.com/ZAHON/entry-ui/tree/main/packages/qwik/docs/guides/composition.md Composition} guide for more details.
+     */
+    as?: string | Component;
+} & PropsOf<Node>;

package/lib/_internal/index.d.ts

@@ -0,0 +1 @@
+export * from './components';

package/lib/components/index.d.ts

@@ -0,0 +1 @@
+export * from './separator';

package/lib/components/separator/index.d.ts

@@ -0,0 +1 @@
+export * as Separator from './parts';

package/lib/components/separator/index.qwik.mjs

@@ -0,0 +1,4 @@
+import * as index from "./parts/index.qwik.mjs";
+export {
+  index as Separator
+};

package/lib/components/separator/parts/index.d.ts

@@ -0,0 +1,2 @@
+export type { SeparatorRootProps as RootProps } from './separator-root';
+export { SeparatorRoot as Root } from './separator-root';

package/lib/components/separator/parts/index.qwik.mjs

@@ -0,0 +1,4 @@
+import { SeparatorRoot } from "./separator-root/separator-root.qwik.mjs";
+export {
+  SeparatorRoot as Root
+};

package/lib/components/separator/parts/separator-root/index.d.ts

@@ -0,0 +1,2 @@
+export type { SeparatorRootProps } from './separator-root.types';
+export { SeparatorRoot } from './separator-root';

package/lib/components/separator/parts/separator-root/separator-root.d.ts

@@ -0,0 +1,7 @@
+import type { SeparatorRootProps } from './separator-root.types';
+/**
+ * A horizontal or vertical line that visually and semantically separates content.
+ *
+ * Renders a `<div>` element.
+ */
+export declare const SeparatorRoot: import("@qwik.dev/core").Component<SeparatorRootProps>;

package/lib/components/separator/parts/separator-root/separator-root.qwik.mjs

@@ -0,0 +1,30 @@
+import { jsx } from "@qwik.dev/core/jsx-runtime";
+import { component$, Slot } from "@qwik.dev/core";
+import { Primitive } from "../../../../_internal/components/primitive/primitive.qwik.mjs";
+const SeparatorRoot = component$((props) => {
+  const { as = "div", orientation = "horizontal", decorative = false, ...others } = props;
+  return /* @__PURE__ */ jsx(Primitive.div, {
+    as,
+    /*
+    * When `decorative` is `true`, we use `aria-hidden="true"` and remove the `role` entirely
+    * to ensure the element is completely invisible to the accessibility tree.
+    * This is preferred over `role="none"` as it provides a more robust guarantee
+    * that assistive technologies will ignore the element and its potential children.
+    */
+    role: decorative ? void 0 : "separator",
+    "aria-hidden": decorative ? "true" : void 0,
+    /*
+    * According to WAI-ARIA, the `"separator"` role has an implicit `aria-orientation` of `"horizontal"`.
+    * We explicitly set it here to ensure consistency with the component's internal state.
+    * When `decorative` is `true`, we remove it as the element no longer has a semantic role.
+    */
+    "aria-orientation": decorative ? void 0 : orientation,
+    "data-entry-ui-qwik-separator-root": "",
+    "data-orientation": orientation,
+    ...others,
+    children: /* @__PURE__ */ jsx(Slot, {})
+  });
+});
+export {
+  SeparatorRoot
+};

package/lib/components/separator/parts/separator-root/separator-root.types.d.ts

@@ -0,0 +1,24 @@
+import type { Component, PropsOf } from '@qwik.dev/core';
+export interface SeparatorRootProps extends PropsOf<'div'> {
+    /**
+     * The element or component this component should render as.
+     *
+     * @see {@link https://github.com/ZAHON/entry-ui/tree/main/packages/qwik/docs/guides/composition.md Composition} guide for more details.
+     *
+     * @default "div"
+     */
+    as?: string | Component;
+    /**
+     * The orientation of the separator.
+     *
+     * @default "horizontal"
+     */
+    orientation?: 'horizontal' | 'vertical';
+    /**
+     * Whether or not the component is purely decorative. When `true`, accessibility-related
+     * attributes are updated so that the rendered element is removed from the accessibility tree.
+     *
+     * @default false
+     */
+    decorative?: boolean;
+}

package/lib/index.d.ts

@@ -0,0 +1 @@
+export * from './components';

package/lib/index.qwik.mjs

@@ -1 +1,4 @@
-
+import * as index from "./components/separator/parts/index.qwik.mjs";
+export {
+  index as Separator
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@entry-ui/qwik",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "",
   "keywords": [],
   "homepage": "https://github.com/ZAHON/entry-ui#readme",
@@ -14,6 +14,10 @@
     ".": {
       "types": "./lib/index.d.ts",
       "import": "./lib/index.qwik.mjs"
+    },
+    "./separator": {
+      "types": "./lib/components/separator/index.d.ts",
+      "import": "./lib/components/separator/index.qwik.mjs"
     }
   },
   "files": [
@@ -22,7 +26,7 @@
   "sideEffects": false,
   "repository": {
     "type": "git",
-    "url": "https://github.com/ZAHON/entry-ui",
+    "url": "git+https://github.com/ZAHON/entry-ui.git",
     "directory": "packages/qwik"
   },
   "bugs": {