@drawbridge/components 0.1.0 → 0.1.2

package/dist/icons/social.mjs

@@ -1,17 +1,17 @@
-import Instagram from "./instagram";
-import Facebook from "./facebook";
-import TikTok from "./tiktok";
-import YouTube from "./youtube";
-import X from "./x";
-import LinkedIn from "./linkedin";
-import Pinterest from "./pinterest";
-import Threads from "./threads";
-import Snapchat from "./snapchat";
-import WhatsApp from "./whatsapp";
-import Spotify from "./spotify";
-import Discord from "./discord";
-import Twitch from "./twitch";
-import GitHub from "./github";
+import Instagram from "./instagram.mjs";
+import Facebook from "./facebook.mjs";
+import TikTok from "./tiktok.mjs";
+import YouTube from "./youtube.mjs";
+import X from "./x.mjs";
+import LinkedIn from "./linkedin.mjs";
+import Pinterest from "./pinterest.mjs";
+import Threads from "./threads.mjs";
+import Snapchat from "./snapchat.mjs";
+import WhatsApp from "./whatsapp.mjs";
+import Spotify from "./spotify.mjs";
+import Discord from "./discord.mjs";
+import Twitch from "./twitch.mjs";
+import GitHub from "./github.mjs";
 const icons = {
   discord: Discord,
   facebook: Facebook,

package/dist/input-checkbox.mjs

@@ -1,7 +1,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import Check from "./icons/check";
-import Button from "./shared/button";
-import { inputCheckboxStyle, textStyle } from "./styles";
+import Check from "./icons/check.mjs";
+import Button from "./shared/button.mjs";
+import { inputCheckboxStyle, textStyle } from "./styles.mjs";
 const InputCheckbox = ({
   className,
   label,

package/dist/input-group.mjs

@@ -1,8 +1,8 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { cloneElement, isValidElement, useId } from "react";
-import Error from "./shared/error";
-import { inputStyle, textStyle } from "./styles";
+import Error from "./shared/error.mjs";
+import { inputStyle, textStyle } from "./styles.mjs";
 const Addon = ({ children }) => /* @__PURE__ */ jsx(
   "span",
   {

package/dist/input-name.mjs

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
-import InputGroup from "./input-group";
-import InputText from "./input-text";
+import InputGroup from "./input-group.mjs";
+import InputText from "./input-text.mjs";
 const InputName = ({
   error,
   onChange,

package/dist/input-number.mjs

@@ -1,8 +1,8 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import Minus from "./icons/minus";
-import Plus from "./icons/plus";
-import Button from "./shared/button";
-import { inputStyle } from "./styles";
+import Minus from "./icons/minus.mjs";
+import Plus from "./icons/plus.mjs";
+import Button from "./shared/button.mjs";
+import { inputStyle } from "./styles.mjs";
 import { useCallback, useEffect, useState } from "react";
 const accepts = (raw, decimal) => (decimal ? /^-?\d*\.?\d*$/ : /^-?\d*$/).test(raw);
 const emit = (raw) => {

package/dist/input-phone.mjs

@@ -3,8 +3,8 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useEffect, useState } from "react";
 import Input from "react-phone-number-input/input";
 import { detectCountry, isValid } from "@drawbridge/drawbridge-utils/phone";
-import ChevronDown from "./icons/chevron-down";
-import { inputPhoneStyle } from "./styles";
+import ChevronDown from "./icons/chevron-down.mjs";
+import { inputPhoneStyle } from "./styles.mjs";
 const isValidPhone = (number = "", country = "") => {
   const valid = isValid(number, country);
   return valid;

package/dist/input-select.mjs

@@ -1,8 +1,8 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useEffect, useState } from "react";
-import ChevronDown from "./icons/chevron-down";
-import { inputStyle, textStyle } from "./styles";
+import ChevronDown from "./icons/chevron-down.mjs";
+import { inputStyle, textStyle } from "./styles.mjs";
 const InputSelect = ({
   onChange,
   options = [],

package/dist/input-text.mjs

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { inputStyle } from "./styles";
+import { inputStyle } from "./styles.mjs";
 const InputText = ({
   className,
   max,

package/dist/input-textarea.mjs

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { inputStyle } from "./styles";
+import { inputStyle } from "./styles.mjs";
 const InputTextarea = ({
   className,
   max,

package/dist/product.mjs

@@ -4,12 +4,12 @@ import { useEffect, useMemo, useState } from "react";
 import useEmblaCarousel from "embla-carousel-react";
 import { cdnShopify } from "@drawbridge/drawbridge-utils/cdn";
 import { formatCurrency } from "@drawbridge/drawbridge-utils";
-import InputGroup from "./input-group";
-import InputSelect from "./input-select";
-import WrapperGradient from "./wrapper-gradient";
-import Loader from "./icons/loader";
-import Button from "./shared/button";
-import { buttonStyle, headerStyle, inputStyle } from "./styles";
+import InputGroup from "./input-group.mjs";
+import InputSelect from "./input-select.mjs";
+import WrapperGradient from "./wrapper-gradient.mjs";
+import Loader from "./icons/loader.mjs";
+import Button from "./shared/button.mjs";
+import { buttonStyle, headerStyle, inputStyle } from "./styles.mjs";
 const DefaultImage = ({ alt, className, src, style }) => /* @__PURE__ */ jsx(
   "img",
   {

package/dist/provider-font.mjs

@@ -1,6 +1,6 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Fragment, memo, useMemo } from "react";
-import { toFontFamily, toFontStyle, toFontWeight } from "./styles";
+import { toFontFamily, toFontStyle, toFontWeight } from "./styles.mjs";
 const defaults = {
   family: "Roboto Flex",
   transform: "none"

package/dist/shared/badge.mjs

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import Button from "./button";
+import Button from "./button.mjs";
 const Badge = ({
   children,
   className = null,

package/dist/shared/button.mjs

@@ -1,7 +1,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { forwardRef, Fragment } from "react";
-import Loader from "../icons/loader";
-import { buttonStyle } from "../styles";
+import Loader from "../icons/loader.mjs";
+import { buttonStyle } from "../styles.mjs";
 const indicators = {
   ai: "bg-purple-dark",
   error: "bg-red-dark",

package/dist/shared/card-asset.mjs

@@ -3,9 +3,9 @@ import { Fragment } from "react";
 import { cdnShopify } from "@drawbridge/drawbridge-utils/cdn";
 import { cdnSrc } from "@drawbridge/drawbridge-utils/cdn";
 import Image from "next/image";
-import Document from "../icons/document";
-import ImageIcon from "../icons/image";
-import Play from "../icons/play";
+import Document from "../icons/document.mjs";
+import ImageIcon from "../icons/image.mjs";
+import Play from "../icons/play.mjs";
 const CardAsset = ({
   asset,
   className = "w-7 h-7",

package/dist/shared/card-prize.mjs

@@ -1,9 +1,9 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { formatCurrency } from "@drawbridge/drawbridge-utils";
-import ArrowRight from "../icons/arrow-right";
-import { textStyle } from "../styles";
-import Button from "./button";
-import CardAsset from "./card-asset";
+import ArrowRight from "../icons/arrow-right.mjs";
+import { textStyle } from "../styles.mjs";
+import Button from "./button.mjs";
+import CardAsset from "./card-asset.mjs";
 const CardPrize = ({
   className,
   currency,

package/dist/shared/carousel.mjs

@@ -3,8 +3,8 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useEffect, useState } from "react";
 import useEmblaCarousel from "embla-carousel-react";
 import Fade from "embla-carousel-fade";
-import Button from "./button";
-import { dotStyle } from "../styles";
+import Button from "./button.mjs";
+import { dotStyle } from "../styles.mjs";
 const justifies = {
   center: "justify-center",
   end: "justify-end",

package/dist/shared/copy-to-clipboard.mjs

@@ -1,9 +1,9 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useState } from "react";
-import { iconLabel } from "./lib/icon-labels";
-import Check from "../icons/check";
-import Copy from "../icons/copy";
-import Button from "./button";
+import { iconLabel } from "./lib/icon-labels.mjs";
+import Check from "../icons/check.mjs";
+import Copy from "../icons/copy.mjs";
+import Button from "./button.mjs";
 const CopyToClipboard = ({
   children,
   // Layout only ( gap, justify, padding, border, font ): it goes on the row inside the Button.

package/dist/shared/empty.mjs

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { borderStyle, textStyle } from "../styles";
+import { borderStyle, textStyle } from "../styles.mjs";
 const variants = {
   primary: "bg-white border border-gray",
   secondary: "bg-gray-light border border-gray"

package/dist/shared/error.mjs

@@ -1,6 +1,6 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Fragment } from "react";
-import Warning from "../icons/warning";
+import Warning from "../icons/warning.mjs";
 const sizes = {
   default: { className: "flex items-center justify-start space-x-2 py-1 px-1.5 rounded text-sm", icon: "w-4 h-4" },
   small: { className: "flex w-fit max-w-full items-center justify-start gap-1 px-[5px] rounded-[3px] text-xs", icon: "w-3 h-3" }

package/dist/shared/fieldset.mjs

@@ -1,5 +1,5 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { borderStyle, textStyle } from "../styles";
+import { borderStyle, textStyle } from "../styles.mjs";
 const Fieldset = ({
   button,
   children,

package/dist/shared/input-checkbox-list.mjs

@@ -1,8 +1,8 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useId } from "react";
-import InputCheckbox from "../input-checkbox";
-import { backgroundStyle, borderStyle } from "../styles";
-import WrapperGradient from "../wrapper-gradient";
+import InputCheckbox from "../input-checkbox.mjs";
+import { backgroundStyle, borderStyle } from "../styles.mjs";
+import WrapperGradient from "../wrapper-gradient.mjs";
 const InputCheckboxList = ({
   className,
   items = [],

package/dist/shared/input-range.mjs

@@ -1,5 +1,5 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { backgroundStyle, borderStyle, buttonStyle, textStyle } from "../styles";
+import { backgroundStyle, borderStyle, buttonStyle, textStyle } from "../styles.mjs";
 const className = "h-6 w-6 border border-black bg-gray-light";
 const control = {
   className,

package/dist/shared/input-switch.mjs

@@ -1,7 +1,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Switch } from "@headlessui/react";
-import Button from "./button";
-import { buttonStyle, inputStyle, textStyle } from "../styles";
+import Button from "./button.mjs";
+import { buttonStyle, inputStyle, textStyle } from "../styles.mjs";
 const InputSwitch = ({
   disabled,
   helper,

package/dist/shared/input-url.mjs

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { sanitizeHttps } from "@drawbridge/drawbridge-utils/sanitize";
-import InputText from "../input-text";
+import InputText from "../input-text.mjs";
 const InputUrl = ({ onChange, value, ...rest }) => /* @__PURE__ */ jsx(
   InputText,
   {

package/dist/shared/lib/helpers.mjs

@@ -1,7 +1,7 @@
 import { allowedUploadTypes, maximumUploadBytes } from "@drawbridge/drawbridge-utils/upload";
 import { capitalize, formatNumber, megabyte } from "@drawbridge/drawbridge-utils";
-import Lock from "../../icons/lock";
-import Warning from "../../icons/warning";
+import Lock from "../../icons/lock.mjs";
+import Warning from "../../icons/warning.mjs";
 const advertisementPreview = (values, options) => {
   var _a;
   return {

package/dist/shared/lib/icon-labels.mjs

@@ -1,10 +1,10 @@
-import Copy from "../../icons/copy";
-import Download from "../../icons/download";
-import Filter from "../../icons/filter";
-import Lock from "../../icons/lock";
-import Pencil from "../../icons/pencil";
-import Plus from "../../icons/plus";
-import Trash from "../../icons/trash";
+import Copy from "../../icons/copy.mjs";
+import Download from "../../icons/download.mjs";
+import Filter from "../../icons/filter.mjs";
+import Lock from "../../icons/lock.mjs";
+import Pencil from "../../icons/pencil.mjs";
+import Plus from "../../icons/plus.mjs";
+import Trash from "../../icons/trash.mjs";
 const labels = /* @__PURE__ */ new Map([
   [Copy, "Copy"],
   [Download, "Download"],

package/dist/shared/lib/yup.mjs

@@ -1,5 +1,5 @@
 import { yupResolver } from "@hookform/resolvers/yup";
-import { fileSizeLimits } from "./helpers";
+import { fileSizeLimits } from "./helpers.mjs";
 import * as yup from "@drawbridge/drawbridge-utils/yup";
 const resolver = yupResolver;
 yup.addMethod(yup.mixed, "file", function(limits) {

package/dist/shared/loader.mjs

@@ -1,6 +1,6 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import LogoMark from "../icons/logo-mark";
-import Loader from "../icons/loader";
+import LogoMark from "../icons/logo-mark.mjs";
+import Loader from "../icons/loader.mjs";
 const LogoLoader = () => /* @__PURE__ */ jsx(
   "div",
   {

package/dist/shared/overlay.mjs

@@ -1,8 +1,8 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
 import { Transition } from "@headlessui/react";
-import Button from "./button";
-import { textStyle } from "../styles";
+import Button from "./button.mjs";
+import { textStyle } from "../styles.mjs";
 const Overlay = ({
   className = "z-40 fixed inset-0",
   // linger: the tint stays 300ms on leave, so the panel above animates out first.

package/dist/shared/sortable.mjs

@@ -3,7 +3,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { closestCenter, DndContext, DragOverlay, KeyboardSensor, PointerSensor, useSensor, useSensors } from "@dnd-kit/core";
 import { arrayMove, SortableContext, sortableKeyboardCoordinates, useSortable, verticalListSortingStrategy } from "@dnd-kit/sortable";
-import Drag from "../icons/drag";
+import Drag from "../icons/drag.mjs";
 import { CSS } from "@dnd-kit/utilities";
 const SortableItemContext = ({
   as: Element,

package/dist/shared/tabs.mjs

@@ -1,9 +1,9 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { Tab, TabGroup, TabList, TabPanel, TabPanels } from "@headlessui/react";
-import { buttonStyle } from "../styles";
-import Badge from "./badge";
-import Button from "./button";
+import { buttonStyle } from "../styles.mjs";
+import Badge from "./badge.mjs";
+import Button from "./button.mjs";
 const Tabs = ({
   active = 0,
   list = [],

package/dist/video.mjs

@@ -2,8 +2,8 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import dynamic from "next/dynamic";
 import { Fragment, useEffect, useRef, useState } from "react";
-import Loader from "./icons/loader";
-import Warning from "./icons/warning";
+import Loader from "./icons/loader.mjs";
+import Warning from "./icons/warning.mjs";
 const ReactPlayer = dynamic(
   () => import("react-player/lazy"),
   {