@postal-music/icons 0.1.4 → 0.1.7

package/dist/types/icons/users/Users03Icon.d.ts

@@ -0,0 +1,6 @@
+import * as React from "react";
+type Users03IconProps = React.SVGProps<SVGSVGElement> & {
+    size?: number | string;
+};
+export default function Users03Icon({ size, className, ...props }: Users03IconProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/icons/users/UsersIcon.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+interface IconProps {
+    size?: number;
+    color?: string;
+    strokeWidth?: number;
+}
+declare const UsersIcon: React.FC<IconProps>;
+export default UsersIcon;

package/dist/types/icons/users/UsersPlusIcon.d.ts

@@ -0,0 +1,4 @@
+export declare const UsersPlusIcon: ({ className, size, }: {
+    className?: string;
+    size?: number;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/types/icons/users/index.d.ts

@@ -0,0 +1,9 @@
+export { default as AccountIcon } from './AccountIcon';
+export { default as UserApproveIcon } from './UserApproveIcon';
+export { default as UserIcon } from './UserIcon';
+export { UserPlusIcon } from './UserPlusIcon';
+export { UserUp01Icon } from './UserUp01Icon';
+export { default as UserXIcon } from './UserXIcon';
+export { default as Users03Icon } from './Users03Icon';
+export { default as UsersIcon } from './UsersIcon';
+export { UsersPlusIcon } from './UsersPlusIcon';

package/dist/types/index.d.ts

@@ -0,0 +1,2 @@
+export * from './icons';
+export * from './tokens';

package/dist/types/tokens/colors.d.ts

@@ -0,0 +1,48 @@
+/**
+ * Postal Design Tokens — Colors
+ *
+ * Primitive hex values shared across all platforms.
+ * Web apps map these to CSS custom properties via tailwind.config.ts.
+ * Native apps use these values directly in StyleSheet.
+ */
+export declare const colors: {
+    readonly black: "#000000";
+    readonly white: "#FFFFFF";
+    readonly gray: {
+        readonly 50: "#F5F5F5";
+        readonly 100: "#EEEEEF";
+        readonly 200: "#D9D9D9";
+        readonly 300: "#B3B3B3";
+        readonly 400: "#A0A0A0";
+        readonly 500: "#7F7F7F";
+        readonly 600: "#666666";
+        readonly 700: "#333333";
+    };
+    readonly blue: {
+        readonly DEFAULT: "#007EFF";
+        readonly 500: "#3B82F6";
+    };
+    readonly red: {
+        readonly DEFAULT: "#FA233B";
+        readonly light: "#FF5A5E";
+    };
+    readonly green: {
+        readonly DEFAULT: "#008000";
+        readonly spotify: "#1DB954";
+    };
+    readonly semantic: {
+        readonly backgroundPrimary: "#FFFFFF";
+        readonly backgroundSecondary: "#F5F5F5";
+        readonly backgroundTertiary: "#EEEEEF";
+        readonly backgroundPlaceholder: "#D9D9D9";
+        readonly textPrimary: "#000000";
+        readonly textSecondary: "#7F7F7F";
+        readonly textTertiary: "#666666";
+        readonly textMuted: "#A0A0A0";
+        readonly textPlaceholder: "#DCDCDE";
+        readonly textInverse: "#FFFFFF";
+        readonly separator: "#EEEEEF";
+        readonly overlay: "rgba(0, 0, 0, 0.28)";
+    };
+};
+export type Colors = typeof colors;

package/dist/types/tokens/index.d.ts

@@ -0,0 +1,4 @@
+export * from './colors';
+export * from './spacing';
+export * from './typography';
+export * from './radius';

package/dist/types/tokens/radius.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Postal Design Tokens — Border Radius
+ */
+export declare const radius: {
+    readonly none: 0;
+    readonly xs: 5;
+    readonly sm: 10;
+    readonly md: 12;
+    readonly lg: 15;
+    readonly xl: 20;
+    readonly xxl: 50;
+    readonly pill: 1000;
+};
+export type Radius = typeof radius;

package/dist/types/tokens/spacing.d.ts

@@ -0,0 +1,23 @@
+/**
+ * Postal Design Tokens — Spacing
+ *
+ * Unitless values (logical pixels). Use directly in React Native StyleSheet
+ * or as px values in CSS/Tailwind.
+ */
+export declare const spacing: {
+    readonly xs: 4;
+    readonly sm: 8;
+    readonly md: 16;
+    readonly lg: 20;
+    readonly xl: 24;
+    readonly xxl: 32;
+    readonly '3xl': 40;
+    readonly '4xl': 50;
+    readonly screenPadding: 20;
+    readonly sectionGap: 40;
+    readonly listItemGap: 16;
+    readonly gridColumnGap: 15;
+    readonly gridRowGap: 18;
+    readonly gridGap: 16;
+};
+export type Spacing = typeof spacing;

package/dist/types/tokens/typography.d.ts

@@ -0,0 +1,38 @@
+/**
+ * Postal Design Tokens — Typography
+ *
+ * Unitless values. Apply as px in CSS/Tailwind or directly in React Native TextStyle.
+ */
+export declare const fontSizes: {
+    readonly caption: 11;
+    readonly xs: 12;
+    readonly sm: 13;
+    readonly base: 14;
+    readonly md: 15;
+    readonly body: 16;
+    readonly lg: 18;
+    readonly xl: 20;
+    readonly '2xl': 22;
+    readonly '3xl': 24;
+    readonly '4xl': 37;
+};
+export declare const fontWeights: {
+    readonly regular: "400";
+    readonly medium: "500";
+    readonly semiBold: "600";
+    readonly bold: "700";
+};
+export declare const lineHeights: {
+    readonly tight: 1.1;
+    readonly snug: 1.25;
+    readonly normal: 1.35;
+    readonly relaxed: 1.5;
+};
+export declare const letterSpacings: {
+    readonly tightest: -0.72;
+    readonly tighter: -0.48;
+    readonly tight: -0.37;
+    readonly none: 0;
+    readonly wide: 0.22;
+    readonly wider: 0.32;
+};

package/dist/types/utils/cn.d.ts

@@ -0,0 +1 @@
+export declare function cn(...classes: (string | undefined | null | false)[]): string;

package/package.json

@@ -1,22 +1,22 @@
 {
   "name": "@postal-music/icons",
-  "version": "0.1.4",
+  "version": "0.1.7",
   "description": "Shared design system for Postal — icons and tokens for React and React Native",
   "publishConfig": {
     "access": "public"
   },
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
-  "types": "./src/index.ts",
+  "types": "./dist/types/index.d.ts",
   "react-native": "./dist/index.native.js",
   "exports": {
     ".": {
       "react-native": {
-        "types": "./src/index.ts",
+        "types": "./dist/types/index.d.ts",
         "import": "./dist/index.native.mjs",
         "require": "./dist/index.native.js"
       },
-      "types": "./src/index.ts",
+      "types": "./dist/types/index.d.ts",
       "import": "./dist/index.mjs",
       "require": "./dist/index.js"
     }
@@ -26,7 +26,7 @@
     "src"
   ],
   "scripts": {
-    "build": "tsup",
+    "build": "tsup && tsc -p tsconfig.build.json && node scripts/strip-web-suffix.mjs",
     "dev": "tsup --watch"
   },
   "peerDependencies": {

package/src/icons/arrows/index.ts

@@ -1,10 +1,10 @@
-export { default as ArrowDownIcon } from './ArrowDownIcon';
+export { ArrowDownIcon } from './ArrowDownIcon';
 export { default as ArrowLeftIcon } from './ArrowLeftIcon';
-export { default as ArrowRightIcon } from './ArrowRightIcon';
-export { default as ArrowUpIcon01 } from './ArrowUp01Icon';
-export { default as ArrowUpIcon } from './ArrowUpIcon';
+export { ArrowRightIcon } from './ArrowRightIcon';
+export { ArrowUpIcon01 } from './ArrowUp01Icon';
+export { ArrowUpIcon } from './ArrowUpIcon';
 export { default as ChevronLeftIcon } from './ChevronLeftIcon';
 export { default as ChevronSelectorIcon } from './ChevronSelectorIcon';
-export { default as NarrowUpRightIcon } from './NarrowUpRightIcon';
+export { NarrowUpRightIcon } from './NarrowUpRightIcon';
 export { default as SwitchHorizontal02Icon } from './SwitchHorizontal02Icon';
-export { default as UTurnIcon } from './UTurnIcon';
+export { UTurnIcon } from './UTurnIcon';

package/src/icons/communication/index.ts

@@ -1,8 +1,8 @@
 export { default as AnnotationInfoIcon } from './AnnotationInfoIcon';
-export { default as ChatBubbleDotIcon } from './ChatBubbleDotIcon';
+export { ChatBubbleDotIcon } from './ChatBubbleDotIcon';
 export { default as ChatBubbleIcon } from './ChatBubbleIcon';
 export { default as MailIcon } from './MailIcon';
 export { default as MessageSquareTextIcon } from './MessageSquareTextIcon';
-export { default as MessageTextCircle01Icon } from './MessageTextCircle01Icon';
-export { default as NotificationTextIcon } from './NotificationTextIcon';
+export { MessageTextCircle01Icon } from './MessageTextCircle01Icon';
+export { NotificationTextIcon } from './NotificationTextIcon';
 export { default as SendIcon } from './SendIcon';

package/src/icons/files/index.ts

@@ -1,14 +1,14 @@
-export { default as CameraIcon } from './CameraIcon';
+export { CameraIcon } from './CameraIcon';
 export { default as Download02Icon } from './Download02Icon';
 export { default as Download03Icon } from './Download03Icon';
 export { default as Download04Icon } from './Download04Icon';
-export { default as DownloadCircleIcon } from './DownloadCircleIcon';
+export { DownloadCircleIcon } from './DownloadCircleIcon';
 export { default as DownloadIcon } from './DownloadIcon';
 export { default as File02Icon } from './File02Icon';
 export { default as FileDownload02Icon } from './FileDownload02Icon';
 export { default as FolderGradientIcon } from './FolderGradientIcon';
 export { default as FolderIcon } from './FolderIcon';
-export { default as FolderPlusIcon } from './FolderPlusIcon';
-export { default as Upload01Icon } from './Upload01Icon';
-export { default as UploadCloudIcon } from './UploadCloudIcon';
-export { default as UploadIcon } from './UploadIcon';
+export { FolderPlusIcon } from './FolderPlusIcon';
+export { Upload01Icon } from './Upload01Icon';
+export { UploadCloudIcon } from './UploadCloudIcon';
+export { UploadIcon } from './UploadIcon';

package/src/icons/general/Recording02.native.tsx

@@ -0,0 +1,28 @@
+import * as React from "react";
+import Svg, { Path } from "react-native-svg";
+
+type Recording02Props = {
+  size?: number | string;
+};
+
+const Recording02Icon: React.FC<Recording02Props> = ({ size = 18 }) => {
+  return (
+    <Svg
+      width={size}
+      height={size}
+      viewBox="0 0 18 18"
+      fill="none"
+    >
+      <Path
+        d="M2.25 7.5L2.25 10.5M5.625 8.25V9.75M9 4.5V13.5M12.375 2.25V15.75M15.75 7.5V10.5"
+        stroke="currentColor"
+        strokeWidth="1.6"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </Svg>
+  );
+};
+
+export { Recording02Icon };
+export default Recording02Icon;

package/src/icons/general/Recording02.web.tsx

@@ -0,0 +1,39 @@
+import * as React from "react";
+
+type Recording02Props = React.SVGProps<SVGSVGElement> & {
+  title?: string;
+  size?: number | string;
+};
+
+const Recording02Icon = ({
+  title = "Recording",
+  className,
+  size = 18,
+  ...props
+}: Recording02Props) => {
+  const ariaLabel = props["aria-label"] ?? title;
+
+  return (
+    <svg
+      width={size}
+      height={size}
+      viewBox="0 0 18 18"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      role="img"
+      aria-label={ariaLabel}
+      className={className}
+      {...props}
+    >
+      <path
+        d="M2.25 7.5L2.25 10.5M5.625 8.25V9.75M9 4.5V13.5M12.375 2.25V15.75M15.75 7.5V10.5"
+        stroke="currentColor"
+        strokeWidth="1.6"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+};
+
+export default Recording02Icon;

package/src/icons/general/TagsIcon.web.tsx

@@ -1,7 +1,6 @@
 import React from 'react';
-import { LucideProps } from 'lucide-react';
 
-interface TagsIconProps extends LucideProps {
+interface TagsIconProps extends React.SVGProps<SVGSVGElement> {
   size?: number | string;
   className?: string;
 }

package/src/icons/general/Target05Icon.native.tsx

@@ -0,0 +1,28 @@
+import * as React from "react";
+import Svg, { Path } from "react-native-svg";
+
+type Target05Props = {
+  size?: number | string;
+};
+
+const Target05Icon: React.FC<Target05Props> = ({ size = 18 }) => {
+  return (
+    <Svg
+      width={size}
+      height={size}
+      viewBox="0 0 18 18"
+      fill="none"
+    >
+      <Path
+        d="M11.25 4.25522C13.0237 5.09782 14.25 6.9057 14.25 9M6.29431 13.5C4.76969 12.5813 3.75 10.9097 3.75 8.99996M16.5 9C16.5 13.1421 13.1421 16.5 9 16.5C4.85786 16.5 1.5 13.1421 1.5 9C1.5 4.85786 4.85786 1.5 9 1.5C13.1421 1.5 16.5 4.85786 16.5 9ZM11.25 9C11.25 10.2426 10.2426 11.25 9 11.25C7.75736 11.25 6.75 10.2426 6.75 9C6.75 7.75736 7.75736 6.75 9 6.75C10.2426 6.75 11.25 7.75736 11.25 9Z"
+        stroke="currentColor"
+        strokeWidth="1.6"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </Svg>
+  );
+};
+
+export { Target05Icon };
+export default Target05Icon;

package/src/icons/general/Target05Icon.web.tsx

@@ -0,0 +1,39 @@
+import * as React from "react";
+
+type Target05Props = React.SVGProps<SVGSVGElement> & {
+  title?: string;
+  size?: number | string;
+};
+
+const Target05Icon = ({
+  title = "Target",
+  className,
+  size = 18,
+  ...props
+}: Target05Props) => {
+  const ariaLabel = props["aria-label"] ?? title;
+
+  return (
+    <svg
+      width={size}
+      height={size}
+      viewBox="0 0 18 18"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      role="img"
+      aria-label={ariaLabel}
+      className={className}
+      {...props}
+    >
+      <path
+        d="M11.25 4.25522C13.0237 5.09782 14.25 6.9057 14.25 9M6.29431 13.5C4.76969 12.5813 3.75 10.9097 3.75 8.99996M16.5 9C16.5 13.1421 13.1421 16.5 9 16.5C4.85786 16.5 1.5 13.1421 1.5 9C1.5 4.85786 4.85786 1.5 9 1.5C13.1421 1.5 16.5 4.85786 16.5 9ZM11.25 9C11.25 10.2426 10.2426 11.25 9 11.25C7.75736 11.25 6.75 10.2426 6.75 9C6.75 7.75736 7.75736 6.75 9 6.75C10.2426 6.75 11.25 7.75736 11.25 9Z"
+        stroke="currentColor"
+        strokeWidth="1.6"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+};
+
+export default Target05Icon;

package/src/icons/general/index.ts

@@ -2,19 +2,19 @@ export { default as ActivityIcon } from './ActivityIcon';
 export { default as BookIcon } from './BookIcon';
 export { default as BookmarkIcon } from './BookmarkIcon';
 export { default as CollaborativeIcon } from './CollaborativeIcon';
-export { default as DataIcon } from './DataIcon';
+export { DataIcon } from './DataIcon';
 export { default as Dataflow03Icon } from './Dataflow03Icon';
-export { default as Datapoints01Icon } from './Datapoints01Icon';
-export { default as DropBoxIcon } from './DropBoxIcon';
+export { Datapoints01Icon } from './Datapoints01Icon';
+export { DropboxIcon as DropBoxIcon } from './DropBoxIcon';
 export { default as FaceSmileIcon } from './FaceSmileIcon';
 export { default as Flag01Icon } from './Flag01Icon';
 export { default as Gift01Icon } from './Gift01Icon';
 export { default as GlobeIcon } from './GlobeIcon';
 export { default as Globe02Icon } from './Globe02Icon';
 export { default as Globe05Icon } from './Globe05Icon';
-export { default as Hash02Icon } from './Hash02Icon';
+export { Hash02Icon } from './Hash02Icon';
 export { HeartIcon } from './HeartIcon';
-export { default as HelpIcon } from './HelpIcon';
+export { HelpIcon } from './HelpIcon';
 export { default as ImageIcon } from './ImageIcon';
 export { default as Image01Icon } from './Image01Icon';
 export { default as Image03Icon } from './Image03Icon';
@@ -30,7 +30,8 @@ export { default as MusicNoteIcon } from './MusicNoteIcon';
 export { default as PinIcon } from './PinIcon';
 export { default as QuestionCircleIcon } from './QuestionCircleIcon';
 export { default as Recording01Icon } from './Recordering01';
-export { default as Share01Icon } from './Share01Icon';
+export { default as Recording02Icon } from './Recording02';
+export { Share01Icon } from './Share01Icon';
 export { default as ShareIcon } from './ShareIcon';
 export { default as StarIcon } from './StarIcon';
 export { default as Stars01Icon } from './Stars01Icon';
@@ -38,5 +39,6 @@ export { default as Stars02Icon } from './Stars02Icon';
 export { default as Stars04Icon } from './Stars04Icon';
 export { default as Stars06Icon } from './Stars06Icon';
 export { default as TagsIcon } from './TagsIcon';
-export { default as ThumbsDownIcon } from './ThumbsDownIcon';
+export { default as Target05Icon } from './Target05Icon';
+export { ThumbsDownIcon } from './ThumbsDownIcon';
 export { default as Type01Icon } from './Type01Icon';

package/src/icons/media/index.ts

@@ -5,13 +5,13 @@ export { default as MediaUploadIcon } from './MediaUploadIcon';
 export { default as NextTrackIcon } from './NextTrackIcon';
 export { default as PauseIcon } from './PauseIcon';
 export { default as PlayIcon } from './PlayIcon';
-export { default as PlaySquareIcon } from './PlaySquareIcon';
+export { PlaySquareIcon } from './PlaySquareIcon';
 export { default as PreviousTrackIcon } from './PreviousTrackIcon';
-export { default as Repeat01Icon } from './Repeat01Icon';
+export { Repeat01Icon } from './Repeat01Icon';
 export { default as Repeat02Icon } from './Repeat02Icon';
 export { default as Repeat03Icon } from './Repeat03Icon';
 export { default as Shuffle01Icon } from './Shuffle01Icon';
 export { default as TenSecondsForwardIcon } from './TenSecondsForwardIcon';
 export { default as VideoRecorderIcon } from './VideoRecorderIcon';
 export { default as VolumeIcon } from './VolumeIcon';
-export { default as VolumeMaxIcon } from './VolumeMaxIcon';
+export { VolumeMaxIcon } from './VolumeMaxIcon';

package/src/icons/users/index.ts

@@ -1,9 +1,9 @@
 export { default as AccountIcon } from './AccountIcon';
 export { default as UserApproveIcon } from './UserApproveIcon';
 export { default as UserIcon } from './UserIcon';
-export { default as UserPlusIcon } from './UserPlusIcon';
-export { default as UserUp01Icon } from './UserUp01Icon';
+export { UserPlusIcon } from './UserPlusIcon';
+export { UserUp01Icon } from './UserUp01Icon';
 export { default as UserXIcon } from './UserXIcon';
 export { default as Users03Icon } from './Users03Icon';
 export { default as UsersIcon } from './UsersIcon';
-export { default as UsersPlusIcon } from './UsersPlusIcon';
+export { UsersPlusIcon } from './UsersPlusIcon';