@cleartrip/ct-design-conditional-wrap 4.0.0-TEST.1 → 4.1.0-SNAPSHOT-native-main.1

package/README.md

@@ -0,0 +1,166 @@
+# ConditionalWrap
+
+ConditionalWrap conditionally wraps children with a wrapper component based on a boolean condition.
+
+---
+
+## Installation
+
+```bash
+npm install @cleartrip/ct-design-conditional-wrap
+# or
+pnpm add @cleartrip/ct-design-conditional-wrap
+```
+
+### Peer dependencies
+
+```bash
+# Required for all targets
+npm install react
+
+# Web only
+npm install react-dom
+
+# React Native only
+npm install react-native
+```
+
+---
+
+## Usage
+
+### Basic conditional wrapping
+
+```tsx
+import ConditionalWrap from '@cleartrip/ct-design-conditional-wrap';
+
+function Example({ hasLink }: { hasLink: boolean }) {
+  return (
+    <ConditionalWrap
+      condition={hasLink}
+      wrap={(children) => <a href="/link">{children}</a>}
+    >
+      <span>This may or may not be wrapped in a link</span>
+    </ConditionalWrap>
+  );
+}
+```
+
+### Conditional styling wrapper
+
+```tsx
+<ConditionalWrap
+  condition={isHighlighted}
+  wrap={(children) => (
+    <div style={{ backgroundColor: 'yellow', padding: 8 }}>
+      {children}
+    </div>
+  )}
+>
+  <div>Content that might be highlighted</div>
+</ConditionalWrap>
+```
+
+### Modal or dialog wrapper
+
+```tsx
+<ConditionalWrap
+  condition={showInModal}
+  wrap={(children) => (
+    <div className="modal-overlay">
+      <div className="modal-content">
+        {children}
+      </div>
+    </div>
+  )}
+>
+  <div>Content that may appear in a modal</div>
+</ConditionalWrap>
+```
+
+---
+
+## Props
+
+| Prop | Type | Default | Required | Description |
+|------|------|---------|----------|-------------|
+| `condition` | `boolean` | — | Yes | Boolean condition that determines whether to apply the wrapper |
+| `wrap` | `(component: ReactElement) => ReactElement` | — | Yes | Function that wraps the children when condition is true |
+| `children` | `ReactElement` | — | Yes | The child element to conditionally wrap |
+
+---
+
+## Use Cases
+
+### Conditional Links
+Wrap text in a link only when a URL is provided:
+
+```tsx
+<ConditionalWrap
+  condition={!!url}
+  wrap={(children) => <a href={url}>{children}</a>}
+>
+  <span>{linkText}</span>
+</ConditionalWrap>
+```
+
+### Conditional Tooltips
+Add tooltips only when tooltip text exists:
+
+```tsx
+<ConditionalWrap
+  condition={!!tooltipText}
+  wrap={(children) => (
+    <div title={tooltipText}>
+      {children}
+    </div>
+  )}
+>
+  <button>Action Button</button>
+</ConditionalWrap>
+```
+
+### Conditional Form Wrappers
+Wrap form elements conditionally:
+
+```tsx
+<ConditionalWrap
+  condition={isDisabled}
+  wrap={(children) => (
+    <fieldset disabled>
+      {children}
+    </fieldset>
+  )}
+>
+  <input type="text" />
+</ConditionalWrap>
+```
+
+---
+
+## Behavior
+
+- When `condition` is `true`, the `wrap` function is called with `children` as argument
+- When `condition` is `false`, `children` are returned unchanged
+- The component is a pure function with no side effects
+- Only accepts a single child element (ReactElement)
+
+---
+
+## Performance
+
+- Very lightweight component with minimal overhead
+- No state or effects, purely functional
+- Wrapper function is only called when condition is true
+- Consider memoizing the wrap function if it's expensive to create
+
+---
+
+## Migration
+
+If migrating from a previous version:
+
+```diff
+- import { ConditionalWrap } from 'old-package';
++ import ConditionalWrap from '@cleartrip/ct-design-conditional-wrap';
+```

package/dist/ct-design-conditional-wrapper.browser.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=function(e){var r=e.condition,t=e.wrap,n=e.children;return r?t(n):n};
+"use strict";function e({condition:e,wrap:t,children:r}){return e?t(r):r}Object.defineProperty(exports,"__esModule",{value:!0}),exports.ConditionalWrap=e,exports.default=e;
 //# sourceMappingURL=ct-design-conditional-wrapper.browser.cjs.js.map

package/dist/ct-design-conditional-wrapper.browser.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ct-design-conditional-wrapper.browser.cjs.js","sources":["../packages/components/ConditionalWrap/src/index.ts"],"sourcesContent":[null],"names":["_a","condition","wrap","children"],"mappings":"oFAEA,SAAyBA,GACvB,IAAAC,cACAC,EAAIF,EAAAE,KACJC,EAAQH,EAAAG,SAMR,OAAOF,EAAYC,EAAKC,GAAYA,CACtC"}
+{"version":3,"file":"ct-design-conditional-wrapper.browser.cjs.js","sources":["../packages/components/ConditionalWrap/src/index.ts"],"sourcesContent":[null],"names":["ConditionalWrap","condition","wrap","children"],"mappings":"aAEM,SAAUA,GAAgBC,UAC9BA,EAASC,KACTA,EAAIC,SACJA,IAMA,OAAOF,EAAYC,EAAKC,GAAYA,CACtC"}

package/dist/ct-design-conditional-wrapper.browser.esm.js

@@ -1,2 +1,2 @@
-function n(n){var r=n.condition,t=n.wrap,a=n.children;return r?t(a):a}export{n as default};
+function n({condition:n,wrap:r,children:t}){return n?r(t):t}export{n as ConditionalWrap,n as default};
 //# sourceMappingURL=ct-design-conditional-wrapper.browser.esm.js.map

package/dist/ct-design-conditional-wrapper.browser.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ct-design-conditional-wrapper.browser.esm.js","sources":["../packages/components/ConditionalWrap/src/index.ts"],"sourcesContent":[null],"names":["ConditionalWrap","_a","condition","wrap","children"],"mappings":"AAEA,SAASA,EAAgBC,GACvB,IAAAC,cACAC,EAAIF,EAAAE,KACJC,EAAQH,EAAAG,SAMR,OAAOF,EAAYC,EAAKC,GAAYA,CACtC"}
+{"version":3,"file":"ct-design-conditional-wrapper.browser.esm.js","sources":["../packages/components/ConditionalWrap/src/index.ts"],"sourcesContent":[null],"names":["ConditionalWrap","condition","wrap","children"],"mappings":"AAEM,SAAUA,GAAgBC,UAC9BA,EAASC,KACTA,EAAIC,SACJA,IAMA,OAAOF,EAAYC,EAAKC,GAAYA,CACtC"}

package/dist/ct-design-conditional-wrapper.cjs.js

@@ -2,10 +2,10 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-function ConditionalWrap(_a) {
-    var condition = _a.condition, wrap = _a.wrap, children = _a.children;
+function ConditionalWrap({ condition, wrap, children, }) {
     return condition ? wrap(children) : children;
 }
 
+exports.ConditionalWrap = ConditionalWrap;
 exports.default = ConditionalWrap;
 //# sourceMappingURL=ct-design-conditional-wrapper.cjs.js.map

package/dist/ct-design-conditional-wrapper.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ct-design-conditional-wrapper.cjs.js","sources":["../packages/components/ConditionalWrap/src/index.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;AAEA,SAAS,eAAe,CAAC,EAQxB,EAAA;AAPC,IAAA,IAAA,SAAS,eAAA,EACT,IAAI,GAAA,EAAA,CAAA,IAAA,EACJ,QAAQ,GAAA,EAAA,CAAA,QAAA,CAAA;AAMR,IAAA,OAAO,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,QAAQ,CAAC;AAC/C;;;;"}
+{"version":3,"file":"ct-design-conditional-wrapper.cjs.js","sources":["../packages/components/ConditionalWrap/src/index.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;AAEM,SAAU,eAAe,CAAC,EAC9B,SAAS,EACT,IAAI,EACJ,QAAQ,GAKT,EAAA;AACC,IAAA,OAAO,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,QAAQ,CAAC;AAC/C;;;;;"}

package/dist/ct-design-conditional-wrapper.esm.js

@@ -1,7 +1,6 @@
-function ConditionalWrap(_a) {
-    var condition = _a.condition, wrap = _a.wrap, children = _a.children;
+function ConditionalWrap({ condition, wrap, children, }) {
     return condition ? wrap(children) : children;
 }
 
-export { ConditionalWrap as default };
+export { ConditionalWrap, ConditionalWrap as default };
 //# sourceMappingURL=ct-design-conditional-wrapper.esm.js.map

package/dist/ct-design-conditional-wrapper.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ct-design-conditional-wrapper.esm.js","sources":["../packages/components/ConditionalWrap/src/index.ts"],"sourcesContent":[null],"names":[],"mappings":"AAEA,SAAS,eAAe,CAAC,EAQxB,EAAA;AAPC,IAAA,IAAA,SAAS,eAAA,EACT,IAAI,GAAA,EAAA,CAAA,IAAA,EACJ,QAAQ,GAAA,EAAA,CAAA,QAAA,CAAA;AAMR,IAAA,OAAO,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,QAAQ,CAAC;AAC/C;;;;"}
+{"version":3,"file":"ct-design-conditional-wrapper.esm.js","sources":["../packages/components/ConditionalWrap/src/index.ts"],"sourcesContent":[null],"names":[],"mappings":"AAEM,SAAU,eAAe,CAAC,EAC9B,SAAS,EACT,IAAI,EACJ,QAAQ,GAKT,EAAA;AACC,IAAA,OAAO,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,QAAQ,CAAC;AAC/C;;;;"}

package/dist/ct-design-conditional-wrapper.umd.js

@@ -4,11 +4,11 @@
     (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.CTDesignSystem = {}));
 })(this, (function (exports) { 'use strict';
 
-    function ConditionalWrap(_a) {
-        var condition = _a.condition, wrap = _a.wrap, children = _a.children;
+    function ConditionalWrap({ condition, wrap, children, }) {
         return condition ? wrap(children) : children;
     }
 
+    exports.ConditionalWrap = ConditionalWrap;
     exports.default = ConditionalWrap;
 
     Object.defineProperty(exports, '__esModule', { value: true });

package/dist/ct-design-conditional-wrapper.umd.js.map

@@ -1 +1 @@
-{"version":3,"file":"ct-design-conditional-wrapper.umd.js","sources":["../packages/components/ConditionalWrap/src/index.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;;;IAEA,SAAS,eAAe,CAAC,EAQxB,EAAA;IAPC,IAAA,IAAA,SAAS,eAAA,EACT,IAAI,GAAA,EAAA,CAAA,IAAA,EACJ,QAAQ,GAAA,EAAA,CAAA,QAAA,CAAA;IAMR,IAAA,OAAO,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,QAAQ,CAAC;IAC/C;;;;;;;;;;"}
+{"version":3,"file":"ct-design-conditional-wrapper.umd.js","sources":["../packages/components/ConditionalWrap/src/index.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;;;IAEM,SAAU,eAAe,CAAC,EAC9B,SAAS,EACT,IAAI,EACJ,QAAQ,GAKT,EAAA;IACC,IAAA,OAAO,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,QAAQ,CAAC;IAC/C;;;;;;;;;;;"}

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import { ReactElement } from 'react';
-declare function ConditionalWrap({ condition, wrap, children, }: {
+export declare function ConditionalWrap({ condition, wrap, children, }: {
     condition: boolean;
     wrap: (component: typeof children) => ReactElement;
     children: ReactElement;

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../packages/components/ConditionalWrap/src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAErC,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,IAAI,EACJ,QAAQ,GACT,EAAE;IACD,SAAS,EAAE,OAAO,CAAC;IACnB,IAAI,EAAE,CAAC,SAAS,EAAE,OAAO,QAAQ,KAAK,YAAY,CAAC;IACnD,QAAQ,EAAE,YAAY,CAAC;CACxB,GAAG,YAAY,CAEf;AAED,eAAe,eAAe,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../packages/components/ConditionalWrap/src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAErC,wBAAgB,eAAe,CAAC,EAC9B,SAAS,EACT,IAAI,EACJ,QAAQ,GACT,EAAE;IACD,SAAS,EAAE,OAAO,CAAC;IACnB,IAAI,EAAE,CAAC,SAAS,EAAE,OAAO,QAAQ,KAAK,YAAY,CAAC;IACnD,QAAQ,EAAE,YAAY,CAAC;CACxB,GAAG,YAAY,CAEf;AAED,eAAe,eAAe,CAAC"}

package/package.json

@@ -1,19 +1,30 @@
 {
   "name": "@cleartrip/ct-design-conditional-wrap",
-  "version": "4.0.0-TEST.1",
+  "version": "4.1.0-SNAPSHOT-native-main.1",
   "description": "",
   "types": "dist/index.d.ts",
-  "main": "dist/ct-design-conditional-wrapper.cjs.js",
+  "main": "./dist/ct-design-conditional-wrapper.cjs.js",
   "jsnext:main": "dist/ct-design-conditional-wrapper.esm.js",
   "module": "dist/ct-design-conditional-wrapper.esm.js",
   "sideEffects": false,
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/ct-design-conditional-wrapper.esm.js",
+      "default": "./dist/ct-design-conditional-wrapper.cjs.js"
+    }
+  },
   "browser": {
     "./dist/ct-design-conditional-wrapper.esm.js": "./dist/ct-design-conditional-wrapper.browser.esm.js",
     "./dist/ct-design-conditional-wrapper.cjs.js": "./dist/ct-design-conditional-wrapper.browser.cjs.js"
   },
   "files": [
-    "dist"
+    "dist",
+    "src"
   ],
+  "dependencies": {
+    "@cleartrip/ct-design-theme": "4.0.0-SNAPSHOT-native-main.12"
+  },
   "peerDependencies": {
     "react": ">=16.8.0",
     "react-dom": ">=16.8.0"
@@ -26,6 +37,8 @@
   "scripts": {
     "watch-package": "rollup -c -w",
     "build-package": "rollup -c",
-    "build-package:clean": "rm -rf dist && rollup -c"
+    "build-package:clean": "rm -rf dist && rollup -c",
+    "publish-package:local": "yalc publish --no-scripts",
+    "publish-package:local:registry": "pnpm publish --registry http://localhost:4873 --no-git-checks --access public"
   }
 }

package/src/index.ts

@@ -0,0 +1,15 @@
+import { ReactElement } from 'react';
+
+export function ConditionalWrap({
+  condition,
+  wrap,
+  children,
+}: {
+  condition: boolean;
+  wrap: (component: typeof children) => ReactElement;
+  children: ReactElement;
+}): ReactElement {
+  return condition ? wrap(children) : children;
+}
+
+export default ConditionalWrap;