pure-react-ui 1.4.7 → 1.5.0

package/lib/components/Text/Text.css

@@ -0,0 +1,240 @@
+/* Pure Text Component Styles */
+.pure-text {
+  margin: 0;
+  padding: 0;
+  line-height: 1.5;
+}
+
+/* Size Variants */
+.pure-text--xs {
+  font-size: 0.75rem;
+  line-height: 1rem;
+}
+
+.pure-text--sm {
+  font-size: 0.875rem;
+  line-height: 1.25rem;
+}
+
+.pure-text--md {
+  font-size: 1rem;
+  line-height: 1.5rem;
+}
+
+.pure-text--lg {
+  font-size: 1.125rem;
+  line-height: 1.75rem;
+}
+
+.pure-text--xl {
+  font-size: 1.25rem;
+  line-height: 1.75rem;
+}
+
+.pure-text--2xl {
+  font-size: 1.5rem;
+  line-height: 2rem;
+}
+
+.pure-text--3xl {
+  font-size: 1.875rem;
+  line-height: 2.25rem;
+}
+
+.pure-text--4xl {
+  font-size: 2.25rem;
+  line-height: 2.5rem;
+}
+
+/* Weight Variants */
+.pure-text--light {
+  font-weight: 300;
+}
+
+.pure-text--normal {
+  font-weight: 400;
+}
+
+.pure-text--medium {
+  font-weight: 500;
+}
+
+.pure-text--semibold {
+  font-weight: 600;
+}
+
+.pure-text--bold {
+  font-weight: 700;
+}
+
+/* Color Variants */
+.pure-text--default {
+  color: #212529;
+}
+
+.pure-text--primary {
+  color: #007bff;
+}
+
+.pure-text--secondary {
+  color: #6c757d;
+}
+
+.pure-text--success {
+  color: #28a745;
+}
+
+.pure-text--danger {
+  color: #dc3545;
+}
+
+.pure-text--warning {
+  color: #ffc107;
+}
+
+.pure-text--info {
+  color: #17a2b8;
+}
+
+.pure-text--muted {
+  color: #6c757d;
+  opacity: 0.8;
+}
+
+/* Alignment */
+.pure-text--align-left {
+  text-align: left;
+}
+
+.pure-text--align-center {
+  text-align: center;
+}
+
+.pure-text--align-right {
+  text-align: right;
+}
+
+.pure-text--align-justify {
+  text-align: justify;
+}
+
+/* Text Transform */
+.pure-text--uppercase {
+  text-transform: uppercase;
+}
+
+.pure-text--lowercase {
+  text-transform: lowercase;
+}
+
+.pure-text--capitalize {
+  text-transform: capitalize;
+}
+
+/* Text Decoration */
+.pure-text--underline {
+  text-decoration: underline;
+}
+
+.pure-text--line-through {
+  text-decoration: line-through;
+}
+
+.pure-text--overline {
+  text-decoration: overline;
+}
+
+/* Truncate */
+.pure-text--truncate {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+/* Heading Styles */
+.pure-text h1,
+h1.pure-text {
+  font-size: 2.25rem;
+  font-weight: 700;
+  line-height: 1.2;
+  margin-bottom: 0.5rem;
+}
+
+.pure-text h2,
+h2.pure-text {
+  font-size: 1.875rem;
+  font-weight: 600;
+  line-height: 1.3;
+  margin-bottom: 0.5rem;
+}
+
+.pure-text h3,
+h3.pure-text {
+  font-size: 1.5rem;
+  font-weight: 600;
+  line-height: 1.4;
+  margin-bottom: 0.5rem;
+}
+
+.pure-text h4,
+h4.pure-text {
+  font-size: 1.25rem;
+  font-weight: 600;
+  line-height: 1.4;
+  margin-bottom: 0.5rem;
+}
+
+.pure-text h5,
+h5.pure-text {
+  font-size: 1.125rem;
+  font-weight: 500;
+  line-height: 1.5;
+  margin-bottom: 0.5rem;
+}
+
+.pure-text h6,
+h6.pure-text {
+  font-size: 1rem;
+  font-weight: 500;
+  line-height: 1.5;
+  margin-bottom: 0.5rem;
+}
+
+/* Code and Pre Styles */
+code.pure-text,
+.pure-text code {
+  font-family: 'Courier New', Courier, monospace;
+  background-color: #f5f5f5;
+  padding: 0.125rem 0.25rem;
+  border-radius: 0.25rem;
+  font-size: 0.875em;
+}
+
+pre.pure-text,
+.pure-text pre {
+  font-family: 'Courier New', Courier, monospace;
+  background-color: #f5f5f5;
+  padding: 1rem;
+  border-radius: 0.375rem;
+  overflow-x: auto;
+  line-height: 1.5;
+}
+
+/* Responsive */
+@media (max-width: 768px) {
+  .pure-text--4xl {
+    font-size: 1.875rem;
+    line-height: 2.25rem;
+  }
+
+  .pure-text--3xl {
+    font-size: 1.5rem;
+    line-height: 2rem;
+  }
+
+  .pure-text--2xl {
+    font-size: 1.25rem;
+    line-height: 1.75rem;
+  }
+}
+

package/lib/components/Text/Text.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import './Text.css';
+export interface TextProps {
+    as?: 'p' | 'span' | 'div' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'label' | 'small' | 'strong' | 'em' | 'code' | 'pre';
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl';
+    weight?: 'light' | 'normal' | 'medium' | 'semibold' | 'bold';
+    color?: 'default' | 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | 'muted';
+    align?: 'left' | 'center' | 'right' | 'justify';
+    transform?: 'none' | 'uppercase' | 'lowercase' | 'capitalize';
+    decoration?: 'none' | 'underline' | 'line-through' | 'overline';
+    truncate?: boolean;
+    className?: string;
+    children: React.ReactNode;
+}
+export declare const Text: React.FC<TextProps>;
+//# sourceMappingURL=Text.d.ts.map

package/lib/components/Text/Text.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Text.d.ts","sourceRoot":"","sources":["../../../src/components/Text/Text.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,YAAY,CAAC;AAEpB,MAAM,WAAW,SAAS;IACxB,EAAE,CAAC,EAAE,GAAG,GAAG,MAAM,GAAG,KAAK,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,OAAO,GAAG,OAAO,GAAG,QAAQ,GAAG,IAAI,GAAG,MAAM,GAAG,KAAK,CAAC;IAC3H,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC;IAChE,MAAM,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,QAAQ,GAAG,UAAU,GAAG,MAAM,CAAC;IAC7D,KAAK,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,OAAO,CAAC;IAClG,KAAK,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,CAAC;IAChD,SAAS,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,WAAW,GAAG,YAAY,CAAC;IAC9D,UAAU,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,cAAc,GAAG,UAAU,CAAC;IAChE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAwCpC,CAAC"}

package/lib/components/Text/Text.js

@@ -0,0 +1,26 @@
+import React from 'react';
+import './Text.css';
+export const Text = ({ as = 'p', size = 'md', weight = 'normal', color = 'default', align = 'left', transform = 'none', decoration = 'none', truncate = false, className = '', children }) => {
+    const baseClass = 'pure-text';
+    const sizeClass = `pure-text--${size}`;
+    const weightClass = `pure-text--${weight}`;
+    const colorClass = `pure-text--${color}`;
+    const alignClass = `pure-text--align-${align}`;
+    const transformClass = transform !== 'none' ? `pure-text--${transform}` : '';
+    const decorationClass = decoration !== 'none' ? `pure-text--${decoration}` : '';
+    const truncateClass = truncate ? 'pure-text--truncate' : '';
+    const combinedClassName = [
+        baseClass,
+        sizeClass,
+        weightClass,
+        colorClass,
+        alignClass,
+        transformClass,
+        decorationClass,
+        truncateClass,
+        className
+    ].filter(Boolean).join(' ');
+    const Component = as;
+    return (React.createElement(Component, { className: combinedClassName }, children));
+};
+//# sourceMappingURL=Text.js.map

package/lib/components/Text/Text.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Text.js","sourceRoot":"","sources":["../../../src/components/Text/Text.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,YAAY,CAAC;AAepB,MAAM,CAAC,MAAM,IAAI,GAAwB,CAAC,EACxC,EAAE,GAAG,GAAG,EACR,IAAI,GAAG,IAAI,EACX,MAAM,GAAG,QAAQ,EACjB,KAAK,GAAG,SAAS,EACjB,KAAK,GAAG,MAAM,EACd,SAAS,GAAG,MAAM,EAClB,UAAU,GAAG,MAAM,EACnB,QAAQ,GAAG,KAAK,EAChB,SAAS,GAAG,EAAE,EACd,QAAQ,EACT,EAAE,EAAE;IACH,MAAM,SAAS,GAAG,WAAW,CAAC;IAC9B,MAAM,SAAS,GAAG,cAAc,IAAI,EAAE,CAAC;IACvC,MAAM,WAAW,GAAG,cAAc,MAAM,EAAE,CAAC;IAC3C,MAAM,UAAU,GAAG,cAAc,KAAK,EAAE,CAAC;IACzC,MAAM,UAAU,GAAG,oBAAoB,KAAK,EAAE,CAAC;IAC/C,MAAM,cAAc,GAAG,SAAS,KAAK,MAAM,CAAC,CAAC,CAAC,cAAc,SAAS,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;IAC7E,MAAM,eAAe,GAAG,UAAU,KAAK,MAAM,CAAC,CAAC,CAAC,cAAc,UAAU,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;IAChF,MAAM,aAAa,GAAG,QAAQ,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE,CAAC;IAE5D,MAAM,iBAAiB,GAAG;QACxB,SAAS;QACT,SAAS;QACT,WAAW;QACX,UAAU;QACV,UAAU;QACV,cAAc;QACd,eAAe;QACf,aAAa;QACb,SAAS;KACV,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAE5B,MAAM,SAAS,GAAG,EAAiC,CAAC;IAEpD,OAAO,CACL,oBAAC,SAAS,IAAC,SAAS,EAAE,iBAAiB,IACpC,QAAQ,CACC,CACb,CAAC;AACJ,CAAC,CAAC"}

package/lib/index.d.ts

@@ -4,4 +4,13 @@ export { Card } from './components/Card/Card';
 export type { CardProps } from './components/Card/Card';
 export { Modal } from './components/Modal/Modal';
 export type { ModalProps } from './components/Modal/Modal';
+export { Icon } from './components/Icon/Icon';
+export type { IconProps, IconName } from './components/Icon/Icon';
+export * from './components/Icon/icons';
+export { Space } from './components/Space/Space';
+export type { SpaceProps } from './components/Space/Space';
+export { Flex } from './components/Flex/Flex';
+export type { FlexProps } from './components/Flex/Flex';
+export { Text } from './components/Text/Text';
+export type { TextProps } from './components/Text/Text';
 //# sourceMappingURL=index.d.ts.map

package/lib/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AACpD,YAAY,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAE9D,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAC9C,YAAY,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAExD,OAAO,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAC;AACjD,YAAY,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AACpD,YAAY,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAE9D,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAC9C,YAAY,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAExD,OAAO,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAC;AACjD,YAAY,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAE3D,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAC9C,YAAY,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAClE,cAAc,yBAAyB,CAAC;AAExC,OAAO,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAC;AACjD,YAAY,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAE3D,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAC9C,YAAY,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAExD,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAC9C,YAAY,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC"}

package/lib/index.js

@@ -1,4 +1,9 @@
 export { Button } from './components/Button/Button';
 export { Card } from './components/Card/Card';
 export { Modal } from './components/Modal/Modal';
+export { Icon } from './components/Icon/Icon';
+export * from './components/Icon/icons';
+export { Space } from './components/Space/Space';
+export { Flex } from './components/Flex/Flex';
+export { Text } from './components/Text/Text';
 //# sourceMappingURL=index.js.map

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAGpD,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAG9C,OAAO,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAGpD,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAG9C,OAAO,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAC;AAGjD,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAE9C,cAAc,yBAAyB,CAAC;AAExC,OAAO,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAC;AAGjD,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAG9C,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "pure-react-ui",
-  "version": "1.4.7",
-  "description": "A pure React UI component library with Button, Card, and Modal components",
+  "version": "1.5.0",
+  "description": "A pure React UI component library with Button, Card, Modal, Icon, Space, Flex, and Text components",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",
   "files": [
@@ -21,6 +21,9 @@
     "button",
     "card",
     "modal",
+    "icon",
+    "icons",
+    "svg",
     "pure"
   ],
   "author": "",