@ganpatiinfo/gids-web-dom-reference 2.0.9 → 2.1.0

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @ganpatiinfo/gids-web-dom-reference
 
+## 2.1.0
+
+### Minor Changes
+
+- Added layout components
+
+### Patch Changes
+
+- Updated dependencies
+- Updated dependencies
+  - @ganpatiinfo/gids-core-shared@2.1.0
+  - @ganpatiinfo/gids-web-shared@2.1.0
+
 ## 2.0.9
 
 ### Patch Changes

package/dist/components/GidsBox/GidsBox.d.ts

@@ -0,0 +1,6 @@
+import { type ClassValue, type GidsBoxWebProps, PermittedGidsBoxElements } from '@ganpatiinfo/gids-web-shared';
+export type GidsBoxDomProps<ComponentType extends PermittedGidsBoxElements> = GidsBoxWebProps<Element, ComponentType> & {
+    className?: ClassValue;
+};
+export declare const GidsBoxDom: <ComponentType extends PermittedGidsBoxElements = "div">({ children, component, className, }: GidsBoxDomProps<ComponentType>) => HTMLElement;
+//# sourceMappingURL=GidsBox.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"GidsBox.d.ts","sourceRoot":"","sources":["../../../src/components/GidsBox/GidsBox.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,KAAK,UAAU,EACf,KAAK,eAAe,EAEpB,wBAAwB,EACxB,MAAM,8BAA8B,CAAC;AAKtC,MAAM,MAAM,eAAe,CAAC,aAAa,SAAS,wBAAwB,IACzE,eAAe,CAAC,OAAO,EAAE,aAAa,CAAC,GAAG;IACzC,SAAS,CAAC,EAAE,UAAU,CAAC;CACvB,CAAC;AAEH,eAAO,MAAM,UAAU,GACtB,aAAa,SAAS,wBAAwB,GAAG,KAAK,EACrD,qCAIC,eAAe,CAAC,aAAa,CAAC,KAAG,WAYnC,CAAC"}

package/dist/components/GidsBox/GidsBox.js

@@ -0,0 +1,14 @@
+import { GidsBoxWebUtils, } from '@ganpatiinfo/gids-web-shared';
+import { appendAsChildren } from '../../utils/domUtils.js';
+const { getGidsBoxClassNames } = GidsBoxWebUtils;
+export const GidsBoxDom = ({ children, component, className, }) => {
+    const box = document.createElement(
+    //@ts-expect-error: ex
+    component && component !== '' ? component : 'div');
+    box.className = getGidsBoxClassNames(className);
+    if (children) {
+        appendAsChildren(box, children);
+    }
+    return box;
+};
+//# sourceMappingURL=GidsBox.js.map

package/dist/components/GidsBox/GidsBox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GidsBox.js","sourceRoot":"","sources":["../../../src/components/GidsBox/GidsBox.ts"],"names":[],"mappings":"AAAA,OAAO,EAGN,eAAe,GAEf,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAE3D,MAAM,EAAE,oBAAoB,EAAE,GAAG,eAAe,CAAC;AAOjD,MAAM,CAAC,MAAM,UAAU,GAAG,CAExB,EACD,QAAQ,EACR,SAAS,EACT,SAAS,GACuB,EAAe,EAAE;IACjD,MAAM,GAAG,GAAG,QAAQ,CAAC,aAAa;IACjC,sBAAsB;IACtB,SAAS,IAAI,SAAS,KAAK,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAClC,CAAC;IACjB,GAAG,CAAC,SAAS,GAAG,oBAAoB,CAAC,SAAS,CAAC,CAAC;IAEhD,IAAI,QAAQ,EAAE,CAAC;QACd,gBAAgB,CAAC,GAAG,EAAE,QAAQ,CAAC,CAAC;IACjC,CAAC;IAED,OAAO,GAAG,CAAC;AACZ,CAAC,CAAC"}

package/dist/components/GidsBreadcrumb/GidsBreadcrumb.d.ts

@@ -0,0 +1,8 @@
+import { type ClassValue } from '@ganpatiinfo/gids-web-shared';
+import { type DomChildren } from '../../utils/domUtils.js';
+import { type GidsBreadcrumbCommonProps } from '@ganpatiinfo/gids-core-shared';
+export interface GidsBreadcrumbDomProps extends GidsBreadcrumbCommonProps<DomChildren> {
+    extraClasses?: ClassValue;
+}
+export declare const GidsBreadcrumbDom: ({ children, extraClasses, }: GidsBreadcrumbDomProps) => HTMLElement;
+//# sourceMappingURL=GidsBreadcrumb.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"GidsBreadcrumb.d.ts","sourceRoot":"","sources":["../../../src/components/GidsBreadcrumb/GidsBreadcrumb.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,KAAK,UAAU,EAEf,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAAoB,KAAK,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC7E,OAAO,EAAE,KAAK,yBAAyB,EAAE,MAAM,+BAA+B,CAAC;AAI/E,MAAM,WAAW,sBAChB,SAAQ,yBAAyB,CAAC,WAAW,CAAC;IAC9C,YAAY,CAAC,EAAE,UAAU,CAAC;CAC1B;AAED,eAAO,MAAM,iBAAiB,GAAI,6BAG/B,sBAAsB,KAAG,WAa3B,CAAC"}

package/dist/components/GidsBreadcrumb/GidsBreadcrumb.js

@@ -0,0 +1,15 @@
+import { GidsBreadcrumbWebUtils, } from '@ganpatiinfo/gids-web-shared';
+import { appendAsChildren } from '../../utils/domUtils.js';
+const { getGidsBreadcrumbClassNames } = GidsBreadcrumbWebUtils;
+export const GidsBreadcrumbDom = ({ children, extraClasses, }) => {
+    const breadcrumb = document.createElement('nav');
+    breadcrumb.className = getGidsBreadcrumbClassNames(extraClasses);
+    breadcrumb.setAttribute('aria-label', 'Breadcrumb');
+    if (children) {
+        const orderedList = document.createElement('ol');
+        appendAsChildren(orderedList, children);
+        breadcrumb.appendChild(orderedList);
+    }
+    return breadcrumb;
+};
+//# sourceMappingURL=GidsBreadcrumb.js.map

package/dist/components/GidsBreadcrumb/GidsBreadcrumb.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GidsBreadcrumb.js","sourceRoot":"","sources":["../../../src/components/GidsBreadcrumb/GidsBreadcrumb.ts"],"names":[],"mappings":"AAAA,OAAO,EAEN,sBAAsB,GACtB,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAAE,gBAAgB,EAAoB,MAAM,yBAAyB,CAAC;AAG7E,MAAM,EAAE,2BAA2B,EAAE,GAAG,sBAAsB,CAAC;AAO/D,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,EACjC,QAAQ,EACR,YAAY,GACY,EAAe,EAAE;IACzC,MAAM,UAAU,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IACjD,UAAU,CAAC,SAAS,GAAG,2BAA2B,CAAC,YAAY,CAAC,CAAC;IAEjE,UAAU,CAAC,YAAY,CAAC,YAAY,EAAE,YAAY,CAAC,CAAC;IAEpD,IAAI,QAAQ,EAAE,CAAC;QACd,MAAM,WAAW,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;QACjD,gBAAgB,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC;QACxC,UAAU,CAAC,WAAW,CAAC,WAAW,CAAC,CAAC;IACrC,CAAC;IAED,OAAO,UAAU,CAAC;AACnB,CAAC,CAAC"}

package/dist/components/GidsBreadcrumbItem/GidsBreadcrumbItem.d.ts

@@ -0,0 +1,10 @@
+import { type GidsBreadcrumbItemCommonProps } from '@ganpatiinfo/gids-core-shared';
+import { type ClassValue } from '@ganpatiinfo/gids-web-shared';
+import { type DomNodeOrString } from '../../utils/domUtils.js';
+export interface GidsBreadcrumbItemDomProps extends GidsBreadcrumbItemCommonProps<DomNodeOrString, DomNodeOrString, DomNodeOrString> {
+    className?: ClassValue;
+    href?: DomNodeOrString;
+    onClick?: (this: HTMLAnchorElement, event: Event) => void;
+}
+export declare const GidsBreadcrumbItemDom: ({ children, selected, leadingIcon, href, onClick, className, separator, isSeparatorVisible, renderingSystem, currentIndex, totalLength, }: GidsBreadcrumbItemDomProps) => HTMLLIElement;
+//# sourceMappingURL=GidsBreadcrumbItem.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"GidsBreadcrumbItem.d.ts","sourceRoot":"","sources":["../../../src/components/GidsBreadcrumbItem/GidsBreadcrumbItem.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,6BAA6B,EAAE,MAAM,+BAA+B,CAAC;AACnF,OAAO,EACN,KAAK,UAAU,EAEf,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAEN,KAAK,eAAe,EACpB,MAAM,yBAAyB,CAAC;AAMjC,MAAM,WAAW,0BAChB,SAAQ,6BAA6B,CACpC,eAAe,EACf,eAAe,EACf,eAAe,CACf;IACD,SAAS,CAAC,EAAE,UAAU,CAAC;IACvB,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,iBAAiB,EAAE,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;CAC1D;AAED,eAAO,MAAM,qBAAqB,GAAI,2IAYnC,0BAA0B,KAAG,aAwD/B,CAAC"}

package/dist/components/GidsBreadcrumbItem/GidsBreadcrumbItem.js

@@ -0,0 +1,45 @@
+import { GidsBreadcrumbItemWebUtils, } from '@ganpatiinfo/gids-web-shared';
+import { appendAsChildren, } from '../../utils/domUtils.js';
+import { GidsIconDom } from '../GidsIcon/GidsIcon.js';
+const { getGidsBreadcrumbItemClassNames } = GidsBreadcrumbItemWebUtils;
+export const GidsBreadcrumbItemDom = ({ children, selected, leadingIcon, href, onClick, className, separator, isSeparatorVisible = true, renderingSystem = 'non-array', currentIndex = 0, totalLength = 0, }) => {
+    const breadcrumbItem = document.createElement('li');
+    breadcrumbItem.className = getGidsBreadcrumbItemClassNames({ selected }, className);
+    const breadcrumbAnchorItem = document.createElement('a');
+    breadcrumbAnchorItem.className = `gids-breadcrumb-item__anchor-label`;
+    if (href) {
+        breadcrumbAnchorItem.setAttribute('href', href);
+    }
+    if (leadingIcon && leadingIcon !== '' && leadingIcon !== '(none)') {
+        breadcrumbAnchorItem.appendChild(GidsIconDom({
+            name: leadingIcon,
+            appearance: 'regular',
+            alt: '',
+            size: 'md',
+            className: 'gids-breadcrumb-item__leading-icon',
+        }));
+    }
+    if (children) {
+        appendAsChildren(breadcrumbAnchorItem, children);
+    }
+    breadcrumbItem.appendChild(breadcrumbAnchorItem);
+    if (isSeparatorVisible) {
+        if ((renderingSystem === 'array' && currentIndex < totalLength - 1) ||
+            renderingSystem === 'non-array') {
+            breadcrumbItem.appendChild(GidsIconDom({
+                name: separator && separator !== '' && separator !== '(none)'
+                    ? separator
+                    : 'chevron-right',
+                appearance: 'filled',
+                alt: '',
+                size: 'md',
+                className: 'gids-breadcrumb-item__separator-icon',
+            }));
+        }
+    }
+    if (onClick) {
+        breadcrumbItem.addEventListener('click', onClick);
+    }
+    return breadcrumbItem;
+};
+//# sourceMappingURL=GidsBreadcrumbItem.js.map

package/dist/components/GidsBreadcrumbItem/GidsBreadcrumbItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GidsBreadcrumbItem.js","sourceRoot":"","sources":["../../../src/components/GidsBreadcrumbItem/GidsBreadcrumbItem.ts"],"names":[],"mappings":"AACA,OAAO,EAEN,0BAA0B,GAC1B,MAAM,8BAA8B,CAAC;AACtC,OAAO,EACN,gBAAgB,GAEhB,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAGtD,MAAM,EAAE,+BAA+B,EAAE,GAAG,0BAA0B,CAAC;AAavE,MAAM,CAAC,MAAM,qBAAqB,GAAG,CAAC,EACrC,QAAQ,EACR,QAAQ,EACR,WAAW,EACX,IAAI,EACJ,OAAO,EACP,SAAS,EACT,SAAS,EACT,kBAAkB,GAAG,IAAI,EACzB,eAAe,GAAG,WAAW,EAC7B,YAAY,GAAG,CAAC,EAChB,WAAW,GAAG,CAAC,GACa,EAAiB,EAAE;IAC/C,MAAM,cAAc,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;IACpD,cAAc,CAAC,SAAS,GAAG,+BAA+B,CACzD,EAAE,QAAQ,EAAE,EACZ,SAAS,CACT,CAAC;IACF,MAAM,oBAAoB,GAAG,QAAQ,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;IACzD,oBAAoB,CAAC,SAAS,GAAG,oCAAoC,CAAC;IAEtE,IAAI,IAAI,EAAE,CAAC;QACV,oBAAoB,CAAC,YAAY,CAAC,MAAM,EAAE,IAAc,CAAC,CAAC;IAC3D,CAAC;IAED,IAAI,WAAW,IAAI,WAAW,KAAK,EAAE,IAAI,WAAW,KAAK,QAAQ,EAAE,CAAC;QACnE,oBAAoB,CAAC,WAAW,CAC/B,WAAW,CAAC;YACX,IAAI,EAAE,WAAuB;YAC7B,UAAU,EAAE,SAAS;YACrB,GAAG,EAAE,EAAE;YACP,IAAI,EAAE,IAAI;YACV,SAAS,EAAE,oCAAoC;SAC/C,CAAC,CACF,CAAC;IACH,CAAC;IAED,IAAI,QAAQ,EAAE,CAAC;QACd,gBAAgB,CAAC,oBAAoB,EAAE,QAAQ,CAAC,CAAC;IAClD,CAAC;IAED,cAAc,CAAC,WAAW,CAAC,oBAAoB,CAAC,CAAC;IAEjD,IAAI,kBAAkB,EAAE,CAAC;QACxB,IACC,CAAC,eAAe,KAAK,OAAO,IAAI,YAAY,GAAG,WAAW,GAAG,CAAC,CAAC;YAC/D,eAAe,KAAK,WAAW,EAC9B,CAAC;YACF,cAAc,CAAC,WAAW,CACzB,WAAW,CAAC;gBACX,IAAI,EACH,SAAS,IAAI,SAAS,KAAK,EAAE,IAAI,SAAS,KAAK,QAAQ;oBACtD,CAAC,CAAE,SAAsB;oBACzB,CAAC,CAAC,eAAe;gBACnB,UAAU,EAAE,QAAQ;gBACpB,GAAG,EAAE,EAAE;gBACP,IAAI,EAAE,IAAI;gBACV,SAAS,EAAE,sCAAsC;aACjD,CAAC,CACF,CAAC;QACH,CAAC;IACF,CAAC;IAED,IAAI,OAAO,EAAE,CAAC;QACb,cAAc,CAAC,gBAAgB,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;IACnD,CAAC;IAED,OAAO,cAAc,CAAC;AACvB,CAAC,CAAC"}

package/dist/components/GidsButton/GidsButton.js

@@ -28,7 +28,7 @@ export const GidsButtonDom = ({ as, appearance, size, disabled, destructive, loa
     if (loading) {
         button.appendChild(GidsSpinnerControlDom({
             size: size === 'lg' || size === undefined ? 'md' : size,
-            indeterminate: true
+            indeterminate: true,
         }));
     }
     if (onClick && !loading) {

package/dist/components/GidsButton/GidsButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"GidsButton.js","sourceRoot":"","sources":["../../../src/components/GidsButton/GidsButton.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,kBAAkB,EAClB,QAAQ,GAGR,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAAE,qBAAqB,EAAE,MAAM,8CAA8C,CAAC;AACrF,OAAO,EAAE,gBAAgB,EAAoB,MAAM,yBAAyB,CAAC;AAE7E,MAAM,EAAE,uBAAuB,EAAE,GAAG,kBAAkB,CAAC;AAUvD,MAAM,CAAC,MAAM,aAAa,GAAG,CAE3B,EACD,EAAE,EACF,UAAU,EACV,IAAI,EACJ,QAAQ,EACR,WAAW,EACX,OAAO,EACP,KAAK,EACL,QAAQ,EACR,WAAW,EACX,YAAY,EACZ,IAAI,EACJ,IAAI,EACJ,OAAO,GAC4B,EAEf,EAAE;IACtB,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CACpC,EAAE,IAAI,QAAQ,CAC4D,CAAC;IAE5E,MAAM,CAAC,SAAS,GAAG,uBAAuB,CACzC,EAAE,UAAU,EAAE,IAAI,EAAE,KAAK,EAAE,WAAW,EAAE,OAAO,EAAE,EACjD,CAAC,QAAQ,IAAI,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,YAAY,CAAC,CAC7D,CAAC;IAEF,IAAI,EAAE,KAAK,GAAG,EAAE,CAAC;QAChB,MAAM,CAAC,YAAY,CAAC,MAAM,EAAE,IAAI,IAAI,QAAQ,CAAC,CAAC;QAE9C,IAAI,QAAQ,EAAE,CAAC;YACd,MAAM,CAAC,YAAY,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC;QACrC,CAAC;aAAM,CAAC;YACP,MAAM,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC;QACpC,CAAC;IACF,CAAC;IAED,IAAI,EAAE,KAAK,GAAG,EAAE,CAAC;QAChB,IAAI,IAAI,EAAE,CAAC;YACV,MAAM,CAAC,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;QACnC,CAAC;IACF,CAAC;IAED,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;IAC/C,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,sBAAsB,CAAC,CAAC;IAE9C,gBAAgB,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;IAEvC,gBAAgB,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC;IAEpC,MAAM,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;IAE5B,gBAAgB,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC;IAEvC,IAAI,OAAO,EAAE,CAAC;QACb,MAAM,CAAC,WAAW,CACjB,qBAAqB,CAAC;YACrB,IAAI,EAAE,IAAI,KAAK,IAAI,IAAI,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI;YAC3C,aAAa,EAAE,IAAI;SAC/B,CAAC,CACF,CAAC;IACH,CAAC;IAEE,IAAI,OAAO,IAAI,CAAC,OAAO,EAAE,CAAC;QACtB,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAE,OAAO,CAAC,CAAA;IAC7C,CAAC;IAEJ,OAAO,MAAM,CAAC;AACf,CAAC,CAAC"}
+{"version":3,"file":"GidsButton.js","sourceRoot":"","sources":["../../../src/components/GidsButton/GidsButton.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,kBAAkB,EAClB,QAAQ,GAGR,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAAE,qBAAqB,EAAE,MAAM,8CAA8C,CAAC;AACrF,OAAO,EAAE,gBAAgB,EAAoB,MAAM,yBAAyB,CAAC;AAE7E,MAAM,EAAE,uBAAuB,EAAE,GAAG,kBAAkB,CAAC;AAUvD,MAAM,CAAC,MAAM,aAAa,GAAG,CAE3B,EACD,EAAE,EACF,UAAU,EACV,IAAI,EACJ,QAAQ,EACR,WAAW,EACX,OAAO,EACP,KAAK,EACL,QAAQ,EACR,WAAW,EACX,YAAY,EACZ,IAAI,EACJ,IAAI,EACJ,OAAO,GAC4B,EAEf,EAAE;IACtB,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CACpC,EAAE,IAAI,QAAQ,CAC4D,CAAC;IAE5E,MAAM,CAAC,SAAS,GAAG,uBAAuB,CACzC,EAAE,UAAU,EAAE,IAAI,EAAE,KAAK,EAAE,WAAW,EAAE,OAAO,EAAE,EACjD,CAAC,QAAQ,IAAI,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,YAAY,CAAC,CAC7D,CAAC;IAEF,IAAI,EAAE,KAAK,GAAG,EAAE,CAAC;QAChB,MAAM,CAAC,YAAY,CAAC,MAAM,EAAE,IAAI,IAAI,QAAQ,CAAC,CAAC;QAE9C,IAAI,QAAQ,EAAE,CAAC;YACd,MAAM,CAAC,YAAY,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC;QACrC,CAAC;aAAM,CAAC;YACP,MAAM,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC;QACpC,CAAC;IACF,CAAC;IAED,IAAI,EAAE,KAAK,GAAG,EAAE,CAAC;QAChB,IAAI,IAAI,EAAE,CAAC;YACV,MAAM,CAAC,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;QACnC,CAAC;IACF,CAAC;IAED,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;IAC/C,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,sBAAsB,CAAC,CAAC;IAE9C,gBAAgB,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;IAEvC,gBAAgB,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC;IAEpC,MAAM,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;IAE5B,gBAAgB,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC;IAEvC,IAAI,OAAO,EAAE,CAAC;QACb,MAAM,CAAC,WAAW,CACjB,qBAAqB,CAAC;YACrB,IAAI,EAAE,IAAI,KAAK,IAAI,IAAI,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI;YACvD,aAAa,EAAE,IAAI;SACnB,CAAC,CACF,CAAC;IACH,CAAC;IAED,IAAI,OAAO,IAAI,CAAC,OAAO,EAAE,CAAC;QACzB,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;IAC3C,CAAC;IAED,OAAO,MAAM,CAAC;AACf,CAAC,CAAC"}

package/dist/components/GidsContainer/GidsContainer.d.ts

@@ -0,0 +1,7 @@
+import { type ClassValue, type GidsContainerWebProps } from '@ganpatiinfo/gids-web-shared';
+import { type DomChildren } from '../../utils/domUtils.js';
+export interface GidsContainerDomProps extends GidsContainerWebProps<DomChildren> {
+    className?: ClassValue;
+}
+export declare const GidsContainerDom: ({ children, fixed, maxWidth, className, }: GidsContainerDomProps) => HTMLDivElement;
+//# sourceMappingURL=GidsContainer.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"GidsContainer.d.ts","sourceRoot":"","sources":["../../../src/components/GidsContainer/GidsContainer.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,KAAK,UAAU,EACf,KAAK,qBAAqB,EAE1B,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAAoB,KAAK,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAI7E,MAAM,WAAW,qBAChB,SAAQ,qBAAqB,CAAC,WAAW,CAAC;IAC1C,SAAS,CAAC,EAAE,UAAU,CAAC;CACvB;AAED,eAAO,MAAM,gBAAgB,GAAI,2CAK9B,qBAAqB,KAAG,cAY1B,CAAC"}

package/dist/components/GidsContainer/GidsContainer.js

@@ -0,0 +1,12 @@
+import { GidsContainerWebUtils, } from '@ganpatiinfo/gids-web-shared';
+import { appendAsChildren } from '../../utils/domUtils.js';
+const { getGidsContainerClassNames } = GidsContainerWebUtils;
+export const GidsContainerDom = ({ children, fixed = false, maxWidth = 'lg', className, }) => {
+    const container = document.createElement('div');
+    container.className = getGidsContainerClassNames({ fixed, maxWidth }, className);
+    if (children) {
+        appendAsChildren(container, children);
+    }
+    return container;
+};
+//# sourceMappingURL=GidsContainer.js.map

package/dist/components/GidsContainer/GidsContainer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GidsContainer.js","sourceRoot":"","sources":["../../../src/components/GidsContainer/GidsContainer.ts"],"names":[],"mappings":"AAAA,OAAO,EAGN,qBAAqB,GACrB,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAAE,gBAAgB,EAAoB,MAAM,yBAAyB,CAAC;AAE7E,MAAM,EAAE,0BAA0B,EAAE,GAAG,qBAAqB,CAAC;AAO7D,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAChC,QAAQ,EACR,KAAK,GAAG,KAAK,EACb,QAAQ,GAAG,IAAI,EACf,SAAS,GACc,EAAkB,EAAE;IAC3C,MAAM,SAAS,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAChD,SAAS,CAAC,SAAS,GAAG,0BAA0B,CAC/C,EAAE,KAAK,EAAE,QAAQ,EAAE,EACnB,SAAS,CACT,CAAC;IAEF,IAAI,QAAQ,EAAE,CAAC;QACd,gBAAgB,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC;IACvC,CAAC;IAED,OAAO,SAAS,CAAC;AAClB,CAAC,CAAC"}

package/dist/index.d.ts

@@ -30,6 +30,10 @@ export * from './components/GidsButtonGroup/GidsButtonGroup.js';
 export * from './components/GidsButtonDock/GidsButtonDock.js';
 export * from './components/GidsSectionNotice/GidsSectionNotice.js';
 export * from './components/GidsCompoundButton/GidsCompoundButton.js';
+export * from './components/GidsBox/GidsBox.js';
+export * from './components/GidsContainer/GidsContainer.js';
+export * from './components/GidsBreadcrumbItem/GidsBreadcrumbItem.js';
+export * from './components/GidsBreadcrumb/GidsBreadcrumb.js';
 /**
  * Utilities
  */

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,cAAc,uCAAuC,CAAC;AACtD,cAAc,yCAAyC,CAAC;AACxD,cAAc,+CAA+C,CAAC;AAC9D,cAAc,mCAAmC,CAAC;AAClD,cAAc,uDAAuD,CAAC;AACtE,cAAc,qCAAqC,CAAC;AACpD,cAAc,mCAAmC,CAAC;AAClD,cAAc,wDAAwD,CAAC;AACvE,cAAc,yCAAyC,CAAC;AACxD,cAAc,mDAAmD,CAAC;AAClE,cAAc,0DAA0D,CAAC;AACzE,cAAc,oDAAoD,CAAC;AACnE,cAAc,sDAAsD,CAAC;AACrE,cAAc,2CAA2C,CAAC;AAC1D,cAAc,qCAAqC,CAAC;AACpD,cAAc,uCAAuC,CAAC;AACtD,cAAc,qDAAqD,CAAC;AACpE,cAAc,+CAA+C,CAAC;AAC9D,cAAc,iDAAiD,CAAC;AAChE,cAAc,qCAAqC,CAAC;AACpD,cAAc,uCAAuC,CAAC;AACtD,cAAc,iDAAiD,CAAC;AAChE,cAAc,2CAA2C,CAAC;AAC1D,cAAc,qEAAqE,CAAC;AACpF,cAAc,2CAA2C,CAAC;AAC1D,cAAc,iDAAiD,CAAC;AAChE,cAAc,+CAA+C,CAAC;AAC9D,cAAc,qDAAqD,CAAC;AACpE,cAAc,uDAAuD,CAAC;AAEtE;;GAEG;AACH,cAAc,qBAAqB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,cAAc,uCAAuC,CAAC;AACtD,cAAc,yCAAyC,CAAC;AACxD,cAAc,+CAA+C,CAAC;AAC9D,cAAc,mCAAmC,CAAC;AAClD,cAAc,uDAAuD,CAAC;AACtE,cAAc,qCAAqC,CAAC;AACpD,cAAc,mCAAmC,CAAC;AAClD,cAAc,wDAAwD,CAAC;AACvE,cAAc,yCAAyC,CAAC;AACxD,cAAc,mDAAmD,CAAC;AAClE,cAAc,0DAA0D,CAAC;AACzE,cAAc,oDAAoD,CAAC;AACnE,cAAc,sDAAsD,CAAC;AACrE,cAAc,2CAA2C,CAAC;AAC1D,cAAc,qCAAqC,CAAC;AACpD,cAAc,uCAAuC,CAAC;AACtD,cAAc,qDAAqD,CAAC;AACpE,cAAc,+CAA+C,CAAC;AAC9D,cAAc,iDAAiD,CAAC;AAChE,cAAc,qCAAqC,CAAC;AACpD,cAAc,uCAAuC,CAAC;AACtD,cAAc,iDAAiD,CAAC;AAChE,cAAc,2CAA2C,CAAC;AAC1D,cAAc,qEAAqE,CAAC;AACpF,cAAc,2CAA2C,CAAC;AAC1D,cAAc,iDAAiD,CAAC;AAChE,cAAc,+CAA+C,CAAC;AAC9D,cAAc,qDAAqD,CAAC;AACpE,cAAc,uDAAuD,CAAC;AACtE,cAAc,iCAAiC,CAAC;AAChD,cAAc,6CAA6C,CAAC;AAC5D,cAAc,uDAAuD,CAAC;AACtE,cAAc,+CAA+C,CAAC;AAE9D;;GAEG;AACH,cAAc,qBAAqB,CAAC"}

package/dist/index.js

@@ -30,6 +30,10 @@ export * from './components/GidsButtonGroup/GidsButtonGroup.js';
 export * from './components/GidsButtonDock/GidsButtonDock.js';
 export * from './components/GidsSectionNotice/GidsSectionNotice.js';
 export * from './components/GidsCompoundButton/GidsCompoundButton.js';
+export * from './components/GidsBox/GidsBox.js';
+export * from './components/GidsContainer/GidsContainer.js';
+export * from './components/GidsBreadcrumbItem/GidsBreadcrumbItem.js';
+export * from './components/GidsBreadcrumb/GidsBreadcrumb.js';
 /**
  * Utilities
  */

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,cAAc,uCAAuC,CAAC;AACtD,cAAc,yCAAyC,CAAC;AACxD,cAAc,+CAA+C,CAAC;AAC9D,cAAc,mCAAmC,CAAC;AAClD,cAAc,uDAAuD,CAAC;AACtE,cAAc,qCAAqC,CAAC;AACpD,cAAc,mCAAmC,CAAC;AAClD,cAAc,wDAAwD,CAAC;AACvE,cAAc,yCAAyC,CAAC;AACxD,cAAc,mDAAmD,CAAC;AAClE,cAAc,0DAA0D,CAAC;AACzE,cAAc,oDAAoD,CAAC;AACnE,cAAc,sDAAsD,CAAC;AACrE,cAAc,2CAA2C,CAAC;AAC1D,cAAc,qCAAqC,CAAC;AACpD,cAAc,uCAAuC,CAAC;AACtD,cAAc,qDAAqD,CAAC;AACpE,cAAc,+CAA+C,CAAC;AAC9D,cAAc,iDAAiD,CAAC;AAChE,cAAc,qCAAqC,CAAC;AACpD,cAAc,uCAAuC,CAAC;AACtD,cAAc,iDAAiD,CAAC;AAChE,cAAc,2CAA2C,CAAC;AAC1D,cAAc,qEAAqE,CAAC;AACpF,cAAc,2CAA2C,CAAC;AAC1D,cAAc,iDAAiD,CAAC;AAChE,cAAc,+CAA+C,CAAC;AAC9D,cAAc,qDAAqD,CAAC;AACpE,cAAc,uDAAuD,CAAC;AAEtE;;GAEG;AACH,cAAc,qBAAqB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,cAAc,uCAAuC,CAAC;AACtD,cAAc,yCAAyC,CAAC;AACxD,cAAc,+CAA+C,CAAC;AAC9D,cAAc,mCAAmC,CAAC;AAClD,cAAc,uDAAuD,CAAC;AACtE,cAAc,qCAAqC,CAAC;AACpD,cAAc,mCAAmC,CAAC;AAClD,cAAc,wDAAwD,CAAC;AACvE,cAAc,yCAAyC,CAAC;AACxD,cAAc,mDAAmD,CAAC;AAClE,cAAc,0DAA0D,CAAC;AACzE,cAAc,oDAAoD,CAAC;AACnE,cAAc,sDAAsD,CAAC;AACrE,cAAc,2CAA2C,CAAC;AAC1D,cAAc,qCAAqC,CAAC;AACpD,cAAc,uCAAuC,CAAC;AACtD,cAAc,qDAAqD,CAAC;AACpE,cAAc,+CAA+C,CAAC;AAC9D,cAAc,iDAAiD,CAAC;AAChE,cAAc,qCAAqC,CAAC;AACpD,cAAc,uCAAuC,CAAC;AACtD,cAAc,iDAAiD,CAAC;AAChE,cAAc,2CAA2C,CAAC;AAC1D,cAAc,qEAAqE,CAAC;AACpF,cAAc,2CAA2C,CAAC;AAC1D,cAAc,iDAAiD,CAAC;AAChE,cAAc,+CAA+C,CAAC;AAC9D,cAAc,qDAAqD,CAAC;AACpE,cAAc,uDAAuD,CAAC;AACtE,cAAc,iCAAiC,CAAC;AAChD,cAAc,6CAA6C,CAAC;AAC5D,cAAc,uDAAuD,CAAC;AACtE,cAAc,+CAA+C,CAAC;AAE9D;;GAEG;AACH,cAAc,qBAAqB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@ganpatiinfo/gids-web-dom-reference",
-	"version": "2.0.9",
+	"version": "2.1.0",
 	"private": false,
 	"description": "DOM for components reference implementations",
 	"homepage": "https://ganpatiinfosystem.vercel.app/",
@@ -24,8 +24,8 @@
 		"directory": "packages/private/web-dom-reference"
 	},
 	"dependencies": {
-		"@ganpatiinfo/gids-core-shared": "2.0.9",
-		"@ganpatiinfo/gids-web-shared": "2.0.9"
+		"@ganpatiinfo/gids-core-shared": "2.1.0",
+		"@ganpatiinfo/gids-web-shared": "2.1.0"
 	},
 	"peerDependencies": {
 		"@ganpatiinfo/gids-web-theme-interface": "2.0.7",

package/src/components/GidsBox/GidsBox.ts

@@ -0,0 +1,34 @@
+import {
+	type ClassValue,
+	type GidsBoxWebProps,
+	GidsBoxWebUtils,
+	PermittedGidsBoxElements,
+} from '@ganpatiinfo/gids-web-shared';
+import { appendAsChildren } from '../../utils/domUtils.js';
+
+const { getGidsBoxClassNames } = GidsBoxWebUtils;
+
+export type GidsBoxDomProps<ComponentType extends PermittedGidsBoxElements> =
+	GidsBoxWebProps<Element, ComponentType> & {
+		className?: ClassValue;
+	};
+
+export const GidsBoxDom = <
+	ComponentType extends PermittedGidsBoxElements = 'div',
+>({
+	children,
+	component,
+	className,
+}: GidsBoxDomProps<ComponentType>): HTMLElement => {
+	const box = document.createElement(
+		//@ts-expect-error: ex
+		component && component !== '' ? component : 'div',
+	) as HTMLElement;
+	box.className = getGidsBoxClassNames(className);
+
+	if (children) {
+		appendAsChildren(box, children);
+	}
+
+	return box;
+};

package/src/components/GidsBreadcrumb/GidsBreadcrumb.ts

@@ -0,0 +1,31 @@
+import {
+	type ClassValue,
+	GidsBreadcrumbWebUtils,
+} from '@ganpatiinfo/gids-web-shared';
+import { appendAsChildren, type DomChildren } from '../../utils/domUtils.js';
+import { type GidsBreadcrumbCommonProps } from '@ganpatiinfo/gids-core-shared';
+
+const { getGidsBreadcrumbClassNames } = GidsBreadcrumbWebUtils;
+
+export interface GidsBreadcrumbDomProps
+	extends GidsBreadcrumbCommonProps<DomChildren> {
+	extraClasses?: ClassValue;
+}
+
+export const GidsBreadcrumbDom = ({
+	children,
+	extraClasses,
+}: GidsBreadcrumbDomProps): HTMLElement => {
+	const breadcrumb = document.createElement('nav');
+	breadcrumb.className = getGidsBreadcrumbClassNames(extraClasses);
+
+	breadcrumb.setAttribute('aria-label', 'Breadcrumb');
+
+	if (children) {
+		const orderedList = document.createElement('ol');
+		appendAsChildren(orderedList, children);
+		breadcrumb.appendChild(orderedList);
+	}
+
+	return breadcrumb;
+};

package/src/components/GidsBreadcrumbItem/GidsBreadcrumbItem.ts

@@ -0,0 +1,94 @@
+import { type GidsBreadcrumbItemCommonProps } from '@ganpatiinfo/gids-core-shared';
+import {
+	type ClassValue,
+	GidsBreadcrumbItemWebUtils,
+} from '@ganpatiinfo/gids-web-shared';
+import {
+	appendAsChildren,
+	type DomNodeOrString,
+} from '../../utils/domUtils.js';
+import { GidsIconDom } from '../GidsIcon/GidsIcon.js';
+import { IconName } from '@ganpatiinfo/gids-web-theme-interface';
+
+const { getGidsBreadcrumbItemClassNames } = GidsBreadcrumbItemWebUtils;
+
+export interface GidsBreadcrumbItemDomProps
+	extends GidsBreadcrumbItemCommonProps<
+		DomNodeOrString,
+		DomNodeOrString,
+		DomNodeOrString
+	> {
+	className?: ClassValue;
+	href?: DomNodeOrString;
+	onClick?: (this: HTMLAnchorElement, event: Event) => void;
+}
+
+export const GidsBreadcrumbItemDom = ({
+	children,
+	selected,
+	leadingIcon,
+	href,
+	onClick,
+	className,
+	separator,
+	isSeparatorVisible = true,
+	renderingSystem = 'non-array',
+	currentIndex = 0,
+	totalLength = 0,
+}: GidsBreadcrumbItemDomProps): HTMLLIElement => {
+	const breadcrumbItem = document.createElement('li');
+	breadcrumbItem.className = getGidsBreadcrumbItemClassNames(
+		{ selected },
+		className,
+	);
+	const breadcrumbAnchorItem = document.createElement('a');
+	breadcrumbAnchorItem.className = `gids-breadcrumb-item__anchor-label`;
+
+	if (href) {
+		breadcrumbAnchorItem.setAttribute('href', href as string);
+	}
+
+	if (leadingIcon && leadingIcon !== '' && leadingIcon !== '(none)') {
+		breadcrumbAnchorItem.appendChild(
+			GidsIconDom({
+				name: leadingIcon as IconName,
+				appearance: 'regular',
+				alt: '',
+				size: 'md',
+				className: 'gids-breadcrumb-item__leading-icon',
+			}),
+		);
+	}
+
+	if (children) {
+		appendAsChildren(breadcrumbAnchorItem, children);
+	}
+
+	breadcrumbItem.appendChild(breadcrumbAnchorItem);
+
+	if (isSeparatorVisible) {
+		if (
+			(renderingSystem === 'array' && currentIndex < totalLength - 1) ||
+			renderingSystem === 'non-array'
+		) {
+			breadcrumbItem.appendChild(
+				GidsIconDom({
+					name:
+						separator && separator !== '' && separator !== '(none)'
+							? (separator as IconName)
+							: 'chevron-right',
+					appearance: 'filled',
+					alt: '',
+					size: 'md',
+					className: 'gids-breadcrumb-item__separator-icon',
+				}),
+			);
+		}
+	}
+
+	if (onClick) {
+		breadcrumbItem.addEventListener('click', onClick);
+	}
+
+	return breadcrumbItem;
+};

package/src/components/GidsButton/GidsButton.ts

@@ -76,14 +76,14 @@ export const GidsButtonDom = <
 		button.appendChild(
 			GidsSpinnerControlDom({
 				size: size === 'lg' || size === undefined ? 'md' : size,
-                indeterminate: true
+				indeterminate: true,
 			}),
 		);
 	}
 
-    if (onClick && !loading) {
-        button.addEventListener('click', onClick)
-    }
+	if (onClick && !loading) {
+		button.addEventListener('click', onClick);
+	}
 
 	return button;
 };

package/src/components/GidsContainer/GidsContainer.ts

@@ -0,0 +1,32 @@
+import {
+	type ClassValue,
+	type GidsContainerWebProps,
+	GidsContainerWebUtils,
+} from '@ganpatiinfo/gids-web-shared';
+import { appendAsChildren, type DomChildren } from '../../utils/domUtils.js';
+
+const { getGidsContainerClassNames } = GidsContainerWebUtils;
+
+export interface GidsContainerDomProps
+	extends GidsContainerWebProps<DomChildren> {
+	className?: ClassValue;
+}
+
+export const GidsContainerDom = ({
+	children,
+	fixed = false,
+	maxWidth = 'lg',
+	className,
+}: GidsContainerDomProps): HTMLDivElement => {
+	const container = document.createElement('div');
+	container.className = getGidsContainerClassNames(
+		{ fixed, maxWidth },
+		className,
+	);
+
+	if (children) {
+		appendAsChildren(container, children);
+	}
+
+	return container;
+};

package/src/index.ts

@@ -30,6 +30,10 @@ export * from './components/GidsButtonGroup/GidsButtonGroup.js';
 export * from './components/GidsButtonDock/GidsButtonDock.js';
 export * from './components/GidsSectionNotice/GidsSectionNotice.js';
 export * from './components/GidsCompoundButton/GidsCompoundButton.js';
+export * from './components/GidsBox/GidsBox.js';
+export * from './components/GidsContainer/GidsContainer.js';
+export * from './components/GidsBreadcrumbItem/GidsBreadcrumbItem.js';
+export * from './components/GidsBreadcrumb/GidsBreadcrumb.js';
 
 /**
  * Utilities